Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated docs for next

Browse Source
This commit is contained in:
Website Deployment Script
2016-10-16 13:01:12 +00:00
parent 1304eb780d
commit 772df790fc
2 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
releases/next/docs/animations.html
+4 -1
View File
@@ -85,7 +85,10 @@ back down to zero at 100 followed by a dead-zone that remains at 0 for
everything beyond that, you could do:</p><div class="prism language-javascript">value<span class="token punctuation">.</span><span class="token function">interpolate<span class="token punctuation">(</span></span><span class="token punctuation">{</span>
inputRange<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token operator">-</span><span class="token number">300</span><span class="token punctuation">,</span> <span class="token operator">-</span><span class="token number">100</span><span class="token punctuation">,</span> <span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">100</span><span class="token punctuation">,</span> <span class="token number">101</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
outputRange<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token number">300</span><span class="token punctuation">,</span> <span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>Which would map like so:</p><table><thead><tr><th>Input</th><th>Output</th></tr></thead><thead><tr><td> -400</td><td>450</td></tr><tr><td> -300</td><td>300</td></tr><tr><td> -200</td><td>150</td></tr><tr><td> -100</td><td>0</td></tr><tr><td> -50</td><td>0.5</td></tr><tr><td> 0</td><td>1</td></tr><tr><td> 50</td><td>0.5</td></tr><tr><td> 100</td><td>0</td></tr><tr><td> 101</td><td>0</td></tr><tr><td> 200</td><td>0</td></tr></thead></table><p><code>interpolation</code> also supports arbitrary easing functions, many of which are
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><p>Which would map like so:</p><table><thead><tr><th>Input</th><th>Output</th></tr></thead><thead><tr><td> -400</td><td>450</td></tr><tr><td> -300</td><td>300</td></tr><tr><td> -200</td><td>150</td></tr><tr><td> -100</td><td>0</td></tr><tr><td> -50</td><td>0.5</td></tr><tr><td> 0</td><td>1</td></tr><tr><td> 50</td><td>0.5</td></tr><tr><td> 100</td><td>0</td></tr><tr><td> 101</td><td>0</td></tr><tr><td> 200</td><td>0</td></tr></thead></table><p><code>interpolate</code> also supports mapping to strings, allowing you to animate colors as well as values with units. For example, if you wanted to animate a rotation you could do:</p><div class="prism language-javascript">value<span class="token punctuation">.</span><span class="token function">interpolate<span class="token punctuation">(</span></span><span class="token punctuation">{</span>
inputRange<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">360</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
outputRange<span class="token punctuation">:</span> <span class="token punctuation">[</span><span class="token string">&#x27;0deg&#x27;</span><span class="token punctuation">,</span> <span class="token string">&#x27;360deg&#x27;</span><span class="token punctuation">]</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span></div><p><code>interpolation</code> also supports arbitrary easing functions, many of which are
already implemented in the
<a href="https://github.com/facebook/react-native/blob/master/Libraries/Animation/Animated/Easing.js" target="_blank"><code>Easing</code></a>
class including quadratic, exponential, and bezier curves as well as functions
releases/next/docs/cameraroll.html
+1 -1
View File
@@ -19,7 +19,7 @@ const <span class="token punctuation">{</span>
TouchableOpacity
<span class="token punctuation">}</span> <span class="token operator">=</span> ReactNative<span class="token punctuation">;</span>
const invariant <span class="token operator">=</span> <span class="token function">require<span class="token punctuation">(</span></span><span class="token string">&#x27;invariant&#x27;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
const invariant <span class="token operator">=</span> <span class="token function">require<span class="token punctuation">(</span></span><span class="token string">&#x27;fbjs/lib/invariant&#x27;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
const CameraRollView <span class="token operator">=</span> <span class="token function">require<span class="token punctuation">(</span></span><span class="token string">&#x27;./CameraRollView&#x27;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>