TreeView最简单的使用,按层次结构展示
# 展示TreeView的窗口
class SimpleTreeViewWindow : EditorWindow { [MenuItem("TreeView Examples/Simple Tree View Window")] static void ShowWindow() { var window = GetWindow(); window.titleContent = new GUIContent("My Window"); window.Show(); } SimpleTreeView _tableView; TreeViewState _treeViewState; private void OnEnable() { if (null == _treeViewState) _treeViewState = new TreeViewState(); //单独用一个类, 以便于序列化状态 _tableView = new SimpleTreeView(_treeViewState); } private void OnGUI() { var xMargin = 10; var yMargin = 10; var rect = new Rect(xMargin, yMargin, position.width - xMargin * 2, position.height - yMargin * 2); _tableView.OnGUI(rect); } }
# TreeView
(#) BuildRoot必须重写
(#) 没有重写RowGUI的情况下,默认实现将直接用Label展示TreeViewItem的displayName
class SimpleTreeView : TreeView { private Dictionary<int, string> _testDatas; public SimpleTreeView(TreeViewState state) : base(state) { CreateTestData(); //customFoldoutYOffset = 5; showAlternatingRowBackgrounds = true; //隔行显示颜色 showBorder = true; //表格边框 Reload(); } void CreateTestData() { _testDatas = new Dictionary<int, string>(); for (var id = 0; id < 10; ++id) { _testDatas.Add(id, $"id_{id}"); } } protected override TreeViewItem BuildRoot() { var rootTreeViewItem = new TreeViewItem(-1, -1); //root的depth必须为-1 var rows = new List(); foreach (var entry in _testDatas) { var id = entry.Key; var displayName = entry.Value; var depth = id % 3; rows.Add(new TreeViewItem(id, depth, displayName)); } SetupParentsAndChildrenFromDepths(rootTreeViewItem, rows); //根据depth自动调整TreeViewItem间的父子关系 return rootTreeViewItem; } }
# 效果图
# 关于customFoldoutYOffset,如果我们设置了其值为5,折叠箭头将偏下