跳到主要内容

列表控件（ListWidget）

ListWidget 类提供了一个用于显示列表的控件。

  • 可以通过 add() 方法添加项目，或者通过 insert() 方法插入项目。
  • 使用 clear() 方法可以清空列表，或者通过 remove() 方法移除单个项目。
  • 当前选中的项目可以通过 selected 属性获取。
  • 列表控件的选择模式可以通过 selectionMode 属性设置，具体模式由 SelectionMode 枚举值定义，各模式介绍如下：

选择模式（SelectionMode 枚举）​

常量值描述
NoSelection0x0000列表项无法被选中。
SingleSelection0x0001用户选择一个项目时，其他被选中的项目会取消选择。
MultiSelection0x0002W用户选择项目时，选中状态会切换，其他项目的状态保持不变。
ExtendedSelection0x0003用户正常点击时会清空选择并选中新项目；按住 Ctrl 点击时，会切换点击项目的选中状态，其他项目保持不变；按住 Shift 点击时，会选择当前项目和点击项目之间的所有项目。
ContiguousSelection0x0004用户正常点击时会清空选择并选中新项目；按住 Shift 点击时，会选择当前项目和点击项目之间的所有项目。

列表项（ListItem）​

ListItem 类表示列表控件中的单个项目。

  • 列表项可以显示文本和图标。
  • 通过 checkable 属性可以设置是否支持勾选状态。
  • 当前勾选状态可以通过 checked 属性获取或设置。

事件​

ListWidget支持以下事件：

项目点击事件（itemClicked）​

当鼠标点击控件中的某个项目时，触发itemClicked事件，并传递被点击的项目。

项目双击事件（itemDoubleClicked）​

当鼠标双击控件中的某个项目时，触发itemDoubleClicked事件，并传递被双击的项目。

项目右键菜单事件（itemContextMenu）​

当鼠标右键点击控件中的某个项目时，触发itemContextMenu事件，并传递被右键点击的项目。

选择变化事件（selectionChanged）​

当控件的选中项发生变化时，触发selectionChanged事件。

// 监听项目点击事件
listWidget.bind('itemClicked', (event: ItemClickEvent): void => {
    event.item as ListItem; // 点击的项目
    event.point; // 鼠标位置
});
// 监听项目双击事件
listWidget.bind('itemDoubleClicked', (event: ItemDoubleClickEvent): void => {
    event.item as ListItem; // 双击的项目
    event.point; // 鼠标位置
});
// 监听项目右键菜单事件
listWidget.bind('itemContextMenu', (event: ItemContextMenuEvent): void => {
    event.item as ListItem; // 右键点击的项目
    event.point; // 鼠标位置
});
// 监听选择变化事件
listWidget.bind('selectionChanged', (): void => {
    // 选中内容发生变化
});

示例代码​

以下代码展示了如何创建一个列表控件并添加项目：

const desktop = Desktop.instance(); // 获取桌面实例
const listWidget = new ListWidget(desktop); // 创建列表控件并添加到桌面
listWidget.size = new Size(240, 320); // 设置控件大小

// 添加项目
const item1 = new ListItem(listWidget, 'Windows 7'); // 创建一个列表项
item1.checkable = true; // 设置为可勾选
item1.checked = true; // 默认勾选

new ListItem(listWidget, 'Windows 10', 'orthographic.png'); // 创建一个带图标的列表项
new ListItem(listWidget, 'Windows Server 2016'); // 创建一个普通列表项
const item2 = new ListItem(listWidget, 'Windows 8', 'appearence.png'); // 创建一个带图标的列表项
item2.checkable = true; // 设置为可勾选
new ListItem(listWidget, 'Mac OS');
new ListItem(listWidget, 'Ubuntu');
new ListItem(listWidget, 'Debian');
new ListItem(listWidget, 'Alpine');
new ListItem(listWidget, 'CentOS');
new ListItem(listWidget, 'Android');
new ListItem(listWidget, 'iOS');

// 使用 `addItem` 方法添加项目
listWidget.addItem('Unix');
listWidget.addItem('FreeBSD');
listWidget.addItem('Palm OS');
listWidget.addItem('OS/2');
listWidget.addItem('RedHat');
listWidget.addItem('Solaris');
listWidget.addItem('Chrome OS');