NGUI

NGUI源碼路徑： https://blog.csdn.net/cbbbc/article/list/1

https://blog.csdn.net/chrisfxs/article/details/50148901 

https://www.cnblogs.com/zhibolife/p/3642000.html  //深入剖析UIPanel,UIWidget,UIDrawCall底層原理

完美像素： 使得像素匹配屏幕，意味着你的UI在高分辨率的設備上看起來更小，在低分辨率設備上看起來更大，但是它總是儘可能的清晰。

Lable: 

Overflow:  字體溢出時的操作

Resize Height: 溢出時調整高度的尺寸，其實就是限寬。

Resize Freely: 溢出時自由調整。 其實就是限高。

Alignment: 對齊方式。

<1. 自動對齊,默認是使用居中對齊。

Sprite

Panle

Button： 

  添加BoxColider(ngui中的)組件和Button組件。

  UnityVS插件是連接vs2012和unity之間交互的。

Lable_Button    點擊後改變lable;

Sprite_Button   點擊後改變Sprite;

Sprite_Button和Lable_Button組合使用：

每個附加的UI Button腳本都有一個Target目標，表示當點擊時，控制目標物件的一些變化。所以在組合使用時，

給Sprite_Button再加一個Button腳本組件(黏貼一個組件)，用來控制點擊時對lable的變化。

問題：ugui自定義的button，在第一次鼠標移動進去時放在button上，直接點擊時，第一次沒反應。必須要先在場景裏點擊一下，捕獲到鼠標之後再點擊纔有反應  ？？？？； UGUI是可以的。

打包圖集：導入圖片；創建圖集，new一個，更新，刪除；

自己發現:

<1. 圖集的大小取決於打包的圖片的大小，可以把小圖打到一個圖集裏；

<2. 同時使用的atlas的數量降低到最小；

九宮切圖

NGUI使用動態字體:

動態字體：不是圖集的一部分，增加drawcall；

靜態字體：是圖集的一部分,把固定的漢字寫到一個圖片上。

Widget  支點、錨點

Pivot: 位置，左中右、上中下；

deph: 小->深

snap： 恢復到原來的大小

appect: 比例，設置大小。

11. Anchor:
固定死各個邊的距離後，來調整物件的大小。不設置Anchor時，默認是以中心點保持不變。

圖片的左邊框的位置和target的中心點（左邊框、右邊框等 +-  value）保持不變。
Target:　是目標物體（在這裏指ui root）的中心點或者左右邊框的位置。
<1. 即 Left＝Target Center＋(-50) 這段的距離大小是保持不變,表現在試圖中，則框出的距離保持不變。

<2. 如果Left＝Target Left＋(234),即圖片的左邊框+234這段距離是保持不變的。在自適應時，則會改變圖片的寬度來使得這個距離保持不變。

<3. 保持圖片大小不變，相對右上角的位置也是不變；

<4. 保持圖片大小不變，相對中心的位置也是不變；

12.Itween  

縮放、位置、旋轉

13.Slider滑動條

<1. creat sprite-->add boxcolider-->add slider script 

<2. creat foreBG-->creat thumb(設置anthor)-->creat lable

<3. 設置slider的Notify通知，來通知SetCurrentPrecent()

背景和遊標自己控制

15.設置聲音、文字打印機

添加聲音： 直接添加playsound組件就可以了。

添加打印機效果：給lable添加Typewrtier  Effect組件就可以；

17.Popup List 設置下拉列表

creat sprite-->add boxcolider-->add ui popup list-->add notify （SetCrrentSelect()）

特別要注意此處的字的大小要一直！！！ ui popup list組件中的字體要設置成bitmap的默認字體；

注意：

下拉列表中不要有空格；

對下拉列表的值進行取空格操作：UIPopupList.current.value.Trim()

18. CheckBox 單選框的創建

creat sprite-->add boxcolider&toggle -  creat sprite(toggle)

20.獲取控件的值

<1. 直接拖。

<2.獲取當前正在操作的引用。 UIPopupList.current.value.Trim()

22. 技能冷卻

23.在輸入框中輸入單行文本和多行文本

單行和多行； 回車； 

creat sprite-->add BoxColider & InputField-->creat lable

怎麼自動拉長出入便捷？？？

24.用戶名，密碼  

ngui做了基本的校驗；限制數字，長度，passward,Name（會自動的進行首字母大寫）

怎麼自動調用小鍵盤？？？

26.添加可拖拽和調節大小的功能

在ngui編輯器下是沒有的，需要手動添加腳本，UIDragObject.cs即可拖拽；

添加小控件，調節UI大小。UIDragResize.cs

27.創建ScrollBar滾動條；

value: 滑塊可以移動的區域  設置walue=0時，即滑塊是在左邊； size：滑塊的大小  

28. 創建可滑動的Lable:

29\30\31   設計聊天框並且設置Anchor

32.使用腳本控制內容顯示，輸入事件交互

控制輸入，添加到面板中UITextList中。

33.  物體添加拖拽功能和事件監聽。

UIDragDropItem.cs  是拖和放。自動生成格子？？

34，35，36：

 protected override void OnDragDropStart()
    {
        base.OnDragDropStart();
        uiSprite.depth++;

    }
    protected override void OnDragDropRelease(GameObject surface)
    {
        base.OnDragDropRelease(surface);
        if(surface==null)
        {
            this.transform.localPosition = Vector3.zero;
        }
        else if (surface.CompareTag("cell"))
        {
            this.transform.parent = surface.transform;
            this.transform.localPosition = Vector3.zero;
        }
        else if (surface.CompareTag("knapsack_item"))
        {
            Transform parent = surface.transform.parent;
            //把原格子的物品移到新格子的父物體中
            surface.transform.parent = this.transform.parent;
            surface.transform.localPosition = Vector3.zero;

            //放置新物體
            this.transform.parent = parent;
            this.transform.localPosition = Vector3.zero;
        }
        uiSprite.depth--;
    }

38.血條和3D跟隨

HUD Text插件 ， creat processSlider  -->add UIFollowTarget.cs;

注意：需要把添加了UIFollowTarget.cs腳本的物體的localposition置爲0，否則跟隨不準確；

39.顯示傷害和治療效果

add HUDText.cs->add  文字；

主要功能是飄字，可以設置美術字體和動態字體；結合跟隨使用；

40 .ScrollView :滾動視口組件   滑動窗; 設置滑動窗的位置。

UIGrid:

要reset，它應該和item的大小保持一致。方便位置的對齊；添加UIGrid.cs，會自動跳轉item之間的相對位置，設置item在父級中的對齊方式。給UIGrid添加組件UICenterOnChild.cs ，使得當滑動item時該item在ScrollView中自動居中居中。注意，此時不再進行uigrid頭和尾的居中。

Item:

item 要reset。添加UIDragScrollView.cs，會使得item有滑動功能。

UICenterOnClick.cs:　使得當點擊item時該item在ScrollView中自動居中居中。

ScrollView、Grid和Table:   https://www.cnblogs.com/hammerc/p/4656505.html

 

Table

Grid是對子項進行水平或垂直的排序，而Table是對子項進行可換行的排序。

Table是以Table的左上角開始排序，而Grid是以Grid的center點開始排序；

Table設置 :

Grid設置： 

Grid和Table的混合使用： 

優化： 三個Item_Table,來循環使用；使用BagWrapContent.cs來實現循環；需要配合UIScrollView.cs->ContentOrigin和Movement；

using UnityEngine;
using System.Collections.Generic;

public class BagWrapContent : MonoBehaviour {

    /// <summary>
    /// Width or height of the child items for positioning purposes.
    /// </summary>
    public int itemSize = 100;

    /// <summary>
    /// Maximum allowed index for items. If "min" is equal to "max" then there is no limit.
    /// For vertical scroll views indices increment with the Y position (towards top of the screen).
    /// </summary>

    public int maxIndex = 0;

    public int minIndex = 0;

    protected bool mHorizontal = false;

    protected Transform mTrans;
    protected UIPanel mPanel;
    protected UIScrollView mScroll;
    List<Transform> mChildren = new List<Transform>();
    // Use this for initialization
    void Start()
    {
        if (!CacheScrollView()) return;

        mPanel.onClipMove = WrapContent;
        mChildren.Clear();
        for (int i = 0; i < mTrans.childCount; ++i)
            mChildren.Add(mTrans.GetChild(i));
    }


    /// <summary>
    /// Cache the scroll view and return 'false' if the scroll view is not found.
    /// </summary>

    protected bool CacheScrollView()
    {
        mTrans = transform;
        mPanel = NGUITools.FindInParents<UIPanel>(gameObject);
        mScroll = mPanel.GetComponent<UIScrollView>();
        if (mScroll == null) return false;
        if (mScroll.movement == UIScrollView.Movement.Horizontal) mHorizontal = true;
        else if (mScroll.movement == UIScrollView.Movement.Vertical) mHorizontal =  false;
        else return false;
        return true;
    }

    public void WrapContent(UIPanel panel)
    {
        float extents = itemSize * mChildren.Count * 0.5f;
        Vector3[] corners = mPanel.worldCorners;

        for (int i = 0; i < 4; ++i)
        {
            Vector3 v = corners[i];
            v = mTrans.InverseTransformPoint(v);
            corners[i] = v;
        }

        Vector3 center = Vector3.Lerp(corners[0], corners[2], 0.5f);
        float ext2 = extents * 2f;

        if (mHorizontal)
        {
            //float min = corners[0].x - itemSize;  //Remove Unused
            //float max = corners[2].x + itemSize;  //Remove Unused

            for (int i = 0, imax = mChildren.Count; i < imax; ++i)
            {
                Transform t = mChildren[i];
                float distance = t.localPosition.x - center.x;

                if (distance < -extents)
                {
                    Vector3 pos = t.localPosition;
                    pos.x += ext2;
                    distance = pos.x - center.x;
                    int realIndex = Mathf.RoundToInt(pos.x / itemSize);

                    if (minIndex == maxIndex || (minIndex <= realIndex && realIndex <= maxIndex))
                    {
                        t.localPosition = pos;
                        UpdateItem(t, i);
                    }
                }
                else if (distance > extents)
                {
                    Vector3 pos = t.localPosition;
                    pos.x -= ext2;
                    distance = pos.x - center.x;
                    int realIndex = Mathf.RoundToInt(pos.x / itemSize);

                    if (minIndex == maxIndex || (minIndex <= realIndex && realIndex <= maxIndex))
                    {
                        t.localPosition = pos;
                        UpdateItem(t, i);
                    }
                }
            }
        }
        if (mHorizontal == false)
        {
            test(center, extents, ext2);
        }
    }

    public void test(Vector3 center,float extents, float ext2)
    {
        if (mHorizontal == false)
        {
            for (int i = 0, imax = mChildren.Count; i < imax; ++i)
            {
                Transform t = mChildren[i];
                float distance = t.localPosition.y - center.y;

                if (distance < -extents)
                {
                    Vector3 pos = t.localPosition;
                    pos.y += ext2;
                    distance = pos.y - center.y;
                    int realIndex = Mathf.RoundToInt(pos.y / itemSize);

                    if (minIndex == maxIndex || (minIndex <= realIndex && realIndex <= maxIndex))
                    {
                        t.localPosition = pos;
                        UpdateItem(t, i);
                    }
                }
                else if (distance > extents)
                {
                    Vector3 pos = t.localPosition;
                    pos.y -= ext2;
                    distance = pos.y - center.y;
                    int realIndex = Mathf.RoundToInt(pos.y / itemSize);

                    if (minIndex == maxIndex || (minIndex <= realIndex && realIndex <= maxIndex))
                    {
                        t.localPosition = pos;
                    }
                }
            }
        }
    }
    protected virtual void UpdateItem(Transform item, int index)
    {
        if (onInitializeItem != null)
        {
            if (mHorizontal == true)
            {
                int realIndex = Mathf.RoundToInt(item.localPosition.x / itemSize);
                item.GetComponent<UIData>().mIndex = realIndex + 1;
                onInitializeItem(item.gameObject, realIndex + 1);
            }
            if (mHorizontal == false )
            {
                int realIndex = Mathf.RoundToInt(item.localPosition.y / itemSize);
                item.GetComponent<UIData>().mIndex = realIndex + 1;
                onInitializeItem(item.gameObject, realIndex + 1);
            }
        }
    }
    public delegate void OnInitializeItem(GameObject go, int realIndex);

    public OnInitializeItem onInitializeItem;
}

UGUI深度的問題：

<1. Panel會把材質相同(shader)的圖集進行合併；圖集不同，圖片相同也會增加drawcall;這是爲什麼每個功能面板用Panel的原因，但是如果太多也不行，因爲稍微改變下面板的子物體，則會發生重繪。

Panel Widget DrawCall 三者之間的關係如下: