SuperAPI AI 工具集

table-patterns

设计与创作

查看项目

更新于 10-16 05:06

技能介绍

用途:table-patterns 是一份关于数据表格设计的规范,用于指导在界面中呈现需要扫描、排序或筛选的结构化数据。资料指出,表格适用于跨相同属性比较多个条目,不适用于页面布局,也不适用于卡片列表更易读的场景。

主要能力与设计要点: 列设计方面,文本左对齐、数字右对齐,小数点应垂直对齐;第一列作为标识列,放名称、标题或 ID 等唯一标识行的内容;操作列放在最后,编辑、删除、查看按钮置于右侧;横向滚动时固定标识列,以便用户在宽表格中保持上下文。 排序方面,默认排序应是最有用的顺序,通常为最新优先或按字母排序;用箭头图标显示排序方向;允许对任何合理的列排序;跨会话记住排序偏好。 分页、无限滚动与虚拟滚动方面,分页适合大数据集和精确导航,不适合快速浏览;无限滚动适合信息流式内容和浏览,不适合用户需要到达页脚或精确导航的场景;虚拟滚动适合超长列表(1000 条以上)和性能敏感场景,不适合简单的短列表。 响应式方面,768px 以下应转换为卡片列表、堆叠的键值对或横向滚动;不要仅缩小表格直到文字换行成难以阅读的块;优先列策略是只显示最重要的 2 至 3 列,其余隐藏在展开项后。 密度方面,紧凑为 32px 行高、12px 内边距,适合高级用户和数据密集型仪表盘;默认为 48px 行高、16px 内边距,适合大多数场景;舒适为 64px 行高、24px 内边距,适合行内有多行文本或图片的情况;数据密集型应用应提供密度切换。

使用方式与限制:资料未提供具体安装命令、代码示例或 API,仅给出设计原则与建议,实际落地需结合具体前端框架实现。