UGUI 學習筆記

1.UGUI中是沒有depth的概念，那要怎么在腳本中動態的改變一個UI元素在hierarchy中的排序位置呢？

放到最上面 Transform.SetAsFirstSibling
最下面Transform.SetAsLastSibling
某一處 Transform.SetSiblingIndex

 

2.查看並調試UGUI源碼

教程：http://www.tuicool.com/articles/6V7zqi

源碼：https://bitbucket.org/Unity-Technologies/ui/src/cc791b3335d2d46b70d932fc70e6ec6c4ea6d561?at=5.2

 

3.關於Anchors

Anchors表示父UI中的某個百分比的位置，其取值范圍為0~1，

其Min與Max分別對應左上與右下，例如：

、

Min X:0 Y:0 Max X:1 Y:1　　表示父UI的四個角的位置，如下圖所示。

UGUI中，子UI的四個角分別與Anchors的四個角對應，可以通過設置Anchors的位置來實現子UI隨着父UI變化而變化的

方式，2圖中的Left Top Right Bottom分別表示子UI的左上、右下與Anchors的左上、右下的間距。

這個距離是固定的，不管父UI怎么變化，子UI的四個角一直與Anchors保持恆定距離。

例如：

如上所示的UI，不管其父UI怎么拉伸，子UI一直與父UI保持一直的比例，因為子UI的四個角與父UI的四個角之間的距離

一直保持定值。

 

4.UGUI中制作自適應調整大小的滾動布局控件

可用於制作歌詞顯示滾動框，自動隨着歌詞的長度伸縮滾動框的大小，需要在滾動框里加入Content Size Filter組件。

http://blog.csdn.net/rcfalcon/article/details/43459387

 

5.UGUI動態設置UI的RectTransform組件參數

RectTransform的top
GetComponent<RectTransform>().offsetMax = new Vector2(left, top);
GetComponent<RectTransform>().offsetMin = new Vector2(right, bottom);
RectTransform的width，height
GetComponent<RectTransform>().sizeDelta = new Vector2(width, height);
RectTransform的pos
GetComponent<RectTransform>().anchoredPosition3D = new Vector3(posx,posy,posz);
GetComponent<RectTransform>().anchoredPosition = new Vector2(posx,posy);

 

6.UGUI文字加入漸變效果

using UnityEngine;
using System.Collections.Generic;
using UnityEngine.UI;

[AddComponentMenu("UI/Effects/Gradient")]
public class Gradient : BaseMeshEffect
{
    [SerializeField]
    private Color32
        topColor = Color.white;
    [SerializeField]
    private Color32
        bottomColor = Color.black;

    public override void ModifyMesh(Mesh mesh)
    {
        if (!IsActive())
        {
            return;
        }

        Vector3[] vertexList = mesh.vertices;
        int count = mesh.vertexCount;
        if (count > 0)
        {
            float bottomY = vertexList[0].y;
            float topY = vertexList[0].y;

            for (int i = 1; i < count; i++)
            {
                float y = vertexList[i].y;
                if (y > topY)
                {
                    topY = y;
                }
                else if (y < bottomY)
                {
                    bottomY = y;
                }
            }
            List<Color32> colors = new List<Color32>();
            float uiElementHeight = topY - bottomY;
            for (int i = 0; i < count; i++)
            {
                colors.Add(Color32.Lerp(bottomColor, topColor, (vertexList[i].y - bottomY) / uiElementHeight));
            }
            mesh.SetColors(colors);
        }
    }
}

注：最新的5.3版已經將該方法改成ModifyMesh(VertexHelper vh)

要在 VertexHelper 參數里實現對mesh的修改。

 

7.UGUI實現新手指引只能點擊某部分的方法

可以不需要加CanvasGroup組件，只需要實現 ICanvasRaycastFilter 這個接口就能自己控制是否阻止鼠標事件。
而且這個接口還可以做新手教程時只允許部分位置可點擊的效果

 

8.UGUI中的顯示層級關系

同一個Canvas中，UI間的顯示先后與UI的位置有關系，同一層級，UI越靠下層，顯示在越前面。

不同Canvas中，UI的顯示先后與該UI的Z軸有關，Z軸越靠上，則顯示在越前面。