【Unity3D-UGUI应用篇】（三）使用UGUI实现层级菜单-六虎

这是我参与11月更文挑战的第21天，活动详情查看：2021最终一次更文挑战

推荐阅读

CSDN主页

GitHub开源地址

Unity3D插件共享

简书地址

我的个人博客

QQ群：1040082875

我们好，我是佛系工程师☆安静的小魔龙☆，不定时更新Unity开发技巧，觉得有用记得一键三连哦。

一、前言

前段时间共享了UGUI的每个组件的属性和运用方法，比方Text、Button、Image、Toggle、InputField、ScrollView等等。

接着共享了UGUI的一些原理，比方说UGUI的渲染形式、UGUI的缩放计算、UGUI的描点定位、UGUI的自动布局等等。

信任我们看完后会对UGUI有一个比较全面的认识了。

下面，就持续共享UGUI的UI组件进行应用的实例。

二、介绍及作用图

层级菜单在Unity中用到的并不多，主要是做分类的时分用的比较多，今日就给我们共享几个层级代码，扩充一下，写成插件也是不错的。

首要看一下作用吧。

第一种作用：

第二种作用：

第三种作用：

第四种作用：

第五种作用：

源文件：

源文件下载

Github下载地址： LayerMenu.unitypackage

三、完成

第一种完成作用

完成原理：

这个是用体系自带的UGUI Scroll View组件，脚本操控创立父物体，父物体身上挂载有初始化子物体的脚本

优缺陷：长处是完成简略，不需求多与的插件，代码量也不大，操控比较方便缺陷是只能完成两个层级的显现

完成进程：

1、新建一个Scrpll View

2、制造预制体

界面就这么规划就行：

姓名改一下 Content：父节点容器 ParentMenu：父节点 TextParent：父节点文本 ChildMenu：子节点容器 item：子节点 TextChild：子节点文本

然后将父节点改姓名叫parentMenu，做成预制体：

预制体放到Resources文件夹中：

将子物体也制造成预制体：

3、编写脚本ParentMenu.cs 这个脚本主要是作用是创立子物体：

using System.Collections;
using UnityEngine;
using UnityEngine.UI;
public class ParentMenu : MonoBehaviour
{
    private GameObject childMenu;//子菜单的parent
    private RectTransform[] childs;//一切子菜单的rect
    private RectTransform itemRect;//子菜单的prefab
    private Vector3 offset;//单个子菜单的高度
    private int count;//子菜单的个数
    public bool isOpening { get; private set; }//父菜单是否展开
    public bool isCanClick { get; set; }//父菜单是否能够点击
    public void Init(RectTransform rect, int count)
    {
        //找到子节点
        childMenu = transform.Find("childMenu").gameObject;
        itemRect = rect;
        this.count = count;
        childs = new RectTransform[this.count];
        offset = new Vector3(0, itemRect.rect.height);
        for (int i = 0; i < this.count; i++)
        {
            childs[i] = Instantiate(itemRect, childMenu.transform);
        }
        childMenu.gameObject.SetActive(false);
        isOpening = false;
        isCanClick = true;
        GetComponent<Button>().onClick.AddListener(OnButtonClick);
    }
    void OnButtonClick()
    {
        if (!isCanClick) return;
        if (!isOpening)
            StartCoroutine(ShowChildMenu());
        else
            StartCoroutine(HideChildMenu());
    }
    IEnumerator ShowChildMenu()
    {
        childMenu.gameObject.SetActive(true);
        for (int i = 0; i < count; i++)
        {
            childs[i].localPosition -= i * offset;
            yield return new WaitForSeconds(0.1f);
        }
        isCanClick = true;
        isOpening = true;
    }
    IEnumerator HideChildMenu()
    {
        for (int i = count - 1; i >= 0; i--)
        {
            childs[i].localPosition += i * offset;
            yield return new WaitForSeconds(0.1f);
        }
        childMenu.gameObject.SetActive(false);
        isCanClick = true;
        isOpening = false;
    }
}

4、编写脚本FoldableMenu.cs 这个脚本主要是为了创立父物体，以及操控折叠菜单

using System.Collections;
using UnityEngine;
using UnityEngine.UI;
public class FoldableMenu : MonoBehaviour
{
    private RectTransform content;//父物体的parent
    private TextAsset textAsset;//一切菜单信息
    private RectTransform parentRect;//父菜单的prefab
    private RectTransform[] parentArr;//一切父菜单的数组
    private RectTransform childRect;//子菜单的prefab
    private Vector3 parentOffset;//单个父菜单的高度
    private Vector3 childOffset;//单个父菜单的高度
    private int[] cntArr;//一切父菜单拥有的子菜单个数
    void Awake()
    {
        Init();
    }
    void Init()
    {
        //获取到父节点
        content = transform.Find("Viewport/Content").GetComponent<RectTransform>();
        //获取到menuinfo里边的信息  3 3 4 4 5 5
        textAsset = Resources.Load<TextAsset>("menuInfo");
        //获取到父物体 设置父物体的高度
        parentRect = Resources.Load<RectTransform>("parentMenu");
        parentOffset = new Vector3(0, parentRect.rect.height);
        //获取到子物体 设置子物体的高度
        childRect = Resources.Load<RectTransform>("item");
        childOffset = new Vector3(0, childRect.rect.height);
        //分割字符串 info = 3 3 4 4 5 5
        var info = textAsset.text.Split(',');//获取子菜单个数信息
        //数组的长度
        cntArr = new int[info.Length];
        //父菜单的数组
        parentArr = new RectTransform[info.Length];
        //初始化content高度 宽度不变 高度是一切父物体的总长
        content.sizeDelta = new Vector2(content.rect.width, parentArr.Length * parentRect.rect.height);
        //i = 6
        for (int i = 0; i < cntArr.Length; i++)
        {
            //创立服务器
            parentArr[i] = Instantiate(parentRect, content.transform);
            //坐标为 上一个父物体的宽度
            parentArr[i].localPosition -= i * parentOffset;
            //赋值
            cntArr[i] = int.Parse(info[i]);
            //父物体上面加载子物体 子物体数量为3 3 4 4 5 5
            parentArr[i].GetComponent<ParentMenu>().Init(childRect, cntArr[i]);
            int j = i;
            //父物体上面的button绑定事情
            parentArr[i].GetComponent<Button>().onClick.AddListener(() => { OnButtonClick(j); });
        }
    }
    void OnButtonClick(int i)
    {
        //如果iscanclick为false则return  由于现已点击过了 不能再点击了 除非升起来的时分将isCanClick改为true
        if (!parentArr[i].GetComponent<ParentMenu>().isCanClick)
            return;
        parentArr[i].GetComponent<ParentMenu>().isCanClick = false;
        //isopening 为true 履行 menuup 为flase履行menuDown
        if (!parentArr[i].GetComponent<ParentMenu>().isOpening)
            StartCoroutine(MenuDown(i));
        else
            StartCoroutine(MenuUp(i));
    }
    IEnumerator MenuDown(int index)
    {       
        for (int i = 0; i < cntArr[index]; i++)
        {
            //更新content高度
            content.sizeDelta = new Vector2(content.rect.width,
                content.rect.height + childOffset.y);
            for (int j = index + 1; j < parentArr.Length; j++)
            {
                parentArr[j].localPosition -= childOffset;
            }
            yield return new WaitForSeconds(0.1f);
        }     
    }
    IEnumerator MenuUp(int index)
    {
        for (int i = 0; i < cntArr[index]; i++)
        {
            //更新content高度
            content.sizeDelta = new Vector2(content.rect.width,
                content.rect.height - childOffset.y);
            for (int j = index + 1; j < parentArr.Length; j++)
            {
                parentArr[j].localPosition += childOffset;
            }
            yield return new WaitForSeconds(0.1f);
        }
    }
}

将这个脚本挂载到Scroll View上面：

运行，搞定！

第二种完成作用

完成原理：这个也是用UGUI做的，不相同的是不需求容器组件，主要是寻找父节点，然后保存父节点的信息，下一个节点以父节点为方针进行偏移，或者以父节点为方针做子节点

优缺陷：长处是代码明晰，可扩展性强，不需求规划UGUI 缺陷结构比较简略，没有完成多层级的功用

完成进程： 1、创立预制体

结构比较简略，两个Image，箭头的图片带Button组件（能够下拉和合并）然后将预制体放到Resources文件夹中：

2、编写PublicData.cs脚本一个数据类

using UnityEngine;
public class PublicData
{
    public static Transform parent;
    public static Vector2 currentPosition;
}

3、编写脚本Options_Triangle.cs 初始化子节点的函数

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class Options_Triangle : MonoBehaviour
{
    public Button triangle;
    public Image content;
    public List<Transform> children = new List<Transform>();
    void Start()
    {
        triangle.onClick.AddListener(() =>
        {
            if (triangle.transform.eulerAngles.z == 270)
            {
                triangle.transform.eulerAngles = Vector3.zero;
                for (int i = 0; i < children.Count; i++)
                {
                    children[i].gameObject.SetActive(false);
                }
            }
            else
            {
                triangle.transform.eulerAngles = new Vector3(0, 0, -90);
                for (int i = 0; i < children.Count; i++)
                {
                    children[i].gameObject.SetActive(true);
                }
            }
        });
    }
}

4、编写ClickEvent.cs 这是一个层级菜单的修改功用的脚本

using UnityEngine;
using UnityEngine.UI;
public class ClickEvent : MonoBehaviour
{
    public Button add_options_t;
    public Button add_options;
    public Transform canvasParent;
    void Start()
    {
        add_options_t.onClick.AddListener(() =>
        {
            if (PublicData.parent == null)
            {
                PublicData.parent = Instantiate(Resources.Load<Transform>("Options_triangle"));
                PublicData.parent.transform.SetParent(canvasParent, false);
                PublicData.currentPosition = new Vector2(PublicData.parent.position.x, PublicData.parent.position.y);
            }
            else
            {
                Transform option = Instantiate(Resources.Load<Transform>("Options_triangle"));
                option.transform.SetParent(PublicData.parent, false);
                option.transform.position = new Vector3(PublicData.currentPosition.x + 30, PublicData.currentPosition.y - 32, 0);
                PublicData.parent.GetComponent<Options_Triangle>().triangle.transform.eulerAngles = new Vector3(0, 0, -90);
                PublicData.parent.GetComponent<Options_Triangle>().children.Add(option);
                PublicData.parent = option;
                PublicData.currentPosition = new Vector2(PublicData.parent.position.x, PublicData.parent.position.y);
            }
        });
        add_options.onClick.AddListener(() =>
        {
            if (PublicData.parent == null)
            {
                return;
            }
            PublicData.parent.GetComponent<Options_Triangle>().triangle.transform.eulerAngles = new Vector3(0, 0, -90);
            Transform content = Instantiate(Resources.Load<Transform>("Options"));
            content.transform.SetParent(PublicData.parent, false);
            content.transform.position = new Vector3(PublicData.currentPosition.x + 16, PublicData.currentPosition.y - 32, 0);
            PublicData.parent.GetComponent<Options_Triangle>().children.Add(content);
            PublicData.currentPosition = new Vector2(content.position.x - 16, content.position.y);
        });
    }
}

OK。将ClickEvent脚本挂载在场景中的任一物体身上就能够了

第三种完成作用

完成原理：这个也是用UGUI做的，比较有特点的地方是没有运用一行代码，运用VerticalLayoutGroup和ContentSizeFitter组件的自动排序功用和Button的OnClick组件操控子物体的显现与躲藏来完成层级菜单的功用。

优缺陷：长处是不需求代码操控，简略易用缺陷是需求提早堆砌UI，工作量比较大，然后改动的时分消耗精力大

完成进程： 1、新建Scroll View

2、父节点

父节点有一个Button和一个躲藏的Image

Button

有两个功用

第一个便是显现跟自己方位坐标相同的子物体BtnSelecteStyle，由于BtnSelecteStyle是Button的子物体，所以BtnSelecteStyle就会挡住Button，为啥要挡住呢，由于还需求BtnSelecteStyle的OnClick将子节点收起来 BtnSelecteStyle的OnClick挂载的功用：

第二个便是显现子节点的容器也便是ImgBtnParentLayout

这个ImgBtnParentLayout便是子节点的容器

下面是几个子节点

OK。能够了

第四种完成作用

完成原理：这个是用代码动态生成的，其间一个脚本主要用来创立父物体和子物体，以及父级联系，另一个脚本是设置方位，箭头变化，按钮功用的初始化

优缺陷：长处是代码明晰，结构明了，能够完成层级多级显现、多级目录的设置、树级菜单等缺陷是没有判断最终一个节点的代码，最终一个节点无法设置图片，最终一个节点的功用没有添加

完成进程： 1、首要也是制造预制体

ArrowButton和ArrowButton2都是为了操控子节点的关闭和显现，不同的是ArrowButton是左面的小按钮，还有一个图片显现的功用，ArrowButton2是全体的按钮，不显现，可是点击全体都能够完成显现和躲藏子节点的功用

资源：

图片是白的，仔细看一下还是能看到的 – -，然后保存下载，放到项目中去

2、编写脚本ItemPanelBase.cs 这个脚本是设置节点的方位，以及箭头切换的脚本

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public enum NameSort
{
    Default,
    Active,
    Passive
}
public class ItemPanelBase : MonoBehaviour
{
    private List<ItemPanelBase> childList;//子物体集合
    [HideInInspector]
    public Button downArrow;//下箭头按钮
    public Button downArrow2;//下箭头按钮
    public Sprite down, right, dot;
    public bool isOpen { get; set; }//子物体开启状况
    private Vector2 startSize;//开始巨细
    NameSort m_NameSore = NameSort.Default;
    string m_Name;
    private void Awake()
    {
        childList = new List<ItemPanelBase>();
        downArrow = this.transform.Find("ContentPanel/ArrowButton").GetComponent<Button>();
        downArrow.onClick.AddListener(() =>
        {
            if (isOpen)
            {
                CloseChild();
                isOpen = false;
            }
            else
            {
                OpenChild();
                isOpen = true;
            }
        });
        downArrow2 = this.transform.Find("ContentPanel/ArrowButton2").GetComponent<Button>();
        downArrow2.onClick.AddListener(() =>
        {
            if (isOpen)
            {
                CloseChild();
                isOpen = false;
            }
            else
            {
                OpenChild();
                isOpen = true;
            }
        });
        startSize = this.GetComponent<RectTransform>().sizeDelta;
        isOpen = false;
    }
    //添加子物体到集合
    private void AddChild(ItemPanelBase parentItemPanelBase)
    {
        childList.Add(parentItemPanelBase);
        if (childList.Count >= 1)
        {
            downArrow.GetComponent<Image>().sprite = right;
        }
    }
    //设置当时目标的姓名值
    public void SetName(string _name,NameSort m_sort)
    {
        m_Name = _name;
        m_NameSore = m_sort;
    }
    /// <summary>
    /// 设置父物体，父物体不为一级菜单
    /// </summary>
    /// <param name="parentItemPanelBase"></param>
    public void SetItemParent(ItemPanelBase parentItemPanelBase)
    {
        this.transform.parent = parentItemPanelBase.transform;
        parentItemPanelBase.AddChild(this);
        this.GetComponent<VerticalLayoutGroup>().padding = new RectOffset((int)parentItemPanelBase.downArrow.GetComponent<RectTransform>().sizeDelta.x, 0, 0, 0);
        if (parentItemPanelBase.isOpen)
        {
            this.GetComponent<ItemPanelBase>().AddParentSize((int)this.gameObject.GetComponent<RectTransform>().sizeDelta.y);
        }
        else
        {
            this.transform.gameObject.SetActive(false);
        }
    }
    /// <summary>
    /// 设置父物体，父物体为一级菜单
    /// </summary>
    /// <param name="tran"></param>
    public void SetBaseParent(Transform tran)
    {
        this.transform.parent = tran;
    }
    /// <summary>
    /// 填充Item数据
    /// </summary>
    /// <param name="_name">姓名</param>
    public void InitPanelContent(string _name)
    {
        transform.Find("ContentPanel/Text").GetComponent<Text>().text = _name;
    }
    /// <summary>
    /// 添加一个子物体后更新Panel巨细
    /// </summary>
    /// <param name="change"></param>
    public void UpdateRectTranSize(int change)
    {
        this.gameObject.GetComponent<RectTransform>().sizeDelta = new Vector2(startSize.x, this.gameObject.GetComponent<RectTransform>().sizeDelta.y + change);
    }
    /// <summary>
    /// 添加父物体高度
    /// </summary>
    /// <param name="parentItem"></param>
    /// <param name="change"></param>
    public void AddParentSize(int change)
    {
        if (this.transform.parent.GetComponent<ItemPanelBase>() != null)
        {
            this.transform.parent.GetComponent<ItemPanelBase>().UpdateRectTranSize(change);
            this.transform.parent.GetComponent<ItemPanelBase>().AddParentSize(change);
        }
    }
    /// <summary>
    /// 关闭子物体列表
    /// </summary>
    public void CloseChild()
    {
        if (childList.Count == 0) return;
        foreach (ItemPanelBase child in childList)
        {
            child.gameObject.SetActive(false);
            child.GetComponent<ItemPanelBase>().AddParentSize(-(int)child.gameObject.GetComponent<RectTransform>().sizeDelta.y);
        }
        downArrow.GetComponent<Image>().sprite = right;
    }
    /// <summary>
    /// 翻开子物体列表
    /// </summary>
    public void OpenChild()
    {
        if (childList.Count == 0)
        {
            if (m_Name == "125K读卡器" && m_NameSore == NameSort.Active)
            {
                Debug.Log("125k设备");
            }
            return;
        }
        foreach (ItemPanelBase child in childList)
        {
            child.gameObject.SetActive(true);
            child.GetComponent<ItemPanelBase>().AddParentSize((int)child.gameObject.GetComponent<RectTransform>().sizeDelta.y);
        }
        downArrow.GetComponent<Image>().sprite = down;
    }
}

3、编写脚本PullDownList.cs 这个便是创立层级菜单的脚本：比较繁琐

using System.Collections.Generic;
using UnityEngine;
public class PullDownList : MonoBehaviour
{
    private List<GameObject> itemPanelList;
    public GameObject itemPanel;
    private void Awake()
    {
        itemPanelList = new List<GameObject>();
    }
    void Start()
    {
        for (int i = 0; i < 27; i++)
        {
            //一级菜单
            if(i == 0)
            {
                GameObject newItemPanel = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel);
                newItemPanel.GetComponent<ItemPanelBase>().SetBaseParent(this.transform);
                newItemPanel.GetComponent<ItemPanelBase>().InitPanelContent("层级一");
            }
            //二级菜单
            if (i == 1)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[0].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级二");
            }
            else if (i == 2)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[0].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级二");
            }
            //三级菜单
            else if (i == 3)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[1].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 4)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[1].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 5)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[1].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 6)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[1].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 7)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[2].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 8)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[2].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 9)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[2].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            else if (i == 10)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[2].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级三");
            }
            //四级菜单
            else if (i == 11)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[3].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 12)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[3].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 13)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[4].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 14)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[4].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 15)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[5].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 16)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[5].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 17)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[6].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 18)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[6].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Active);
            }
            else if (i == 19)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[7].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 20)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[7].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 21)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[8].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 22)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[8].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 23)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[9].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 24)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[9].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 25)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[10].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
            else if (i == 26)
            {
                GameObject newItemPanel2 = Instantiate(itemPanel);
                itemPanelList.Add(newItemPanel2);
                newItemPanel2.GetComponent<ItemPanelBase>().SetItemParent(itemPanelList[10].GetComponent<ItemPanelBase>());
                newItemPanel2.GetComponent<ItemPanelBase>().InitPanelContent("层级四");
                newItemPanel2.GetComponent<ItemPanelBase>().SetName("层级四", NameSort.Passive);
            }
        }
    }
}

将脚本挂载在Panel上面

OK，大功告成

第五种完成作用

完成原理：这个是用UI硬堆砌起来的层级菜单，然后经过代码操控目标的躲藏和显现，即可完成层级菜单的折叠与下拉功用，主要用到GridLayoutGroup组件来排序与更新

优缺陷：长处是操作简略，代码也简略，不需求太多的理解，然后能够显现多级菜单，多级内容，以及最终一个节点的功用与图片的设置功用缺陷是需求提早堆砌UI，可扩容性差，前期工作量大，然后后期修改工作量大，最重要的是我觉得这种完成方式蛮low的

完成进程：

1、显现制造UI Panel上面挂载GridLayoutGroup组件

制造UI

UI的话就很简略，一个Button下面两个子物体一个text一个Image，text是显现内容，image是显现箭头

这时分就有人问了，那子物体怎么办，子物体也是同样的结构

便是把image往后拉了一下

三级菜单也相同：

再加一个一级菜单：

是不是so easy….哈哈哈真的好low

脚本功用就很简略一级菜单操控它往下的一切子节点的躲藏于显现

二级菜单操控它往下的一切子节点的躲藏于显现

以此类推。。。。

2、修改代码PullDown.cs

using UnityEngine;
using UnityEngine.UI;
public class PullDown : MonoBehaviour
{
    public Button m_Btn1;//一级菜单按钮
    public Button m_Btn2;//二级菜单按钮
    public Button m_Btn3;//三级菜单按钮
    bool m_is1;//大局参数 操控开关
    bool m_is2;//大局参数 操控开关
    void Start()
    {
        m_is1 = true;
        m_is2 = true;
        m_Btn1.onClick.AddListener(Btn1_Event);
        m_Btn2.onClick.AddListener(Btn2_Event);
    }
    public void Btn1_Event()
    {
        if (m_is1)
        {
            m_Btn2.gameObject.SetActive(false);
            m_Btn3.gameObject.SetActive(false);
            m_is1 = false;
        }
        else
        {
            m_Btn2.gameObject.SetActive(true);
            m_Btn3.gameObject.SetActive(true);
            m_is1 = true;
        }
    }
    public void Btn2_Event()
    {
        if (m_is2)
        {
            m_Btn3.gameObject.SetActive(false);
            m_is2 = false;
        }
        else
        {
            m_Btn3.gameObject.SetActive(true);
            m_is1 = true;
        }
    }
}

OK了，快去试试吧

【Unity3D-UGUI应用篇】（三）使用UGUI实现层级菜单

一、前言

二、介绍及作用图

三、完成

第一种完成作用

第二种完成作用

第三种完成作用

第四种完成作用

第五种完成作用

相关文章

@所有青训营同学，快来领取你的专属徽章~

Django实现下载100G的超大CSV文件

手把手一步一步学鸿蒙（一）

1.2MHz，固定频率白光LED驱动器

作者信息