f882a57f.c4e804a8.js

js reactnative.cn collected 2026-10-04 00:30:00 UTC 47,414 bytes, 1 lines download raw bytes

1"use strict";(self.webpackChunkreact_native_website=self.webpackChunkreact_native_website||[]).push([["14043"],{6240(e,n,i){i.r(n),i.d(n,{metadata:()=>d,default:()=>h,frontMatter:()=>c,contentTitle:()=>t,toc:()=>r,assets:()=>a});var d=JSON.parse('{"id":"animated","title":"Animated","description":"Animated\u5E93\u65E8\u5728\u4F7F\u52A8\u753B\u53D8\u5F97\u6D41\u7545\uFF0C\u5F3A\u5927\u5E76\u6613\u4E8E\u6784\u5EFA\u548C\u7EF4\u62A4\u3002Animated\u4FA7\u91CD\u4E8E\u8F93\u5165\u548C\u8F93\u51FA\u4E4B\u95F4\u7684\u58F0\u660E\u6027\u5173\u7CFB\uFF0C\u4EE5\u53CA\u4E24\u8005\u4E4B\u95F4\u7684\u53EF\u914D\u7F6E\u53D8\u6362\uFF0C\u6B64\u5916\u8FD8\u63D0\u4F9B\u4E86\u7B80\u5355\u7684 start/stop\u65B9\u6CD5\u6765\u63A7\u5236\u57FA\u4E8E\u65F6\u95F4\u7684\u52A8\u753B\u6267\u884C\u3002","source":"@site/versioned_docs/version-0.78/animated.md","sourceDirName":".","slug":"/animated","permalink":"/docs/0.78/animated","draft":false,"unlisted":false,"editUrl":"https://github.com/reactnativecn/react-native-website/blob/production/cnwebsite/../cndocs/animated.md","tags":[],"version":"0.78","frontMatter":{"id":"animated","title":"Animated"},"sidebar":"api","previous":{"title":"Alert","permalink":"/docs/0.78/alert"},"next":{"title":"Animated.Value","permalink":"/docs/0.78/animatedvalue"}}'),s=i(62540),l=i(43023);let c={id:"animated",title:"Animated"},t,a={},r=[{value:"\u793A\u4F8B",id:"\u793A\u4F8B",level:2},{value:"\u6982\u89C8",id:"\u6982\u89C8",level:2},{value:"\u914D\u7F6E\u52A8\u753B",id:"\u914D\u7F6E\u52A8\u753B",level:3},{value:"\u4F7F\u7528\u52A8\u753B",id:"\u4F7F\u7528\u52A8\u753B",level:3},{value:"\u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8",id:"\u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8",level:3},{value:"\u81EA\u5B9A\u4E49\u52A8\u753B\u7EC4\u4EF6",id:"\u81EA\u5B9A\u4E49\u52A8\u753B\u7EC4\u4EF6",level:3},{value:"\u7EC4\u5408\u52A8\u753B",id:"\u7EC4\u5408\u52A8\u753B",level:3},{value:"\u5408\u6210\u52A8\u753B\u503C",id:"\u5408\u6210\u52A8\u753B\u503C",level:3},{value:"\u63D2\u503C",id:"\u63D2\u503C",level:3},{value:"\u5904\u7406\u624B\u52BF\u548C\u5176\u4ED6\u4E8B\u4EF6",id:"\u5904\u7406\u624B\u52BF\u548C\u5176\u4ED6\u4E8B\u4EF6",level:3},{value:"\u65B9\u6CD5",id:"\u65B9\u6CD5",level:2},{value:"<code>decay()</code>",id:"decay",level:3},{value:"<code>timing()</code>",id:"timing",level:3},{value:"<code>spring()</code>",id:"spring",level:3},{value:"<code>add()</code>",id:"add",level:3},{value:"<code>subtract()</code>",id:"subtract",level:3},{value:"<code>divide()</code>",id:"divide",level:3},{value:"<code>multiply()</code>",id:"multiply",level:3},{value:"<code>modulo()</code>",id:"modulo",level:3},{value:"<code>diffClamp()</code>",id:"diffclamp",level:3},{value:"<code>delay()</code>",id:"delay",level:3},{value:"<code>sequence()</code>",id:"sequence",level:3},{value:"<code>parallel()</code>",id:"parallel",level:3},{value:"<code>stagger()</code>",id:"stagger",level:3},{value:"<code>loop()</code>",id:"loop",level:3},{value:"<code>event()</code>",id:"event",level:3},{value:"<code>forkEvent()</code>",id:"forkevent",level:3},{value:"<code>unforkEvent()</code>",id:"unforkevent",level:3},{value:"<code>start()</code>",id:"start",level:3},{value:"<code>stop()</code>",id:"stop",level:3},{value:"<code>reset()</code>",id:"reset",level:3},{value:"\u5C5E\u6027",id:"\u5C5E\u6027",level:2},{value:"<code>Value</code>",id:"value",level:3},{value:"<code>ValueXY</code>

1",id:"valuexy",level:3},{value:"<code>Interpolation</code>",id:"interpolation",level:3},{value:"<code>Node</code>",id:"node",level:3},{value:"<code>createAnimatedComponent</code>",id:"createanimatedcomponent",level:3},{value:"<code>attachNativeEvent</code>",id:"attachnativeevent",level:3}];function o(e){let n={a:"a",blockquote:"blockquote",code:"code",div:"div",h1:"h1",h2:"h2",h3:"h3",hr:"hr",li:"li",p:"p",pre:"pre",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",ul:"ul",...(0,l.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"Animated"}),"\u5E93\u65E8\u5728\u4F7F\u52A8\u753B\u53D8\u5F97\u6D41\u7545\uFF0C\u5F3A\u5927\u5E76\u6613\u4E8E\u6784\u5EFA\u548C\u7EF4\u62A4\u3002",(0,s.jsx)(n.code,{children:"Animated"}),"\u4FA7\u91CD\u4E8E\u8F93\u5165\u548C\u8F93\u51FA\u4E4B\u95F4\u7684\u58F0\u660E\u6027\u5173\u7CFB\uFF0C\u4EE5\u53CA\u4E24\u8005\u4E4B\u95F4\u7684\u53EF\u914D\u7F6E\u53D8\u6362\uFF0C\u6B64\u5916\u8FD8\u63D0\u4F9B\u4E86\u7B80\u5355\u7684 ",(0,s.jsx)(n.code,{children:"start/stop"}),"\u65B9\u6CD5\u6765\u63A7\u5236\u57FA\u4E8E\u65F6\u95F4\u7684\u52A8\u753B\u6267\u884C\u3002"]}),"\n",(0,s.jsxs)(n.p,{children:["\u521B\u5EFA\u52A8\u753B\u6700\u57FA\u672C\u7684\u5DE5\u4F5C\u6D41\u7A0B\u662F\u5148\u521B\u5EFA\u4E00\u4E2A ",(0,s.jsx)(n.code,{children:"Animated.Value"})," \uFF0C\u5C06\u5B83\u8FDE\u63A5\u5230\u52A8\u753B\u7EC4\u4EF6\u7684\u4E00\u4E2A\u6216\u591A\u4E2A\u6837\u5F0F\u5C5E\u6027\uFF0C\u7136\u540E\u4F7F\u7528",(0,s.jsx)(n.code,{children:"Animated.timing()"}),"\u901A\u8FC7\u52A8\u753B\u6548\u679C\u5C55\u793A\u6570\u636E\u7684\u53D8\u5316\uFF1A"]}),"\n",(0,s.jsxs)(n.blockquote,{children:["\n",(0,s.jsxs)(n.p,{children:["\u8BF7\u4E0D\u8981\u76F4\u63A5\u4FEE\u6539\u52A8\u753B\u503C\uFF01\u4F60\u53EF\u4EE5\u7528",(0,s.jsxs)(n.a,{href:"https://zh-hans.reactjs.org/docs/hooks-reference.html#useref",children:[(0,s.jsx)(n.code,{children:"useRef"})," Hook"]}),"\u6765\u8FD4\u56DE\u4E00\u4E2A\u53EF\u4FEE\u6539\u7684 ref \u5F15\u7528\u3002ref \u5BF9\u8C61\u7684",(0,s.jsx)(n.code,{children:"current"}),"\u5C5E\u6027\u5728\u521D\u59CB\u5316\u65F6\u88AB\u8D4B\u4E88\u7ED9\u5B9A\u7684\u52A8\u753B\u503C\uFF0C\u4E14\u5728\u7EC4\u4EF6\u7684\u751F\u547D\u5468\u671F\u5185\u4FDD\u5B58\u4E0D\u88AB\u9500\u6BC1\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.h2,{id:"\u793A\u4F8B",children:"\u793A\u4F8B"}),"\n",(0,s.jsxs)(n.p,{children:["\u4E0B\u9762\u7684\u4F8B\u5B50\u6F14\u793A\u4E86\u4E00\u4E2A\u6839\u636E\u52A8\u753B\u503C",(0,s.jsx)(n.code,{children:"fadeAnim"}),"\u6765\u6DE1\u5165\u6DE1\u51FA\u7684\u89C6\u56FE\uFF1A"]}),"\n",(0,s.jsx)(n.div,{className:"snack-player","data-snack-name":"Animated","data-snack-description":"Example usage","data-snack-files":"%7B%22App.tsx%22%3A%7B%22type%22%3A%22CODE%22%2C%22contents%22%3A%22import%20React%2C%20%7BuseRef%7D%20from%20'react'%3B%5Cnimport%20%7B%5Cn%20%20Animated%2C%5Cn%20%20Text%2C%5Cn%20%20View%2C%5Cn%20%20StyleSheet%2C%5Cn%20%20Button%2C%5Cn%20%20SafeAreaView%2C%5Cn%7D%20from%20'react-native'%3B%5Cn%5Cnconst%20App%20%3D%20()%20%3D%3E%20%7B%5Cn%20%20%2F%2F%20fadeAnim%20will%20be%20used%20as%20the%20value%20for%20opacity.%20Initial%20Value%3A%200%5Cn%20%20const%20fadeAnim%20%3D%20useRef(new%20Animated.Value(0)).current%3B%5Cn%5Cn%20%20const%20fadeIn%20%3D%20()%20%3D%3E%20%7B%5Cn%20%20%20%20%2F%2F%20Will%20change%20fadeAnim%20value%20to%201%20in%205%20seconds%5Cn%20%20%20%20Animated.timing(fadeAnim%2C%20%7B%5Cn%20%20%20%20%20%20toValue%3A%201%2C%5Cn%20%20%20%20%20%20duration%3A%205000%2C%5Cn%20%20%20%20%20%20useNativeDriver%3A%20true%2C%5Cn%20%20%20%20%7D).start()%3B%5Cn%20%20%7D%3B%5Cn%5Cn%20%20const%20fadeOut%20%3D%20()%20%3D%3E%20%7B%5Cn%20%20%20%20%2F%2F%20Will%20change%20fadeAnim%20value%20to%200%20in%203%20seconds%5Cn%20%20%20%20Animated.timing(fadeAnim%2C%20%7B%5Cn%20%20%20%20%20%20toValue%3A%200%2C%5Cn%20%20%20%20%20%20duration%3A%203000%2C%5Cn%20%20%20%20%20%20useNativeDriver%3A%20true%2C%5Cn%20%20%20%20%7D).start()%3B%5Cn%20%20%7D%3B%5Cn%5Cn%20%20return%20(%5Cn%20%20%20%20%3CSafeAreaView%20style%3D%7Bstyles.container%7D%3E%5Cn%20%20%20%20%20%20%3CAnimated.View%5Cn%20%20%20%20%20%20%20%20style%3D%7B%5B%5Cn%20%20%20%20%20%20%20%20%20%20styles.fadingContainer%2C%5Cn%20%20%20%20%20%20%20%20%20%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Bind%20opacity%20to%20

1animated%20value%5Cn%20%20%20%20%20%20%20%20%20%20%20%20opacity%3A%20fadeAnim%2C%5Cn%20%20%20%20%20%20%20%20%20%20%7D%2C%5Cn%20%20%20%20%20%20%20%20%5D%7D%3E%5Cn%20%20%20%20%20%20%20%20%3CText%20style%3D%7Bstyles.fadingText%7D%3EFading%20View!%3C%2FText%3E%5Cn%20%20%20%20%20%20%3C%2FAnimated.View%3E%5Cn%20%20%20%20%20%20%3CView%20style%3D%7Bstyles.buttonRow%7D%3E%5Cn%20%20%20%20%20%20%20%20%3CButton%20title%3D%5C%22Fade%20In%20View%5C%22%20onPress%3D%7BfadeIn%7D%20%2F%3E%5Cn%20%20%20%20%20%20%20%20%3CButton%20title%3D%5C%22Fade%20Out%20View%5C%22%20onPress%3D%7BfadeOut%7D%20%2F%3E%5Cn%20%20%20%20%20%20%3C%2FView%3E%5Cn%20%20%20%20%3C%2FSafeAreaView%3E%5Cn%20%20)%3B%5Cn%7D%3B%5Cn%5Cnconst%20styles%20%3D%20StyleSheet.create(%7B%5Cn%20%20container%3A%20%7B%5Cn%20%20%20%20flex%3A%201%2C%5Cn%20%20%20%20alignItems%3A%20'center'%2C%5Cn%20%20%20%20justifyContent%3A%20'center'%2C%5Cn%20%20%7D%2C%5Cn%20%20fadingContainer%3A%20%7B%5Cn%20%20%20%20padding%3A%2020%2C%5Cn%20%20%20%20backgroundColor%3A%20'powderblue'%2C%5Cn%20%20%7D%2C%5Cn%20%20fadingText%3A%20%7B%5Cn%20%20%20%20fontSize%3A%2028%2C%5Cn%20%20%7D%2C%5Cn%20%20buttonRow%3A%20%7B%5Cn%20%20%20%20flexBasis%3A%20100%2C%5Cn%20%20%20%20justifyContent%3A%20'space-evenly'%2C%5Cn%20%20%20%20marginVertical%3A%2016%2C%5Cn%20%20%7D%2C%5Cn%7D)%3B%5Cn%5Cnexport%20default%20App%3B%22%7D%7D","data-snack-dependencies":"react-native-safe-area-context","data-snack-platform":"web","data-snack-supported-platforms":"ios,android,web","data-snack-theme":"light","data-snack-preview":"true","data-snack-loading":"lazy","data-snack-device-appearance":"light","data-snack-device-frame":"false"}),"\n",(0,s.jsxs)(n.p,{children:["\u4F60\u53EF\u4EE5\u5728",(0,s.jsx)(n.a,{href:"animations#animated-api",children:"\u52A8\u753B"}),"\u6587\u6863\u4E2D\u770B\u5230\u66F4\u591A\u5B9E\u9645\u7684\u4F8B\u5B50\u3002"]}),"\n",(0,s.jsx)(n.h2,{id:"\u6982\u89C8",children:"\u6982\u89C8"}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"Animated"}),"\u63D0\u4F9B\u4E86\u4E24\u79CD\u7C7B\u578B\u7684\u503C\uFF1A"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#value",children:(0,s.jsx)(n.code,{children:"Animated.Value()"})}),"\u7528\u4E8E\u5355\u4E2A\u503C"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#valuexy",children:(0,s.jsx)(n.code,{children:"Animated.ValueXY()"})}),"\u7528\u4E8E\u77E2\u91CF\u503C"]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"Animated.Value"}),"\u53EF\u4EE5\u7ED1\u5B9A\u5230\u6837\u5F0F\u6216\u662F\u5176\u4ED6\u5C5E\u6027\u4E0A\uFF0C\u4E5F\u53EF\u4EE5\u8FDB\u884C\u63D2\u503C\u8FD0\u7B97\u3002\u5355\u4E2A",(0,s.jsx)(n.code,{children:"Animated.Value"}),"\u53EF\u4EE5\u7528\u5728\u4EFB\u610F\u591A\u4E2A\u5C5E\u6027\u4E0A\u3002"]}),"\n",(0,s.jsx)(n.h3,{id:"\u914D\u7F6E\u52A8\u753B",children:"\u914D\u7F6E\u52A8\u753B"}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"Animated"}),"\u63D0\u4F9B\u4E86\u4E09\u79CD\u52A8\u753B\u7C7B\u578B\u3002\u6BCF\u79CD\u52A8\u753B\u7C7B\u578B\u90FD\u63D0\u4F9B\u4E86\u7279\u5B9A\u7684\u51FD\u6570\u66F2\u7EBF\uFF0C\u7528\u4E8E\u63A7\u5236\u52A8\u753B\u503C\u4ECE\u521D\u59CB\u503C\u53D8\u5316\u5230\u6700\u7EC8\u503C\u7684\u53D8\u5316\u8FC7\u7A0B\uFF1A"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#decay",children:(0,s.jsx)(n.code,{children:"Animated.decay()"})}),"\u4EE5\u6307\u5B9A\u7684\u521D\u59CB\u901F\u5EA6\u5F00\u59CB\u53D8\u5316\uFF0C\u7136\u540E\u53D8\u5316\u901F\u5EA6\u8D8A\u6765\u8D8A\u6162\u76F4\u81F3\u505C\u4E0B\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#spring",children:(0,s.jsx)(n.code,{children:"Animated.spring()"})}),"\u63D0\u4F9B\u4E86\u4E00\u4E2A\u57FA\u7840\u7684\u5F39\u7C27\u7269\u7406\u6A21\u578B."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#timing",children:(0,s.jsx)(n.code,{children:"Animated.timing()"})}),"\u4F7F\u7528",(0,s.jsx)(n.a,{href:"easing",children:"easing \u51FD\u6570"}),"\u8BA9\u6570\u503C\u968F\u65F6\u95F4\u52A8\u8D77\u6765\u3002"]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["\u5927\u591A\u6570\u60C5\u51B5\u4E0B\u4F60\u5E94\u8BE5\u4F7F\u7528",(0,s.jsx)(n.code,{children:"timing()"}),"\u3002\u9ED8\u8BA4\u60C5\u51B5\u4E0B\uFF0C\u5B83\u4F7F\u7528\u5BF9\u79F0\u7684 easeInOut \u66F2\u7EBF\uFF0C\u5C06\u5BF9\u8C61\u9010\u6E10\u52A0\u901F\u5230\u5168\u901F\uFF0C\u7136\u540E\u901A\u8FC7\u9010\u6E10\u51CF\u901F\u505C\u6B62\u7ED3\u675F\u3002"]}),"\n",(0,s.jsx)(n.h3,{id:"\u4F7F\u7528\u52A8\u753B",children:"\u4F7F\u7528\u52A8\u753B"}),"\n",(0,s.jsxs)(n.p,{children:["\u901A\u8FC7\u5728\u52A8\u753B\u4E0A\u8C03\u7528",(0,s.jsx)(n.code,{children:"start()"}),"\u6765\u542F\u52A8\u52A8\u753B\u3002 ",(0,s.jsx)(n.code,{children:"start()"}),"\u53EF\u4EE5\u4F20\u5165\u4E00\u4E2A\u56DE\u8C03\u51FD\u6570\uFF0C\u4EE5\u4FBF\u5728\u52A8\u753B\u5B8C\u6210\u65F6\u5F97\u5230\u901A\u77E5\u8C03\u7528\u3002\u5982\u679C\u52A8\u753B\u8FD0\u884C\u6B63\u5E38\uFF0C\u5219\u5B8C\u6210\u56DE\u8C03\u6536\u5230\u7684\u503C\u4E3A",(0,s.jsx)(n.code,{children:"{finished\uFF1Atrue}"}),"\u3002\u5982\u679C\u52A8\u753B\u662F\u56E0\u4E3A\u8C03\u7528\u4E86",(0,s.jsx)(n.code,{children:"stop()"}),"\u800C\u7ED3\u675F\uFF08\u4F8B\u5982\uFF0C\u56E0\u4E3A\u5B83\u88AB\u624B\u52BF\u6216\u5176\u4ED6\u52A8\u753B\u4E2D\u65AD\uFF09\uFF0C\u5219\u5B83\u4F1A\u6536\u5230",(0,s.jsx)(n.code,{children:"{finished\uFF1Afalse}"}),"\u3002"]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"Animated.timing({}).start(({finished}) => {\n  /* \u52A8\u753B\u5B8C\u6210\u7684\u56DE\u8C03\u51FD\u6570 */\n});\n"})}),"\n",(0,s.jsx)(n.h3,{id:"\u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8",children:"\u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8"}),"\n",(0,s.jsx)(n.p,{children:"\u4F7F\u7528\u539F\u751F\u52A8\u753B\uFF0C\u6211\u4EEC\u4F1A\u5728\u5F00\u59CB\u52A8\u753B\u4E4B\u524D\u5C06\u6240\u6709\u5173\u4E8E\u52A8\u753B\u7684\u5185\u5BB9\u53D1\u9001\u5230\u539F\u751F\u4EE3\u7801\uFF0C\u4ECE\u800C\u4F7F\u7528\u539F\u751F\u4EE3\u7801\u5728 UI \u7EBF\u7A0B\u4E0A\u6267\u884C\u52A8\u753B\uFF0C\u800C\u4E0D\u662F\u901A\u8FC7\u5BF9\u6BCF\u4E00\u5E27\u7684\u6865\u63A5\u53BB\u6267\u884C\u52A8\u753B\u3002\u4E00\u65E6\u52A8\u753B\u5F00\u59CB\uFF0CJS \u7EBF\u7A0B\u5C31\u53EF\u4EE5\u5728\u4E0D\u5F71\u54CD\u52A8\u753B\u6548\u679C\u7684\u60C5\u51B5\u4E0B\u963B\u585E\uFF08\u53BB\u6267\u884C\u5176\u4ED6\u4EFB\u52A1\uFF09\u6389\u4E86\u3002"}),"\n",(0,s.jsxs)(n.p,{children:["\u60A8\u53EF\u4EE5\u901A\u8FC7\u5728\u52A8\u753B\u914D\u7F6E\u4E2D\u6307\u5B9A",(0,s.jsx)(n.code,{children:"useNativeDriver\uFF1Atrue"})," \u6765\u4F7F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8\u3002\u4F60\u53EF\u4EE5\u5728",(0,s.jsx)(n.a,{href:"animations#%E5%90%AF%E7%94%A8%E5%8E%9F%E7%94%9F%E5%8A%A8%E7%94%BB%E9%A9%B1%E5%8A%A8",children:"\u52A8\u753B\u6587\u6863"})," \u4E2D\u770B\u5230\u66F4\u8BE6\u7EC6\u7684\u89E3\u91CA\u3002"]}),"\n",(0,s.jsx)(n.h3,{id:"\u81EA\u5B9A\u4E49\u52A8\u753B\u7EC4\u4EF6",children:"\u81EA\u5B9A\u4E49\u52A8\u753B\u7EC4\u4EF6"}),"\n",(0,s.jsx)(n.p,{children:"\u7EC4\u4EF6\u5FC5\u987B\u7ECF\u8FC7\u7279\u6B8A\u5904\u7406\u624D\u80FD\u7528\u4E8E\u52A8\u753B\u3002\u6240\u8C13\u7684\u7279\u6B8A\u5904\u7406\u4E3B\u8981\u662F\u6307\u628A\u52A8\u753B\u503C\u7ED1\u5B9A\u5230\u5C5E\u6027\u4E0A\uFF0C\u5E76\u4E14\u5728\u4E00\u5E27\u5E27\u6267\u884C\u52A8\u753B\u65F6\u907F\u514D react \u91CD\u65B0\u6E32\u67D3\u548C\u91CD\u65B0\u8

1C03\u548C\u7684\u5F00\u9500\u3002\u6B64\u5916\u8FD8\u5F97\u5728\u7EC4\u4EF6\u5378\u8F7D\u65F6\u505A\u4E00\u4E9B\u6E05\u7406\u5DE5\u4F5C\uFF0C\u4F7F\u5F97\u8FD9\u4E9B\u7EC4\u4EF6\u5728\u4F7F\u7528\u65F6\u662F\u5B89\u5168\u7684\u3002"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#createanimatedcomponent",children:(0,s.jsx)(n.code,{children:"createAnimatedComponent()"})}),"\u65B9\u6CD5\u6B63\u662F\u7528\u6765\u5904\u7406\u7EC4\u4EF6\uFF0C\u4F7F\u5176\u53EF\u4EE5\u7528\u4E8E\u52A8\u753B\u3002"]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"Animated"}),"\u4E2D\u9ED8\u8BA4\u5BFC\u51FA\u4E86\u4EE5\u4E0B\u8FD9\u4E9B\u53EF\u4EE5\u76F4\u63A5\u4F7F\u7528\u7684\u52A8\u753B\u7EC4\u4EF6\uFF0C\u5F53\u7136\u5B83\u4EEC\u90FD\u662F\u901A\u8FC7\u4F7F\u7528\u4E0A\u9762\u8FD9\u4E2A\u65B9\u6CD5\u8FDB\u884C\u4E86\u5C01\u88C5\uFF1A"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.Image"})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.ScrollView"})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.Text"})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.View"})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.FlatList"})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.code,{children:"Animated.SectionList"})}),"\n"]}),"\n",(0,s.jsx)(n.h3,{id:"\u7EC4\u5408\u52A8\u753B",children:"\u7EC4\u5408\u52A8\u753B"}),"\n",(0,s.jsx)(n.p,{children:"\u52A8\u753B\u8FD8\u53EF\u4EE5\u4F7F\u7528\u7EC4\u5408\u51FD\u6570\u4EE5\u590D\u6742\u7684\u65B9\u5F0F\u8FDB\u884C\u7EC4\u5408\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#delay",children:(0,s.jsx)(n.code,{children:"Animated.delay()"})}),"\u5728\u7ED9\u5B9A\u5EF6\u8FDF\u540E\u5F00\u59CB\u52A8\u753B\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#parallel",children:(0,s.jsx)(n.code,{children:"Animated.parallel()"})}),"\u540C\u65F6\u542F\u52A8\u591A\u4E2A\u52A8\u753B\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#sequence",children:(0,s.jsx)(n.code,{children:"Animated.sequence()"})}),"\u6309\u987A\u5E8F\u542F\u52A8\u52A8\u753B\uFF0C\u7B49\u5F85\u6BCF\u4E00\u4E2A\u52A8\u753B\u5B8C\u6210\u540E\u518D\u5F00\u59CB\u4E0B\u4E00\u4E2A\u52A8\u753B\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.a,{href:"animated#stagger",children:(0,s.jsx)(n.code,{children:"Animated.stagger()"})}),"\u6309\u7167\u7ED9\u5B9A\u7684\u5EF6\u65F6\u95F4\u9694\uFF0C\u987A\u5E8F\u5E76\u884C\u7684\u542F\u52A8\u52A8\u753B\u3002"]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["\u52A8\u753B\u4E5F\u53EF\u4EE5\u901A\u8FC7\u5C06",(0,s.jsx)(n.code,{children:"toValue"}),"\u8BBE\u7F6E\u4E3A\u53E6\u4E00\u4E2A\u52A8\u753B\u7684",(0,s.jsx)(n.code,{children:"Animated.Value"}),"\u6765\u7B80\u5355\u7684\u94FE\u63A5\u5728\u4E00\u8D77\u3002\u8BF7\u53C2\u9605\u52A8\u753B\u6307\u5357\u4E2D\u7684",(0,s.jsx)(n.a,{href:"animations#%E8%B7%9F%E8%B8%AA%E5%8A%A8%E6%80%81%E5%80%BC",children:"\u8DDF\u8E2A\u52A8\u6001\u503C"}),"\u503C\u3002"]}),"\n",(0,s.jsx)(n.p,{children:"\u9ED8\u8BA4\u60C5\u51B5\u4E0B\uFF0C\u5982\u679C\u4E00\u4E2A\u52A8\u753B\u505C\u6B62\u6216\u4E2D\u65AD\uFF0C\u5219\u7EC4\u5408\u4E2D\u7684\u6240\u6709\u5176\u4ED6\u52A8\u753B\u4E5F\u4F1A\u505C\u6B62\u3002"}),"\n",(0,s.jsx)(n.h3,{id:"\u5408\u6210\u52A8\u753B\u503C",children:"\u5408\u6210\u52A8\u753B\u503C"}),"\n",(0,s.jsx)(n.p,{children:"\u4F60\u53EF\u4EE5\u4F7F\u7528\u52A0\u51CF\u4E58\u9664\u4EE5\u53CA\u53D6\u4F59\u7B49\u8FD0\u7B97\u6765\u628A\u4E24\u4E2A\u52A8\u753B\u503C\u5408\u6210\u4E3A\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#add",children:(0,s.jsx)(n.code,{children:"Animated.add()"})})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#subtract",children:(0,s.jsx)(n.code,{children:"Animated.subtract()"})})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#divide",children:(0,s.jsx)(n.code,{children:"Animated.divide()"})})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#modulo",children:(0,s.jsx)(n.code,{children:"Animated.modulo()"})})}),"\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#multiply",children:(0,s.jsx)(n.code,{children:"Animated.multiply()"})})}),"\n"]}),"\n",(0,s.jsx)(n.h3,{id:"\u63D2\u503C",children:"\u63D2\u503C"}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.code,{children:"interpolate()"}),"\u51FD\u6570\u5141\u8BB8\u8F93\u5165\u8303\u56F4\u6620\u5C04\u5230\u4E0D\u540C\u7684\u8F93\u51FA\u8303\u56F4\u3002\u9ED8\u8BA4\u60C5\u51B5\u4E0B\uFF0C\u5B83\u5C06\u63A8\u65AD\u8D85\u51FA\u7ED9\u5B9A\u8303\u56F4\u7684\u66F2\u7EBF\uFF0C\u4F46\u4E5F\u53EF\u4EE5\u9650\u5236\u8F93\u51FA\u503C\u3002\u5B83\u9ED8\u8BA4\u4F7F\u7528\u7EBF\u6027\u63D2\u503C\uFF0C\u4F46\u4E5F\u652F\u6301\u7F13\u52A8\u529F\u80FD\u3002"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#%E6%8F%92%E5%80%BC",children:(0,s.jsx)(n.code,{children:"interpolate()"})})}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["\u4F60\u53EF\u4EE5\u5728",(0,s.jsx)(n.a,{href:"animations#%E6%8F%92%E5%80%BC",children:"\u52A8\u753B"}),"\u6587\u6863\u4E2D\u4E86\u89E3\u5230\u66F4\u591A\u3002"]}),"\n",(0,s.jsx)(n.h3,{id:"\u5904\u7406\u624B\u52BF\u548C\u5176\u4ED6\u4E8B\u4EF6",children:"\u5904\u7406\u624B\u52BF\u548C\u5176\u4ED6\u4E8B\u4EF6"}),"\n",(0,s.jsxs)(n.p,{children:["\u624B\u52BF\uFF0C\u5982\u5E73\u79FB\u6216\u6EDA\u52A8\uFF0C\u4EE5\u53CA\u5176\u4ED6\u4E8B\u4EF6\u53EF\u4EE5\u4F7F\u7528",(0,s.jsx)(n.code,{children:"Animated.event()"}),"\u76F4\u63A5\u6620\u5C04\u5230\u52A8\u753B\u503C\u3002\u8FD9\u662F\u901A\u8FC7\u7ED3\u6784\u5316\u6620\u5C04\u8BED\u6CD5\u5B8C\u6210\u7684\uFF0C\u4EE5\u4FBF\u53EF\u4EE5\u4ECE\u590D\u6742\u7684\u4E8B\u4EF6\u5BF9\u8C61\u4E2D\u63D0\u53D6\u503C\u3002\u7B2C\u4E00\u5C42\u53C2\u6570\u662F\u4

1E00\u4E2A\u6570\u7EC4\uFF0C\u4F60\u53EF\u4EE5\u5728\u5176\u4E2D\u6307\u5B9A\u591A\u4E2A\u53C2\u6570\u6620\u5C04\uFF0C\u8FD9\u79CD\u6620\u5C04\u53EF\u4EE5\u662F\u5D4C\u5957\u7684\u5BF9\u8C61\u3002"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsx)(n.li,{children:(0,s.jsx)(n.a,{href:"animated#event",children:(0,s.jsx)(n.code,{children:"Animated.event()"})})}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["\u4F8B\u5982\uFF0C\u5728\u4F7F\u7528\u6C34\u5E73\u6EDA\u52A8\u624B\u52BF\u65F6\uFF0C\u4E3A\u4E86\u5C06",(0,s.jsx)(n.code,{children:"event.nativeEvent.contentOffset.x"}),"\u6620\u5C04\u5230",(0,s.jsx)(n.code,{children:"scrollX"}),"\uFF08",(0,s.jsx)(n.code,{children:"Animated.Value"}),"\uFF09\uFF0C\u60A8\u9700\u8981\u6267\u884C\u4EE5\u4E0B\u64CD\u4F5C\uFF1A"]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:" onScroll={Animated.event(\n   // scrollX = e.nativeEvent.contentOffset.x\n   [{ nativeEvent: {\n        contentOffset: {\n          x: scrollX\n        }\n      }\n    }]\n )}\n"})}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h1,{id:"\u6587\u6863",children:"\u6587\u6863"}

1),"\n",(0,s.jsx)(n.h2,{id:"\u65B9\u6CD5",children:"\u65B9\u6CD5"}),"\n",(0,s.jsxs)(n.p,{children:["\u5982\u679C\u4E0B\u9762\u7684\u65B9\u6CD5\u53C2\u6570\u662F\u4E8C\u7EF4\u5411\u91CF\u503C ValueXY \u800C\u4E0D\u662F\u5355\u4E00\u6807\u91CF\u503C Value\uFF0C\u5219\u5BF9\u5E94\u7684\u914D\u7F6E\u53C2\u6570 config \u4E5F\u5E94\u8BE5\u662F\u4E8C\u7EF4\u5411\u91CF\u5F62\u5F0F",(0,s.jsx)(n.code,{children:"{x: ..., y: ...}"}),"\u3002"]}),"\n",(0,s.jsx)(n.h3,{id:"decay",children:(0,s.jsx)(n.code,{children:"decay()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static decay(value, config): CompositeAnimation;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u63A8\u52A8\u4E00\u4E2A\u503C\u4EE5\u4E00\u4E2A\u521D\u59CB\u7684\u901F\u5EA6\u548C\u4E00\u4E2A\u8870\u51CF\u7CFB\u6570\u9010\u6E10\u53D8\u4E3A 0\u3002"}),"\n",(0,s.jsx)(n.p,{children:"Config \u53C2\u6570\u6709\u4EE5\u4E0B\u8FD9\u4E9B\u5C5E\u6027\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"velocity"}),": \u521D\u59CB\u901F\u5EA6\u3002\u5FC5\u9700\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"deceleration"}),": \u8870\u51CF\u7CFB\u6570\u3002\u9ED8\u8BA4\u503C 0.997\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"isInteraction"}),": \u6307\u5B9A\u672C\u52A8\u753B\u662F\u5426\u5728",(0,s.jsx)(n.code,{children:"InteractionManager"}),"\u7684\u961F\u5217\u4E2D\u6CE8\u518C\u4EE5\u5F71\u54CD\u5176\u4EFB\u52A1\u8C03\u5EA6\u3002\u9ED8\u8BA4\u503C\u4E3A true\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"useNativeDriver"}),": \u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8\u3002\u9ED8\u8BA4\u4E0D\u542F\u7528(false)\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"timing",children:(0,s.jsx)(n.code,{children:"timing()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static timing(value, config): CompositeAnimation;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u63A8\u52A8\u4E00\u4E2A\u503C\u6309\u7167\u4E00\u4E2A\u7F13\u52A8\u66F2\u7EBF\u800C\u968F\u65F6\u95F4\u53D8\u5316\u3002",(0,s.jsx)(n.a,{href:"easing",children:(0,s.jsx)(n.code,{children:"Easing"})}),"\u6A21\u5757\u5B9A\u4E49\u4E86\u4E00\u5927\u5806\u66F2\u7EBF\uFF0C\u4F60\u4E5F\u53EF\u4EE5\u4F7F\u7528\u4F60\u81EA\u5DF1\u7684\u51FD\u6570\u3002"]}),"\n",(0,s.jsx)(n.p,{children:"Config \u53C2\u6570\u6709\u4EE5\u4E0B\u8FD9\u4E9B\u5C5E\u6027\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"duration"}),": \u52A8\u753B\u7684\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09\u3002\u9ED8\u8BA4\u503C\u4E3A 500."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"easing"}),": \u7F13\u52A8\u51FD\u6570\u3002 \u9ED8\u8BA4\u4E3A",(0,s.jsx)(n.code,{children:"Easing.inOut(Easing.ease)"}),"\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"delay"}),": \u5F00\u59CB\u52A8\u753B\u524D\u7684\u5EF6\u8FDF\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09\u3002\u9ED8\u8BA4\u4E3A 0."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"isInteraction"}),": \u6307\u5B9A\u672C\u52A8\u753B\u662F\u5426\u5728",(0,s.jsx)(n.code,{children:"InteractionManager"}),"\u7684\u961F\u5217\u4E2D\u6CE8\u518C\u4EE5\u5F71\u54CD\u5176\u4EFB\u52A1\u8C03\u5EA6\u3002\u9ED8\u8BA4\u503C\u4E3A true\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"useNativeDriver"}),": \u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8\u3002\u9ED8\u8BA4\u4E0D\u542F\u7528(false)\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"spring",children:(0,s.jsx)(n.code,{children:"spring()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static spring(value, config): CompositeAnimation;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u6839\u636E\u57FA\u4E8E",(0,s.jsx)(n.a,{href:"https://en.wikipedia.org/wiki/Harmonic_oscillator#Damped_harmonic_oscillator",children:"\u963B\u5C3C\u8C10\u632F\u52A8 damped harmonic oscillation"}),"\u7684\u5F39\u6027\u6A21\u578B\u751F\u6210\u4E00\u4E2A\u52A8\u753B\u503C\u3002\u5B83\u4F1A\u5728",(0,s.jsx)(n.code,{children:"toValue"}),"\u503C\u66F4\u65B0\u7684\u540C\u65F6\u8DDF\u8E2A\u5F53\u524D\u7684\u901F\u5EA6\u72B6\u6001\uFF0C\u4EE5\u786E\u4FDD\u52A8\u753B\u8FDE\u8D2F\u3002\u53EF\u4EE5\u94FE\u5F0F\u8C03\u7528\u3002"]}),"\n",(0,s.jsx)(n.p,{children:"Config \u53C2\u6570\u6709\u4EE5\u4E0B\u8FD9\u4E9B\u5C5E\u6027\uFF1A"}),"\n",(0,s.jsx)(n.p,{children:"\u6CE8\u610F\u4F60\u4E0D\u80FD\u540C\u65F6\u5B9A\u4E49 bounciness/speed\u3001tension/friction \u6216 stiffness/damping/mass \u8FD9\u4E09\u7EC4\u6570\u636E\uFF0C\u53EA\u80FD\u6307\u5B9A\u5176\u4E2D\u4E00\u7EC4\uFF1A"}),"\n",(0,s.jsxs)(n.p,{children:["friction/tension \u6216 bounciness/speed \u9009\u9879\u7B26\u5408",(0,s.jsx)(n.a,{href:"https://github.com/facebook/pop",children:"Facebook Pop"}),", ",(0,s.jsx)(n.a,{href:"http://facebook.github.io/rebound/",children:"Rebound"}),", \u6216\u662F ",(0,s.jsx)(n.a,{href:"http://origami.design/",children:"Origami"}),"\u4E2D\u7684 spring \u6A21\u578B\u5B9A\u4E49\u3002"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"friction"}),": \u63A7\u5236\u5F39\u6027/\u5E45\u5EA6\u3002\u9ED8\u8BA4\u503C 7\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"tension"}),": \u63A7\u5236\u901F\u5EA6\u3002\u9ED8\u8BA4\u503C 40."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"speed"}),": \u63A7\u5236\u52A8\u753B\u901F\u5EA6\u3002\u9ED8\u8BA4\u503C 12."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"bounciness"}),": \u63A7\u5236\u5F39\u6027\u3002\u9ED8\u8BA4\u503C 8."]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["\u6307\u5B9A stiffness/damping/mass \u4F5C\u4E3A\u53C2\u6570\uFF0C\u4F7F",(0,s.jsx)(n.code,{children:"Animated.spring"}),"\u4F7F\u7528\u57FA\u4E8E",(0,s.jsx)(n.a,{href:"https://en.wikipedia.org/wiki/Harmonic_oscillator#Damped_harmonic_oscillator",children:"\u963B\u5C3C\u8C10\u632F\u5B50"}),"\u7684\u8FD0\u52A8\u65B9\u7A0B\u7684\u89E3\u6790\u5F39\u7C27\u6A21\u578B\u3002\u8FD9\u79CD\u884C\u4E3A\u7565\u5FAE\u66F4\u7CBE\u786E\uFF0C\u66F4\u5FE0\u5B9E\u4E8E\u5F39\u7C27\u52A8\u529B\u5B66\u80CC\u540E\u7684\u7269\u7406\u539F\u7406\uFF0C\u5E76\u4E14\u66F4\u8D34\u8FD1 iOS \u7684 CASpringAnimation \u4E2D\u7684\u5B9E\u73B0\u3002"]}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"stiffness"}),": \u5F39\u7C27\u521A\u5EA6\u7CFB\u6570\u3002\u9ED8\u8BA4\u503C 100."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"damping"}),": \u5B9A\u4E49\u4E86\u5F39\u7C27\u8FD0\u52A8\u7531\u4E8E\u6469\u64E6\u529B\u800C\u5E94\u53D7\u5230\u7684\u963B\u5C3C\u3002 \u9ED8\u8BA4\u503C 10."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"mass"}),": \u5F39\u7C27\u672B\u7AEF\u9644\u7740\u7269\u4F53\u7684\u8D28\u91CF\u3002\u9ED8\u8BA4\u503C 1."]}),"\n"]}),"\n",(0,s.jsx)(n.p,{children:"\u8FD8\u6709\u4E00\u4E9B\u5176\u4ED6\u7684\u914D\u7F6E\u53C2\u6570\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"velocity"}),": \u7269\u4F53\u9644\u7740\u5728\u5F39\u7C27\u4E0A\u7684\u521D\u59CB\u901F\u5EA6\u3002\u9ED8\u8BA4\u503C\u4E3A 0\uFF08\u7269\u4F53\u9759\u6B62\uFF09\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"overshootClamping"}),"\uFF1A\u5E03\u5C14\u503C\uFF0C\u6307\u793A\u662F\u5426\u5E94\u8BE5\u5939\u7D27\u5F39\u7C27\u800C\u4E0D\u53CD\u5F39\u3002\u9ED8\u8BA4\u4E3A false\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"restDisplacementThreshold"}),"\uFF1A\u4ECE\u9759\u6B62\u72B6\u6001\u5F00\u59CB\u7684\u4F4D\u79FB\u9

1608\u503C\uFF0C\u4F4E\u4E8E\u6B64\u9608\u503C\u65F6\u5E94\u5C06\u5F39\u7C27\u89C6\u4E3A\u5904\u4E8E\u9759\u6B62\u72B6\u6001\u3002\u9ED8\u8BA4\u4E3A 0.001\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"restSpeedThreshold"}),"\uFF1A\u4EE5\u50CF\u7D20/\u79D2\u8868\u793A\u7684\u5F39\u7C27\u88AB\u8BA4\u4E3A\u5904\u4E8E\u9759\u6B62\u72B6\u6001\u7684\u901F\u5EA6\u3002 \u9ED8\u8BA4\u503C 0.001\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"delay"}),"\uFF1A\u5EF6\u8FDF\u540E\u542F\u52A8\u52A8\u753B\uFF08\u6BEB\u79D2\uFF09\u3002 \u9ED8\u8BA4\u503C 0\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"isInteraction"}),": \u6307\u5B9A\u672C\u52A8\u753B\u662F\u5426\u5728",(0,s.jsx)(n.code,{children:"InteractionManager"}),"\u7684\u961F\u5217\u4E2D\u6CE8\u518C\u4EE5\u5F71\u54CD\u5176\u4EFB\u52A1\u8C03\u5EA6\u3002\u9ED8\u8BA4\u503C\u4E3A true\u3002"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"useNativeDriver"}),": \u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8\u3002\u9ED8\u8BA4\u4E0D\u542F\u7528(false)\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"add",children:(0,s.jsx)(n.code,{children:"add()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static add(a: Animated, b: Animated): AnimatedAddition;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5C06\u4E24\u4E2A\u52A8\u753B\u503C\u76F8\u52A0\u8BA1\u7B97\uFF0C\u5F97\u51FA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"subtract",children:(0,s.jsx)(n.code,{children:"subtract()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static subtract(a: Animated, b: Animated): AnimatedSubtraction;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5C06\u4E24\u4E2A\u52A8\u753B\u503C\u76F8\u51CF\u8BA1\u7B97\uFF0C\u5F97\u51FA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"divide",children:(0,s.jsx)(n.code,{children:"divide()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static divide(a: Animated, b: Animated): AnimatedDivision;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5C06\u4E24\u4E2A\u52A8\u753B\u503C\u76F8\u9664\u8BA1\u7B97\uFF0C\u5F97\u51FA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"multiply",children:(0,s.jsx)(n.code,{children:"multiply()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static multiply(a: Animated, b: Animated): AnimatedMultiplication;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5C06\u4E24\u4E2A\u52A8\u753B\u503C\u76F8\u4E58\u8BA1\u7B97\uFF0C\u5F97\u51FA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"modulo",children:(0,s.jsx)(n.code,{children:"modulo()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static modulo(a: Animated, modulus: number): AnimatedModulo;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5C06\u4E24\u4E2A\u52A8\u753B\u503C\u505A\u53D6\u6A21\uFF08\u53D6\u4F59\u6570\uFF09\u8BA1\u7B97\uFF0C\u5F97\u51FA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"diffclamp",children:(0,s.jsx)(n.code,{children:"diffClamp()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static diffClamp(a: Animated, min: number, max: number): AnimatedDiffClamp;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u521B\u5EFA\u4E00\u4E2A\u65B0\u7684\u52A8\u753B\u503C\uFF0C\u8BE5\u503C\u9650\u5236\u5728\u4E24\u4E2A\u7279\u5B9A\u7684\u6570\u503C\u4E4B\u95F4\u3002\u5B83\u4F7F\u7528\u4E0A\u4E00\u6B21\u6570\u503C\u4E0E\u5F53\u524D\u6570\u503C\u4E4B\u5DEE\uFF0C\u56E0\u6B64\u5373\u4F7F\u8BE5\u6570\u503C\u8FDC\u79BB\u8FB9\u754C\uFF0C\u5728\u63A5\u8FD1\u8FB9\u754C\u65F6\u4E5F\u4F1A\u5F00\u59CB\u53D8\u5316\uFF08",(0,s.jsx)(n.code,{children:"value = clamp(value + diff, min, max)"}),"\uFF09\u3002"]}),"\n",(0,s.jsx)(n.p,{children:"\u8FD9\u5728\u6EDA\u52A8\u4E8B\u4EF6\u4E2D\u5F88\u6709\u7528\uFF0C\u4F8B\u5982\uFF0C\u5728\u5411\u4E0A\u6EDA\u52A8\u65F6\u663E\u793A\u5BFC\u822A\u6761\uFF0C\u5411\u4E0B\u6EDA\u52A8\u65F6\u9690\u85CF\u5BFC\u822A\u6761\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"delay",children:(0,s.jsx)(n.code,{children:"delay()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static delay(time: number): CompositeAnimation;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u5728\u6307\u5B9A\u7684\u5EF6\u8FDF\u4E4B\u540E\u5F00\u59CB\u52A8\u753B\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"sequence",children:(0,s.jsx)(n.code,{children:"sequence()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static sequence(animations: CompositeAnimation[]): CompositeAnimation;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u6309\u987A\u5E8F\u6267\u884C\u4E00\u4E2A\u52A8\u753B\u6570\u7EC4\u91CC\u7684\u52A8\u753B\uFF0C\u7B49\u5F85\u4E00\u4E2A\u5B8C\u6210\u540E\u518D\u6267\u884C\u4E0B\u4E00\u4E2A\u3002\u5982\u679C\u5F53\u524D\u7684\u52A8\u753B\u88AB\u4E2D\u6B62\uFF0C\u540E\u9762\u7684\u52A8\u753B\u5219\u4E0D\u4F1A\u7EE7\u7EED\u6267\u884C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"parallel",children:(0,s.jsx)(n.code,{children:"parallel()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static parallel(\n  animations: CompositeAnimation[],\n  config?: ParallelConfig\n): CompositeAnimation;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u540C\u65F6\u5F00\u59CB\u4E00\u4E2A\u52A8\u753B\u6570\u7EC4\u91CC\u7684\u5168\u90E8\u52A8\u753B\u3002\u9ED8\u8BA4\u60C5\u51B5\u4E0B\uFF0C\u5982\u679C\u6709\u4EFB\u4F55\u4E00\u4E2A\u52A8\u753B\u505C\u6B62\u4E86\uFF0C\u5176\u4F59\u7684\u4E5F\u4F1A\u88AB\u505C\u6B62\u3002\u4F60\u53EF\u4EE5\u901A\u8FC7",(0,s.jsx)(n.code,{children:"stopTogether"}),"\u9009\u9879\u6765\u6539\u53D8\u8FD9\u4E2A\u6548\u679C\u3002"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"stagger",children:(0,s.jsx)(n.code,{children:"stagger()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static stagger(\n  time: number,\n  animations: CompositeAnimation[]\n): CompositeAnimation;\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u4E00\u4E2A\u52A8\u753B\u6570\u7EC4\uFF0C\u91CC\u9762\u7684\u52A8\u753B\u6709\u53EF\u80FD\u4F1A\u540C\u65F6\u6267\u884C\uFF08\u91CD\u53E0\uFF09\uFF0C\u4E0D\u8FC7\u4F1A\u4EE5\u6307\u5B9A\u7684\u5EF6\u8FDF\u6765\u5F00\u59CB\u3002\u9002\u7528\u4E8E\u5236\u4F5C\u62D6\u5C3E\u6548\u679C\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"loop",children:(0,s.jsx)(n.code,{children:"loop()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static loop(\n  animation: CompositeAnimation[],\n  config?: LoopAnimationConfig\n): CompositeAnimation;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u65E0\u9650\u5FAA\u73AF\u4E00\u4E2A\u6307\u5B9A\u7684\u52A8\u753B\uFF0C\u4ECE\u5934\u5230\u5C3E\u5468\u800C\u590D\u59CB\u3002\u5982\u679C\u6B64\u5FAA\u73AF\u7684\u5B50\u52A8\u753B\u8BBE\u7F6E\u4E86",(0,s.jsx)(n.code,{children:"useNativeDriver: true"}),"\u5219\u4E0D\u4F1A\u963B\u585E JS \u7EBF\u7A0B\u7684\u6267\u884C\u3002\u6B64\u5916\u5FAA\u73AF\u53EF\u80FD\u5BFC\u81F4\u57FA\u4E8E",(0,s.jsx)(n.code,{children:"VirtualizedList"}),"\u7684\u5217\u8868\u4E0D\u80FD\u52A0\u8F7D\u66F4\u591A\u884C\uFF0C\u6B64\u65F6\u53EF\u4EE5\u5728\u5B50\u52A8\u753B\u4E2D\u8BBE\u7F6E",(0,s.jsx)(n.code,{children:"isInteraction: false"}),"\u6765\u4FEE\u590D\u6B64\u95EE\u9898\u3002"]}

1),"\n",(0,s.jsx)(n.p,{children:"Config \u662F\u4E00\u4E2A\u5BF9\u8C61\uFF0C\u5B83\u5177\u6709\u4EE5\u4E0B\u9009\u9879\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"iterations"}),"\uFF1A\u52A8\u753B\u5E94\u5FAA\u73AF\u7684\u6B21\u6570\u3002\u9ED8\u8BA4\u503C\u4E3A ",(0,s.jsx)(n.code,{children:"-1"}),"\uFF08\u65E0\u9650\uFF09\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"event",children:(0,s.jsx)(n.code,{children:"event()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static event(\n  argMapping: Mapping[],\n  config?: EventConfig\n): (...args: any[]) => void;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u63A5\u53D7\u4E00\u4E2A\u6620\u5C04\u7684\u6570\u7EC4\uFF0C\u5BF9\u5E94\u7684\u89E3\u5F00\u6BCF\u4E2A\u503C\uFF0C\u7136\u540E\u8C03\u7528\u6240\u6709\u5BF9\u5E94\u7684\u8F93\u51FA\u7684",(0,s.jsx)(n.code,{children:"setValue"}),"\u65B9\u6CD5\u3002\u4F8B\u5982\uFF1A"]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:" onScroll={Animated.event(\n   [{nativeEvent: {contentOffset: {x: this._scrollX}}}],\n   {listener: (event) => console.log(event)}, // \u53EF\u9009\u7684\u5F02\u6B65\u76D1\u542C\u51FD\u6570\n )}\n ...\n onPanResponderMove: Animated.event([\n   null,                // \u5FFD\u7565\u539F\u59CB\u4E8B\u4EF6\n   {dx: this._panX}],    // \u624B\u52BF\u72B6\u6001\u53C2\u6570\n{listener: (event, gestureState) => console.log(event, gestureState)}, // \u53EF\u9009\u7684\u5F02\u6B65\u76D1\u542C\u51FD\u6570\n ),\n"})}),"\n",(0,s.jsx)(n.p,{children:"Config \u53C2\u6570\u6709\u4EE5\u4E0B\u8FD9\u4E9B\u5C5E\u6027\uFF1A"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"listener"}),": \u53EF\u9009\u7684\u5F02\u6B65\u76D1\u542C\u51FD\u6570"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"useNativeDriver"}),": \u542F\u7528\u539F\u751F\u52A8\u753B\u9A71\u52A8\u3002\u9ED8\u8BA4\u4E0D\u542F\u7528(false)\u3002"]}),"\n"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"forkevent",children:(0,s.jsx)(n.code,{children:"forkEvent()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"static forkEvent(event: AnimatedEvent, listener: Function): AnimatedEvent;\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u9AD8\u7EA7\u547D\u4EE4\u5F0F API\uFF0C\u7528\u4E8E\u76D1\u542C\u901A\u8FC7 props \u4F20\u9012\u7684\u52A8\u753B\u4E8B\u4EF6\u3002\u5B83\u5141\u8BB8\u5411\u73B0\u6709\u7684",(0,s.jsx)(n.code,{children:"AnimatedEvent"}),"\u6DFB\u52A0\u65B0\u7684 JavaScript \u76D1\u542C\u5668\u3002\u5982\u679C",(0,s.jsx)(n.code,{children:"animatedEvent"}),"\u662F\u4E00\u4E2A JavaScript \u76D1\u542C\u5668\uFF0C\u5219\u4F1A\u5C06\u8FD9\u4E24\u4E2A\u76D1\u542C\u5668\u5408\u5E76\u4E3A\u4E00\u4E2A\uFF1B\u5982\u679C",(0,s.jsx)(n.code,{children:"animatedEvent"}),"\u4E3A\u7A7A/\u672A\u5B9A\u4E49\uFF0C\u5219\u76F4\u63A5\u5206\u914D JavaScript \u76D1\u542C\u5668\u3002\u5C3D\u53EF\u80FD\u76F4\u63A5\u4F7F\u7528\u503C\u3002"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"unforkevent",children:(0,s.jsx)(n.code,{children:"unforkEvent()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"static unforkEvent(event: AnimatedEvent, listener: Function);\n"})}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"start",children:(0,s.jsx)(n.code,{children:"start()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-tsx",metastring:'title="React TSX"',children:"static start(callback?: (result: {finished: boolean}) => void);\n"})}),"\n",(0,s.jsxs)(n.p,{children:["\u901A\u8FC7\u5728\u52A8\u753B\u4E0A\u8C03\u7528",(0,s.jsx)(n.code,{children:"start()"}),"\u6765\u542F\u52A8\u52A8\u753B\u3002 ",(0,s.jsx)(n.code,{children:"start()"}),"\u63A5\u53D7\u4E00\u4E2A\u5B8C\u6210\u56DE\u8C03\u51FD\u6570\uFF0C\u5F53\u52A8\u753B\u5B8C\u6210\u6216\u56E0\u5728\u5B83\u5B8C\u6210\u4E4B\u524D\u8C03\u7528",(0,s.jsx)(n.code,{children:"stop()"}),"\u800C\u7ED3\u675F\u65F6\u5C06\u88AB\u8C03\u7528\u3002"]}),"\n",(0,s.jsx)(n.p,{children:(0,s.jsx)(n.strong,{children:"\u53C2\u6570\uFF1A"})}),"\n",(0,s.jsxs)(n.table,{children:[(0,s.jsx)(n.thead,{children:(0,s.jsxs)(n.tr,{children:[(0,s.jsx)(n.th,{children:"\u540D\u79F0"}),(0,s.jsx)(n.th,{children:"\u7C7B\u578B"}),(0,s.jsx)(n.th,{children:"\u5FC5\u586B"}),(0,s.jsx)(n.th,{children:"\u8BF4\u660E"})]})}),(0,s.jsx)(n.tbody,{children:(0,s.jsxs)(n.tr,{children:[(0,s.jsx)(n.td,{children:"callback"}),(0,s.jsx)(n.td,{children:(0,s.jsx)(n.code,{children:"(result: {finished: boolean}) => void"})}),(0,s.jsx)(n.td,{children:"No"}),(0,s.jsx)(n.td,{children:"\u5728\u52A8\u753B\u6B63\u5E38\u5B8C\u6210\u6216\u56E0\u4E3A\u5

1728\u5B83\u5B8C\u6210\u4E4B\u524D\u8C03\u7528\u4E86 stop()\u800C\u88AB\u5F3A\u5236\u505C\u6B62\u65F6\uFF0C\u5C06\u4F1A\u8C03\u7528\u8BE5\u51FD\u6570\u3002"})]})})]}),"\n",(0,s.jsx)(n.p,{children:"\u4F7F\u7528\u56DE\u8C03\u51FD\u6570\u7684\u793A\u4F8B\uFF1A"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"Animated.timing({}).start(({finished}) => {\n  /* completion callback */\n});\n"})}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"stop",children:(0,s.jsx)(n.code,{children:"stop()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"static stop()\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u505C\u6B62\u6240\u6709\u6B63\u5728\u8FD0\u884C\u7684\u52A8\u753B\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"reset",children:(0,s.jsx)(n.code,{children:"reset()"})}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",metastring:'title="React JSX"',children:"static reset()\n"})}),"\n",(0,s.jsx)(n.p,{children:"\u505C\u6B62\u6240\u6709\u6B63\u5728\u8FD0\u884C\u7684\u52A8\u753B\u5E76\u5C06\u5176\u503C\u91CD\u7F6E\u4E3A\u521D\u59CB\u503C\u3002"}),"\n",(0,s.jsx)(n.h2,{id:"\u5C5E\u6027",children:"\u5C5E\u6027"}),"\n",(0,s.jsx)(n.h3,{id:"value",children:(0,s.jsx)(n.code,{children:"Value"})}),"\n",(0,s.jsxs)(n.p,{children:["\u9A71\u52A8\u52A8\u753B\u8FD0\u884C\u7684\u4E00\u7EF4\u6807\u91CF\u503C\u3002\u4E00\u822C\u4F7F\u7528",(0,s.jsx)(n.code,{children:"new Animated.Value(0);"}),"\u6765\u521D\u59CB\u5316\u3002"]}),"\n",(0,s.jsxs)(n.p,{children:["\u60A8\u53EF\u4EE5\u5728\u5355\u72EC\u7684",(0,s.jsx)(n.a,{href:"animatedvalue",children:"\u9875\u9762"}),"\u4E0A\u9605\u8BFB\u6709\u5173",(0,s.jsx)(n.code,{children:"Animated.Value"})," API \u7684\u66F4\u591A\u4FE1\u606F\u3002"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"valuexy",children:(0,s.jsx)(n.code,{children:"ValueXY"})}),"\n",(0,s.jsx)(n.p,{children:"\u9A71\u52A8 2D \u52A8\u753B\u8FD0\u884C\u7684\u4E8C\u7EF4\u5411\u91CF\u503C\uFF0C\u6BD4\u5982\u7528\u5728\u624B\u52BF\u52A8\u753B\u4E2D\u3002"}),"\n",(0,s.jsxs)(n.p,{children:["\u60A8\u53EF\u4EE5\u5728\u5355\u72EC\u7684",(0,s.jsx)(n.a,{href:"animatedvaluexy",children:"\u9875\u9762"}),"\u4E0A\u9605\u8BFB\u6709\u5173",(0,s.jsx)(n.code,{children:"Animated.ValueXY"})," API \u7684\u66F4\u591A\u4FE1\u606F\u3002"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"interpolation",children:(0,s.jsx)(n.code,{children:"Interpolation"})}),"\n",(0,s.jsx)(n.p,{children:"\u6B64\u63D2\u503C\u7C7B\u578B\u4EC5\u5BFC\u51FA\u4EE5\u5728 Flow \u4E2D\u4F7F\u7528\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"node",children:(0,s.jsx)(n.code,{children:"Node"})}),"\n",(0,s.jsx)(n.p,{children:"\u4E3A\u4E86\u65B9\u4FBF\u7C7B\u578B\u68C0\u67E5\u800C\u5BFC\u51FA\u3002\u6240\u6709\u52A8\u753B\u503C\u90FD\u6E90\u81EA\u4E8E\u8FD9\u4E2A\u7C7B\u3002"}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"createanimatedcomponent",children:(0,s.jsx)(n.code,{children:"createAnimatedComponent"})}),"\n",(0,s.jsxs)(n.p,{children:["\u5C01\u88C5\u4EFB\u610F React \u7EC4\u4EF6\uFF0C\u4F7F\u5176\u53EF\u4EE5\u52A8\u753B\u5316\u3002",(0,s.jsx)(n.code,{children:"Animated.View"}),"\u7B49\u5185\u7F6E\u7EC4\u4EF6\u5C31\u662F\u901A\u8FC7\u8FD9\u4E00\u65B9\u6CD5\u5C01\u88C5\u7684\u3002"]}),"\n",(0,s.jsx)(n.hr,{}),"\n",(0,s.jsx)(n.h3,{id:"attachnativeevent",children:(0,s.jsx)(n.code,{children:"attachNativeEvent"})}),"\n",(0,s.jsxs)(n.p,{children:["\u5C06\u52A8\u753B\u503C\u9644\u52A0\u5230\u89C6\u56FE\u4E8B\u4EF6\u7684\u547D\u4EE4\u5F0F API\u3002\u5982\u679C\u53EF\u80FD\uFF0C\u8BF7\u4F18\u5148\u4F7F\u7528\u5E26\u6709",(0,s.jsx)(n.code,{children:"useNativeDriver: true"}),"\u7684",(0,s.jsx)(n.code,{children:"Animated.event"}),"\u3002"]})]})}function h(e={}){let{wrapper:n}={...(0,l.R)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(o,{...e})}):o(e)}},43023(e,n,i){i.d(n,{R:()=>c,x:()=>t});var d=i(63696);let s={},l=d.createContext(s);function c(e){let n=d.useContext(l);return d.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function t(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(s):e.components||s:c(e.components),d.createElement(l.Provider,{value:n},e.children)}}}]);

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.