转场: 最近触发:—

Windows 8 官方 UI 动画

参数与用途都取自微软官方源码与文档 · 每个磁贴标注「官方参数」与「用在哪」

列表动画

官方 FLIP 三段式:先建动画对象(记录位置)→ 改 DOM → execute

搜索建议列表 —— 与普通列表区分:新增 117ms、删除 93ms(linear,更快),其余项 400ms 归位

批次 1 · 0ms · 大标题

分批进入

批次 2 · +83ms · 副标题

官方 enterPage 的 staggered entry —— 页面拆成若干区域,各区域分批上屏

批次 3 · +166ms · 说明

批次由 嵌套数组的顶层 决定:enterPage([[标题],[副标题],[说明],[内容]]) → 依次 0 / 83 / 166 / 249 ms。
同一内层数组里的元素才会一起进,例如 [[标题],[副标题],[说明,内容]] → 0 / 83 / 166 / 166 ms。
官方交错量是 min(83 × i, 333) ms;方向默认"从右往左滑",靠 enterPage 的 offset 参数给水平偏移(官方 SettingsFlyout 用的就是 {left:"±100px"})。

批次 4 · +249ms · 内容
内容块 1
内容块 2
内容块 3
内容块 4
内容块 5
内容块 6

手势动画

滑动多选与拖拽落点,都是官方给自绘控件准备的手势词汇

① 滑动多选:按住某行向下拖超过 60px 再松开 → swipeSelect;已选中的再拖一次 → swipeDeselect(直接单击也能选中,走的是同一对动画)

② 拖拽落点:按住一个方块左右拖动 → 两侧方块让出空隙(dragBetweenEnter),移开即合上(dragBetweenLeave)