YSS · 树形视图（treeview）

Y++ / YStudio 开发文档 · 一点滴

选择器： treeview · 设计器组件： 树形视图 · 按名称： treeview#名称 或 #名称

项伪类： treeview:item · treeview:item:hover

专用属性

属性	说明	映射
`row-height`	节点行高	属性「行高」
`scrollbar-width`	滚动条宽度	属性「滚动条宽度」
`icon-size`	节点图标边长	属性「图标大小」
`show-checkboxes`	节点前复选框	属性「开启勾选」
`link-check` / `linked-checkboxes`	父子联动勾选	属性「联动勾选」
`three-state-checkboxes` / `three-state-check`	勾选三态	属性「勾选三态」
`indicator-size` / `check-size`	复选框边长	YSS 扩展
`indicator-background-color`	复选框背景	YSS 扩展
`indicator-border-color`	复选框边框	YSS 扩展
`checkmark-color`	勾选颜色	YSS 扩展
`border-radius`	外框圆角	属性「圆角」
`show-border` / `border-width` / `border-color`	边框	对应属性
`color` / `background-color`	文字/背景	通用
`item-hover-background` / `item-selected-background`	行悬停/选中背景	悬停/按下背景色
`item-hover-color` / `item-selected-color`	行悬停/选中文字色	悬停/按下前景色
`scrollbar-width` / `scrollbar-track-color` / `scrollbar-thumb-color`	滚动条宽度与颜色	见属性「滚动条宽度」

示例

treeview#树形视图1 {
    row-height: 26;
    scrollbar-width: 10;
    icon-size: 18;
    show-checkboxes: true;
    indicator-size: 14;
    indicator-background-color: #2D2D30;
    indicator-border-color: #606060;
    checkmark-color: #00B464;
    background-color: #252526;
    color: #CCCCCC;
    border-radius: 4;
    item-hover-background: #2A2D2E;
    item-selected-background: #094771;
}

treeview:item:hover {
    background-color: #2A2D2E;
}

代码侧：全部属性

布局/通用：提示、左边、顶边、宽度、高度、可见、启用、句柄（只读）

树形视图专用：

属性	说明
`节点列表`	多行文本，缩进表示层级
`行高`	节点行高度
`当前索引`	选中节点索引（0 起）
`滚动条`	0 自动 / 1 纵向 / 2 不显示 / 3 始终纵向
`滚动条宽度`	6–32 像素
`图标大小`	节点图标边长
`圆角`	外框圆角
`显示边框` / `边框大小` / `边框颜色`	边框
`当前文本`	只读，当前节点文本
`允许编辑`	F2/双击编辑节点标签
`开启勾选`	节点前复选框
`联动勾选`	勾选父节点时同步子节点
`勾选三态`	支持不确定态
`拖拽排序`	同级拖动排序
`拖动动画` / `交换动画`	拖动预设 0–9
`编辑快捷键`	虚拟键码，0=F2，-1=禁用

代码侧：全部方法

通用对象方法：移动(...)、置焦点()、刷新()、显示()、隐藏()

树形视图专用：

方法	说明
`置当前索引(索引)` / `取当前索引()`	选中节点
`加入节点(文本, [图标=""])`	末尾追加节点
`加入项目(文本)`	无图标追加
`加入子节点(父索引, 文本, [图标=""])`	父索引 -1=根级
`置项目图标(索引, 图标)`	设置图标
`清空()`	清空全部节点
`取项目数()`	节点总数
`取项目文本(索引)` / `置项目文本(索引, 文本)`	读写节点文本
`取当前文本()` / `取选中文本()`	当前选中文本
`取选中索引()`	同取当前索引
`删除项目(索引)`	删除节点
`展开节点(索引)` / `折叠节点(索引)`	展开/折叠
`取节点已展开(索引)`	是否已展开
`滚动到节点(索引)`	滚到可见
`置项目勾选(索引, 勾选)`	0/1/2（三态）
`取项目勾选(索引)`	返回勾选状态
`取勾选索引列表()`	已勾选节点索引

代码侧：全部事件

通用指针/焦点/键盘：同其它控件（单击、双击、获得焦点 等）

树形视图专用：

事件	参数
`节点选中改变`	整数索引, 文本项目文本
`节点被激活`	整数索引, 文本项目文本
`节点被单击`	整数索引, 文本项目文本
`节点被双击`	整数索引, 文本项目文本
`即将展开` / `已展开`	整数索引, 文本项目文本
`即将收起` / `已收起`	整数索引, 文本项目文本

交互： 根节点双击可展开/收起（有子节点时）。

完整示例

函数 主窗口.创建完毕 () {
    树形视图1.开启勾选 = 真
    树形视图1.加入子节点(-1, "根节点")
    树形视图1.加入子节点(0, "子节点 A")
    树形视图1.展开节点(0)
}

函数 树形视图1.节点被双击 (整数 索引, 文本 项目文本) {
    输出 ("双击", 索引, 项目文本)
}

函数 树形视图1.节点选中改变 (整数 索引, 文本 项目文本) {
    树形视图1.当前索引 = 索引
}