Figure 0
Well, gossip doesn't say much, let's get started ~
Figure 1
here is still to name the surname of the kimchi children's shoes, this part of the preset in Figure 1 is when I first took over, the structure is as follows:
Ui_shop: The parent object of the entire store
SHOP_BG: Store's brown floor background
SHOP_TITLE_BG: Banner store two words, including the banner itself
Shop_head: Hina shop Sister head
Shop_refresh_button: Refresh button
BACKBT: Back button
shop_product_bg_00: Product code XX
shop_product_bg_01: Ibid .
shop_product_bg_02: Ibid .
shop_product_bg_03: Ibid .
shop_product_bg_04: Ibid .
shop_product_bg_05: Ibid .
Yes, no, we'll analyze what art materials are needed in the store.
product art materials include:
quality frame (e.g.,)
symbol icons (such as,,,) "slightly larger workload "
sort Small icons (such as,)
Cost icon (such as,)
The light collects these material expense the friend son Dickens Ah, pure man son ~ This is just the first step,
Next, when the footage is sufficient, we start to build the presets.
Yes, if Declan old wet not guessed wrong, must have careful little bull will find:
the icon of the item is basically the ———— of such a child >, is four-sided.
and the quality frame like "fragment" or "Soul Stone" is similar to Jiangzi ———— >, a pair of corners are cropped.
"What if the two graphs overlap, beyond the outer frame?" "such as
"What if I just scaled down the scale of the item icon, even if it didn't go out of the box, but the whole UI looked hollow?" "such as
If the audience in front of the TV ... Uh, no. It is the same problem that the novice readers before the display, do not worry or fear, it is just because we are novice because of inexperienced and inexperience, lack of mask mask concept.
Figure 2
So what does the so-called mask, in unity, accomplish?
Figure 3
you need to create a material ball and select the shader as the shader script we wrote, then drag the Hero icon to the base item, and drag the fragment mask icon with the alpha channel onto the culling mask. The code is as follows:
- Shader "Custom/depthmaskshader" {
- Properties
- {
- _maintex ("Base (RGB)", 2D) = "White" {}
- _mask ("Culling Mask", 2D) = "White" {}
- _cutoff ("Alpha Cutoff", Range (0,1)) = 0.1
- }
- Subshader
- {
- Tags {"Queue" = "Transparent"}
- Lighting OFF
- Zwrite OFF
- Blend Srcalpha Oneminussrcalpha
- Alphatest gequal [_cutoff]
- Pass
- {
- SetTexture [_mask] {combine texture}
- SetTexture [_maintex] {combine texture, previous}
- }
- }
- }
Copy Code
display effect as shown in 4
Ok,shader is not the focus of this article, but after a brief explanation, we start to get to the point. Article origin "Dog planing learning Net"
In fact, Unity's new UI system--ugui has done a similar component for us, 5
Figure 5
Usage: Add this component directly to the icon with an alpha channel where you need to implement the mask.
Then, after knowing the concept of masking and the use of the mask component, we look at the hierarchical structure of individual product presets more clearly. 6
Figure 6
As shown, the default hierarchy relationship is: SHOP_PRODUCT_BG: is a single product preset, parent object. Goods: is a specific item preset parent object full: is a complete article like a short stick, a potion of experience chip: a piece of debris such as a flute reel or a non-complete object of a soul stone Chip_ Mask: In addition to the image component added the Mask component Cardicon: is the specific item icon kind: is a fragment (yellow) or Soul stone (purple) icon count: is the specific number of this article Title: the Product name cost: The specific value of the purchase of the product Image: for cost type (e.g. gold, crystal, etc.) Soldoutimage: The sold-out icon that will be displayed when the purchase is complete
Unity3d Game Development Trader Module development experience
