删除项目?
待播放面板在目标上方 48px移到回收站,30 天内可恢复。
峰值过冲0px上限 22px
产品与设计 · 动效
用质量、阻尼和初速度控制带弹性的运动,限制过冲和时长;只 transform 已占位的面板,并为减少动效提供瞬切到终态的替代。
删除对话框弹层进入。拖质量/阻尼/初速度,点「播放进入」,读对话框上的过冲标尺和稳定旗标;播放中可「立即稳定」打断弹簧,勾选减少动效则瞬切到终态。
场景:删除对话框弹层进入。拖三个物理参数,点「播放进入」,读对话框上的过冲标尺和稳定旗标;播放中点「立即稳定」可打断弹簧,勾选减少动效则瞬切到终态。
移到回收站,30 天内可恢复。
拖质量/阻尼/初速度,看对话框上的过冲标尺和稳定旗标怎么变;下一步点「播放进入」开始。
刚才在对话框上看到的三参数和边界,提炼成可复用的判断。
弹层、抽屉、卡片出现需要表达空间关系时适合;不要用它承载操作结果或加载语义。
模态对话框、底部抽屉、卡片出现——物体从某处「来到」目标位置,轻微回弹交代空间关系。
保存成功/失败、加载等待、按钮反馈不要靠弹簧表达;那些用文字、状态码或即时变化更准确。
同一个对话框进入——差异只在参数是否受控,以及能否被打断、能否在减少动效时瞬切。
对话框用较小初速度和足够阻尼进入,过冲在 22px 内、约 1s 稳定;只用 transform 移动已占位的面板,周围布局不抖。播放中点「立即稳定」会立刻落到终态,不依赖动画放完。
差异:参数受控、终态可达、布局不动。初速度拉满、阻尼降到最低,面板冲过目标几十像素反复抖,超过 1.2s 仍在晃;或动画没结束就阻塞操作,用户开了减少动效也还在弹。
差异:只改参数——过冲超限、终态迟迟不可达。用户开了「减少动效」,你的弹簧对话框该怎么进入?
术语的技术定义和行为以这些一手或权威资料为准。
和本知识点经常一起出现的概念。