大纲

ui.Outline 显示一棵项的树,如同 AppKit 的大纲视图和 Finder 的列表视图:顶层是各项,展开的项下方缩进显示其子项,带一个可展开和收起的箭头。应用给出顶层各项和 children(返回某项的子项,没有子项时返回 nil);大纲只构建可见的行,和列表一样,因此任何大小的树都和小的一样快。

type fileTree struct {
	children map[string][]string // 每个目录中的路径
	files    ui.OutlineState[string]
	row      int
}

func (app *fileTree) view(c *ui.Context) {
	app.files.List.Selected = &app.row
	ui.Outline(c, &app.files, []string{"/"}, func(dir string) []string {
		return app.children[dir] // 文件返回 nil
	}, func(path string) {
		ui.Text(c, filepath.Base(path))
	}).Grow(1)
	chosen := app.files.Item(app.row)
	// …
}

大纲状态

它的状态 OutlineState 持有行的 ListState(像列表一样选择行:Selected、Selection),以及 Open——一个记录哪些项正在显示子项的 Selection。行的 key 就是各项,因此当上方的项展开收起时,选择和状态跟随它们。Rows、Item 和 Depth 读取显示的行。Indent 是每级在行的箭头前增加的宽度,为零时取主题的 Space(4);它不能为负。

展开与收起

• 点击某项的箭头展开或收起它;Option+点击(Alt+点击)会连同其内部所有层级一起展开或收起。
• 大纲有焦点时,Right 展开选中的项或跳到其第一个子项,Left 收起它或跳到其父项;macOS 上配合 Option、其他平台上配合 Shift(如同 GTK),它们会展开或收起其内部所有层级。
• 收起一个子项被选中的项时,选中该项。

分列显示

ui.OutlineTable 是同样的树放在表格的列中:第一列显示箭头,并按项的深度缩进;列就是表格的列,用户可以排序、调整宽度和移动。

ui.OutlineTable(c, &app.files, cols, roots, children, func(path string, col int) {
	switch col {
	case 0:
		ui.Text(c, filepath.Base(path)).SingleLine()
	case 1:
		ui.Text(c, app.size(path))
	}
})

无障碍

辅助技术看到的是一棵树,或一个行可展开收起的表格,其行报告自己的层级、是否可展开、当前是否展开,以及是所有行中的第几行;它可以像点击箭头那样展开和收起它们。