R2.05.2cardinality layout frames设计

零、一与多的状态需分别定义

别名: 零一多布局 · zero-one-many handoff · 基数帧

概念解释

列表、附件、标签、参与者这类槽位,条目数量会改的是结构,不是疏密。基数布局帧(cardinality layout frames)要求交付里分别画出「零条」「恰好一条」「多条」三种几何:零条时容器还在不在、一条时还用不用重复列表的行头和分隔、多条时从哪一行开始折叠或换页。把三条画成同一张列表的透明度变化,等于没交付。

这里的「零」是集合基数为零时的版面,用来钉死有无行、有无表头、有无底部操作。它不负责写空态要不要引导用户去创建——那是另一份交付物的职责。

机制

实现是按节点树写的。零条往往删掉整段重复体,连带着表头、批量操作、底栏计数一起消失,页面从「一组行」变成「一块壳」。一条时,重复体的间距、斑马纹、行内菜单会显得像为不存在的邻居预留;把单条硬套进多条模板,用户会以为上面或下面还藏着没渲染的行。多条才触发溢出、分页、吸顶列头这些只在重复中才有意义的机制。

三种基数不能靠缩放一张中间帧得到。中间帧(常见是三到五条)把「像列表」写进了所有人的记忆,于是零被随手补成空白卡片,一条被当成短列表,多条的折叠点被拖到联调现场才吵。交付把三帧并置,实现才能把 count == 0count == 1count >= 2 写成三条互不借用的布局,而不是一个列表组件加条件隐藏。

边界

对象在产品里只能存在一份(个人资料头、当前会话)时,没有「多」可画,「一」就是常态,硬造三条是假基数。连续量(进度 0 到 1、库存件数作为数字而不是行)走的是数值刻度,不是条目基数。无限滚动把「多」变成窗口里的一截,交付应定义窗口内的最小可见条数和加载更多的行,而不是假装能画出全集。筛选把十条收成零条,那是查询结果的基数,仍要三帧,但表头和筛选器通常还在——与「从未有过这个集合」的壳不同,不要混用同一帧去覆盖两种零。

怎么落地

  • 为每个集合槽交出三帧,并在帧上标明触发条件:n = 0n = 1n = k(k 取产品里开始出现滚动或折叠的条数)。
  • 零帧画清壳还在哪些:标题、筛选、主按钮是否保留;不要只留一块未标注的白。
  • 一帧去掉仅为重复服务的装饰(为下一条预留的分割线、批量勾选列),让单条看起来就是单条。
  • 用同一接口分别喂空数组、单元素数组、超过折叠阈值的数组,把三屏与三帧对照。零屏若长得像「一条被删了还留着行高」,或一屏仍显示「共 N 项」的复数措辞,基数就还没分开。

延伸

  • 同组R2.05.1 极长与极短内容需在设计中给出 · R2.05.3 未定义的情况会由实现者随意决定 · R2.05.4 边界值取自真实数据分布而非想象的极值 · R2.05.5 溢出策略需按内容类型分别指定 · R2.05.6 多种边界叠加时的表现要单独给出
  • 相邻R1.03 组件状态的完备性 · R2.09 状态与空数据的交付
  • 站内检索cardinality layout frames · zero one many · collection cardinality

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/R2.05.2