用途:为界面添加有目的的动效,通过反馈、状态过渡和手势增强可用性与体验。
主要能力:涵盖微交互、加载状态(骨架屏、进度条)、状态过渡(开关、页面切换)、点击波纹等反馈模式、滑动移除等手势交互、拖拽界面、滚动触发动画,以及 hover/focus 状态设计。提供 Framer Motion 与 CSS 关键帧、过渡的写法示例,以及时长(100-150ms 微反馈、200-300ms 小过渡、300-500ms 中过渡、500ms+ 复杂动画)与缓动函数参考。
使用方式:按需引入 motion 组件并配置 animate、exit、transition 等属性;对开关、按钮等使用 spring 过渡;按文档给出的代码模式实现具体交互。
限制与注意事项:需支持 prefers-reduced-motion;优先使用 transform 与 opacity 保证性能,避免动画 width、height、top、left;不要阻塞用户输入;卸载时清理监听器;在真机测试性能。资料未提供安装命令、收费方式与平台范围。