K3.01.2pane width tracking the window设计
栏宽比例需随窗口变化
别名: 栏宽比例 · 双栏自适应 · liquid split view
概念解释
平板窗口不是一块锁死的横屏。分屏、台前调度、外接显示、把折叠屏再折一点,都会在应用还开着的时候改掉可用宽度。栏宽跟着窗口走指两栏按比例或按约束重分剩余空间,而不是记住某一次横屏里的像素值。列表栏锁在 320 点、详情吃剩余,在变窄时会把详情饿死;两栏都锁像素,窗口一拉大中间就会空一截。同时可见靠的是两栏都还在可读宽度里,比例若不随窗口改,可见会在中途先坏掉一栏。这条只谈「还在双栏时宽度怎么分」,不谈窄到该收成单栏、也不谈双栏本身为什么有用。
机制
双栏是在分一块不断变化的水平预算。每栏有自己的最低可用宽度:列表要放下识别字段,详情要放下正文或表单。窗口变时,先满足两栏下限,再把多出来的宽度按权重分给更吃宽度的那一栏(通常是详情)。固定比例在中等宽度上好看,窗口再窄会同时压穿两栏下限;固定像素则在窗口变宽时拒绝把空间交给内容。分屏分割条被用户拖动,等于窗口内部又发生一次宽度突变,应用若只在启动时算一次栏宽,拖完就会裁字、折行失控或出现横向滚动。折叠屏的内屏和外屏不是同一宽度,把外屏上记下的栏宽套到内屏,会得到一栏过肥、一栏过瘦。
边界
用户拖分割条刻意改过比例时,应在同一次会话里尊重这次改写,而不是下一次旋转又抢回去;但下限仍要守,不能让人把一栏拖到不可读。单栏退化之后没有「比例」可跟,再谈栏宽没有对象。只读工具若详情是固定宽度的画布(乐谱、版式预览),应保持画布不变形,把变化吃在列表栏或外边距上,而不是两栏一起揉。极宽窗口(外接显示器)上,详情栏无上限地拉长会让行长失控,需要给正文一个最大测度,多出的宽度留白或加第三栏,而不是无限摊。
怎么落地
- 给列表栏和详情栏分别设最低宽度,剩余空间用弹性权重分配;禁止两栏都写死像素。
- 监听窗口宽度、分屏分割条和折叠态,宽度变化时重算,而不是只在首次布局时算一次。
- 用户拖过分割条则记下本次比例,旋转或折开后仍先满足下限,再按记下的权重分。
- 验证:从全宽横屏拖到约三分之一、再拖回全宽,识别字段始终可读、详情没有横向滚动、没有一栏被压成图标条。任何一档出现裁切或空带,就是比例没有跟着窗口走。