点开看详情
抓住抽屉顶部把手上下拖。松手时不是按「拖到哪」判断,而是按速度投影出的落点判断。
抽屉用的弹簧处方
↑
点开 · 无冲量
临界阻尼不过冲,只是「出现」就不该弹
1.0 / 0.4
↓
拖拽松手 · 有冲量
允许一点回弹,因为手势本身带着动量
0.8 / 0.3
材质也不是单纯淡入:模糊半径和不透明度一起动,表面才像「一块材质落下来」。
甩动卡片 · 弹簧处方
牌堆已空 · 点下方重置
← 跳过采用 →
拖到一半松手也会飞出去 —— 因为速度决定落点(动量投影),落点决定结果。
↺
重置牌堆
回到初始 6 张
判定规则
◈
投影落点 > 30% 宽度
判为「采用 / 跳过」,卡片飞出去
commit
⚡
速度 > 520 px/s
短促快甩,位置没走远也算数
commit
↩︎
两条都没到
带回弹归位 —— 有冲量,所以允许轻轻过冲
1.0→0.82
弹簧参数(实时生效)
阻尼比
1.00
响应
0.40s
阻尼 1.0 不过冲;低于 1.0 会回弹。响应不是时长 —— 弹簧没有固定时长,停下所需时间是参数涌现出来的。
减速率(动量投影)
拖我 / 甩我
三个吸附点。松手时用手指的即时速度接力给弹簧(速度交接),落点由投影决定 —— 所以轻轻一甩能跨两格。
无障碍
降低动态效果
所有弹簧改为即时到位,去掉位移
降低透明度
毛玻璃变实心,保证可读性
当前处方
◷
阻尼 1.00 · 响应 0.40s
减速率 0.998 —— 轨道上的拖拽与甩动都用这套参数
字号层级
字体随字号变形
大字收字距,小字放字距
正文行高放宽、字距接近 0。固定的 letter-spacing 一定会在某个字号上是错的,所以要按字号分别给。
小字加一点正字距,才不糊在一起。
层级靠 权重 + 字号 + 行高 三者一起建
基准字号(Dynamic Type)
正文
16px
拖一下:文字和间距一起变大,因为它们用的是 rem。用户把系统字号调大时,布局不该崩。