DirectSurface UIDirectSurface UI
开始使用
文档/组件手册

组件手册总览

组件手册用于查找控件用途、参数、事件、交互行为和性能注意事项。

如果只需要快速确认“有没有这个组件、公开 API 叫什么、对应文档在哪里”,先看 组件清单。所有可布局组件共有的尺寸、margin、alignment 和容器 padding 规则见组件通用布局属性

组合业务页面时,可以先阅读 组件设计系统。组件手册说明单个组件如何使用,设计系统说明页面如何选择 token、表达状态并保持交互和视觉一致。

如何选择组件

先按业务结构选择大类,再进入具体组件文档:

需求 优先查看 说明
文本、按钮、分区、折叠面板 基础组件 页面骨架和轻量交互。
文本、数字、日期、开关 输入组件 表单中直接录入值的字段。
枚举、树、表格弹窗选择 选择器 值必须来自候选集时使用。
表格、树、列表、主数据区 数据组件 大数据、虚拟化、复制、滚动和编辑。
菜单、标签、工作区 导航和工作区 模块入口、tab、dock 工作区。
弹窗、抽屉、通知 浮层和反馈 跨当前布局层显示的临时 UI。
工具栏、按钮权限 命令组件 绑定 Command / Permission 体系。
图表、文档、大文本 可视化和文档 非表单类内容展示和编辑。

如果组件涉及页面级状态、权限、上下文或大数据性能,先看对应指南,再回到组件文档查参数:

基础状态能力

所有组件都继承 RenderObject.visible,可由业务直接控制是否出现在布局、绘制、hit test 和焦点顺序中。交互组件按语义提供 disabled,输入或选择控件按语义提供 readonly

状态 使用场景 组件责任
visible 业务权限、页面模式、条件字段决定组件是否出现。 折叠布局、跳过绘制和命中测试、退出焦点顺序。
disabled 控件存在但当前不可操作。 阻断鼠标和键盘交互,清理 hover、pressed、popup、菜单、拖拽等临时状态。
readonly 值可查看但不可修改。 保持可读展示,阻止编辑或选择变更,按组件语义处理焦点和复制。

业务层负责计算权限和流程状态;组件层负责提供统一 UI 状态。命令入口优先通过命令系统统一映射 visible/enabled,表单和页面局部状态可以直接设置组件属性。

分类

基础组件

输入组件

选择器

数据组件

导航和工作区

浮层和反馈

命令组件

可视化和文档

组件选择与组合原则

  • 先从组件清单确认公共入口,再组合业务页面。
  • 页面只依赖 ds-ui 包入口,不复制或引用组件内部实现。
  • 统一视觉通过公开的 theme token 和状态配置完成。
  • 大数据页面优先选择支持虚拟化的组件,并明确滚动边界。

下一步