用途:把 React Native/Expo 的动效需求变成能在真机发布版本上通过严格检验的实现,而不是只在模拟器或开发机上看着还行。
主要能力与决策顺序:先判断“是否该动画”,按使用频率分级——每天 100 次以上的交互(标签切换、滚动、设置开关)不做动画;每天数十次只做近乎无感的反馈(150ms 内或不做);偶尔出现(弹层、模态、引导)用标准动画;罕见/首次(成功态、庆祝)才用惊喜预算。再给动画命名一个目的(反馈、空间一致性、状态指示、避免突兀、解释、惊喜),说不出目的就不做。
工具选择从最便宜的开始:无手势的状态变化用 Reanimated CSS transition;循环/多阶段/挂载播放用 CSS animation;挂载卸载或列表重排用 layout animations;涉及手指或滚动的用 useSharedValue + Gesture + useAnimatedStyle;页面切换用 Expo Router 原生栈,别手写;底部弹层用 presentation: 'formSheet';标签栏用 NativeTabs;上下文菜单用 Link.Menu / Link.Preview;大标题折叠用 headerLargeTitleEnabled;下拉刷新用 RefreshControl;键盘跟随用 react-native-keyboard-controller;插画与庆祝用 Lottie;超大动画场景用 Skia。
必要用法:安装用 npx expo install <package> 以匹配 SDK 版本。Reanimated 4 需新架构,GestureHandlerRootView 必须包住应用。弹簧参数用 duration + dampingRatio 形式而非 mass/stiffness/damping。属性优先 transform 和 opacity,避免动画 height/width/margin/flex/top,绝不 scale(0),入场从 scale(0.9–0.97) + opacity: 0 开始。
限制:不能从手势或滚动处理器中 setState;不能在 onUpdate 或滚动处理器里逐帧 scheduleOnRN;不能在渲染期读写 shared value,应使用 .get()/.set();触摸反馈须做按下即时反馈。减少动态效果需要随动画一起提供,而不是事后补。手感必须在真机发布版本、最慢支持设备上判断,不能靠 Expo Go 或模拟器。资料未提供具体价格与收费信息。