Unity UGUI自定义树形菜单(TreeView)

Unity UGUI自定义树形菜单

（TreeView）

如果你需要的也是这种效果，那你就来对地方了！

目前，我们这个树形菜单展现出来的功能如下：

1、可以动态配置数据源；

2、点击每个元素的上下文菜单按钮（也就是图中的三角形按钮），可以收缩或展开它的子元素；

3、可以单独判断某一元素的复选框是否被勾选，或者直接获取当前树形菜单中所有被勾选的元素；

4、树形菜单统一控制其下所有子元素按钮的事件分发；

5、可自动调节的滚动视野边缘，根据当前可见的子元素数量进行横向以及纵向的伸缩；

一、首先，我们先制作子元素的模板（Template），也就是图中菜单的单个元素，用它来根

据数据源动态克隆出多个子元素，这里的话，很显然我们的模板是由两个Button加一个Toggle和一个Text组成的，如下：

二、我们的每个子元素都会携带一个TreeViewItem脚本，用于描述自身在整个树形菜单中与其他元素的父子关系，而整个树形菜单的控制由TreeViewControl来实现，首先，TreeViewControl会根据提供的数据源来生成所有的子元素，当然，改变数据源之后进行重

新生成的时候也是这个方法，干的事情很简单，就是用模板不停的创建元素，并给他们建立父子关系：

[csharp] view plain copy

///

/// 生成树形菜单

///

public void GenerateTreeView()

{

//删除可能已经存在的树形菜单元素

if (_treeViewItems != null)

{

for (int i = 0; i < _treeViewItems.Count; i++)

{

Destroy(_treeViewItems[i]);

}

_treeViewItems.Clear();

}

//重新创建树形菜单元素

_treeViewItems = new List();

for (int i = 0; i < Data.Count; i++)

{

GameObject item = Instantiate(Template);

if (Data[i].ParentID == -1)

{

item.GetComponent().SetHierarchy(0);

item.GetComponent().SetParent(null);

}

else

{

TreeViewItem tvi = _treeViewItems[Data[i].ParentID].GetComponent();

item.GetComponent().SetHierarchy(tvi.GetHierarchy() + 1);

item.GetComponent().SetParent(tvi);

tvi.AddChildren(item.GetComponent());

}

= "TreeViewItem";

item.transform.FindChild("TreeViewText").GetComponent().text = Data[i].Name;

item.transform.SetParent(TreeItems);

item.transform.localPosition = Vector3.zero;

item.transform.localScale = Vector3.one;

item.transform.localRotation = Quaternion.Euler(Vector3.zero);

item.SetActive(true);

_treeViewItems.Add(item);

}

}

三、树形菜单生成完毕之后此时所有元素虽然都记录了自身与其他元素的父子关系，但他们的位置都是在Vector3.zero的，毕竟我们的菜单元素在创建的时候都是一股脑儿的丢到原点位置的，创建君可不管这么多元素挤在一堆会不会憋死，好吧，之后规整列队的事情就交给刷新君来完成了，刷新君玩的一手好递归，它会遍历所有元素并剔除不可见的元素（也就是点击三角按钮隐藏了），并将它们一个一个的重新排列整齐，子排在父之后，孙排在子之后，以此类推......它会遍历每个元素的子元素列表，发现子元素可见便进入子元素列表，发现孙元素可见便进入孙元素列表：

[csharp] view plain copy

///

/// 刷新树形菜单

///

public void RefreshTreeView()

{

_yIndex = 0;

_hierarchy = 0;

//复制一份菜单

_treeViewItemsClone = new List(_treeViewItems);

//用复制的菜单进行刷新计算

for (int i = 0; i < _treeViewItemsClone.Count; i++)

{

//已经计算过或者不需要计算位置的元素

if (_treeViewItemsClone[i] == null || !_treeViewItemsClone[i].activeSelf)

{

continue;

}

TreeViewItem tvi = _treeViewItemsClone[i].GetComponent();

_treeViewItemsClone[i].GetComponent().localPosition = new Vector3(tvi.GetHierarchy() * HorizontalItemSpace, _yIndex,0);

_yIndex += (-(ItemHeight + VerticalItemSpace));

if (tvi.GetHierarchy() > _hierarchy)

{

_hierarchy = tvi.GetHierarchy();

}