Mac OSX 开发基础控件学习之 NSOutlineView

NSOutlineView-feature.png

在开发基于osx的Application的过程中,当我们需要显示一组列表结构的数据时,比较容易想到的控件是NSTableView;但如果你显示的数据有层级结构时,NSTableView就会面临一个问题:因为在osx中,NSTableView没有分组功能( sections) 因为在cocoa 中提供了另一个控件供满足我们的需求NSOutlineView它是继承自NSTableView的子类,是Mac OSX Application常用的控件之一,与NSTableView相似,NSOutlineView也使用行和列来显示内容,但所不同的是NSOutlineView使用具有层级的数据结构 下面我们通过一个示例（你也可以从这里Demo下载工程，但更推荐自己一步一步创建工程并实现功能）来简单学习一下怎样使用NSOutlineView显示带有层级结构的数据内容

创建osx项目工程，并搭建UI界面，大致效果如下图：

UI界面

• 从控件库中，拖动Source List 控件（NSOutlineView）到storyboard中，并添加约束。

初始化设置NSOutlineView

初始化设置

• 本示例中，列数为默认值1: Columns = 1
• 设置行的交替显示效果：enable Alternating Rows
• 设置层级缩进：Indentation = 16

运行效果

空白效果

这是一个空白的NSOutlineView效果，接下来，我们要添加Data model数据模型，并设置DataSource 和Delegate

Data Model 数据模型

NSOutlineView的Data model 与NSTableView有些不同，因为NSOutlineView显示层级结构，因此Data model中要能够表示出这种数据的层级来:root node -> leaf node

• 在工程中添加RootModel Class

Root Model 在Root Model 中，添加两个属性：name 和isLeaf

name 和isLeaf

• 同样的操作，再添加Leaf Model Class

LeafModel Class

• 在RootModel 中，添加子节点数组属性

children

ViewController 中初始化模型数据

setup mode

设置NSOutlineView的DataSource 和Delegate

Data Source 和 Delegate

ViewController 实现数据源和代理方法

ViewController 实现方法

• NSOutlineView数据源方法调用顺序：numberOfChildrenOfItem->child index: Int ->isItemExpandable
• cell 的重用：

   cell = outlineView.make(withIdentifier: "HeaderCell", owner: self) as? NSTableCellView

设置根节点cell的重用标识

cell = outlineView.make(withIdentifier: "DataCell", owner: self) as? NSTableCellView

设置子节点cell重用标识

最终运行效果

运行效果

One more thing

• 设置展开所有节点或者某一节点

设置展开指定节点

1. 从storyboard中，将NSOutlineView连线到Viewcontroller，添加属性outlineView

1. 在 viewDidAppear中，添加代码实现：

  // 展开所有节点
        outlineView.expandItem(nil, expandChildren: true)
        // 展开第一个节点
        // outlineView.expandItem(outlineView.item(atRow: 0), expandChildren: true)
        // 展开第二个节点
       //  outlineView.expandItem(outlineView.item(atRow: 1), expandChildren: true)

• 效果如下：

展开效果

感谢阅读

• 限于水平，难免有疏漏之处，各位可在评论中指出，共同学习讨论～