专栏首页macOS 开发学习Mac OSX 开发基础控件学习之 NSOutlineView

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数据模型,并设置DataSourceDelegate

Data Model 数据模型

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

  • 在工程中添加RootModel Class

Root Model 在Root Model 中,添加两个属性:nameisLeaf

name 和isLeaf

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

LeafModel Class

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

children

ViewController 中初始化模型数据

setup mode

设置NSOutlineView的DataSourceDelegate

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)
  • 效果如下:

展开效果

感谢阅读
  • 限于水平,难免有疏漏之处,各位可在评论中指出,共同学习讨论~

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 知识点 | 纯代码实现NSOutlineView的详细步骤

    我想写个菜单,分为主食、甜点、饮料等类目,每个类目下又有一些分类,用什么控件比较合适呢?NSTableView好像不太方便展示分组数据。

    京东技术
  • Mac OSX 开发入门基础系列之NSTask

    关于OSX的沙盒机制,推荐学习这篇文档[Cocoa开发之沙盒机制及访问Sandbox之外的文件

    代码行者
  • Mac开发基础练习:制作一个状态栏(NSStatusBar)上的App(一)

    代码行者
  • 一步一步,开始上手Mac 开发(一)

    通过本文,你可以创建你的第一个Mac Application,编译并指定版本号,而且经过练习,你应该掌握:

    代码行者
  • 开发者的如何优雅的使用OSX

    Mac对于IT开发者来说是最好的开发工具,没有之一。

    老马
  • 开发者的如何优雅的使用OSX

    Mac对于IT开发者来说是最好的开发工具,没有之一。 但是对于大部分人来说,第一个接触的PC操作系统都是Windows系统,此文将带大家优雅的快速学习和使用Ma...

    老马
  • Mac 开发之 做一个JSON转模型属性的小公举

    好啦,到这里就简单完成了这个小工具,继续学习的,可以给这个工具添加一个状态栏按钮(可以参考我前面的文章),也许会用起来更方便哦..

    代码行者
  • Mac开发之 Cocoa 绑定 入门

    从iOS开发转为Mac OSX应用开发的过程中,cocoa 绑定算是比较大的一个差异,也是OSX上比较实用的技术,cocoa 绑定让开发者节省了大量的代码,可以...

    代码行者
  • SimuLooker 一款用于iOS开发的小工具

    在iOS日常开发中,Xcode的模拟器作为调试App的必备工具,使用频度很高,一些app需要对数据进行持久化,因此就需要经常访问模App内的Doucment,C...

    代码行者
  • OS X 上使用.NET开发应用程序

    MonoMac是面向Mac OSX API的C#绑定,其API设计主要受到了MonoTouch的启发,后者可以基于Mono开发原生的iOS应用程序。MonoMa...

    张善友
  • Sublime Text3 插件编写教程_第一课

    七夜安全博客
  • GitHub 热点速览 Vol.23:前后端最佳实践

    以下内容摘录自微博 @HelloGitHub 的 GitHub Trending,选项标准:新发布 | 实用 | 有趣,根据项目 release 时间分类,发布...

    HelloGitHub
  • mysql安装--基础教程(一)

    mysql是一个开源的数据库,安装的话,可以直接到官方网站, 正大光明的下载,自豪的安装; 如果你的电脑是window,你就下载window的版本; 如果是的系...

    前朝楚水
  • 【Git 第3课】 安装Git

    要用Git,首先肯定要安装它。简要说一下Win,Mac和Linux三种平台的安装方法。 Windows Git的官网(http://git-scm.com)提供...

    Crossin先生
  • 在线商城项目07-mac下mongodb的下载与配置

    这一章本来不想讲的,因为关于配环境这种事,其实网上真的很多资料,但是考虑到确实好多人都不喜欢配环境这种事,因为觉着很麻烦而止步不前,很是可惜。这一节我们来看看如...

    love丁酥酥
  • git——简易指南

    Git对于我来说,只知道是一个版本控制器,类似于乌龟的svn。其中也仅仅会几个常的命令,比如说“更新git pull”、“提交git push”等等,因为记得当...

    李维亮
  • Mac开发基础练习:制作一个状态栏(NSStatusBar)上的App(二)

    1.1 选中ViewController.m文件,添加鼠标左键点击事件监听,实现代码如下图:

    代码行者
  • Ubuntu 15.10 中文桌面版/服务器正式版下载 - 华丽免费易于入门的 Linux 操作系统

    落叶大大
  • Oculus + Node.js + Three.js 打造VR世界

    Oculus Rift 是一款为电子游戏设计的头戴式显示器。这是一款虚拟现实设备。这款设备很可能改变未来人们游戏的方式。 周五Hackday Showcase的...

    李海彬

扫码关注云+社区

领取腾讯云代金券