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

Deploy website

Browse Source 
Deploy website version based on 1c210b2c68632eccc35bb5bdc632f80da3bc323e
This commit is contained in:
Website Deployment Script
2018-08-08 20:55:22 +00:00
parent 9a12e6f01c
commit 4683a4ae61
364 changed files with 10320 additions and 10320 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/scrollview.html
+53 -53
View File
@@ -32,67 +32,67 @@
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/docs/scrollview.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">ScrollView</h1></header><article><div><span><p>Component that wraps platform ScrollView while providing integration with touch locking &quot;responder&quot; system.</p>
<p>Keep in mind that ScrollViews must have a bounded height in order to work, since they contain unbounded-height children into a bounded container (via a scroll interaction). In order to bound the height of a ScrollView, either set the height of the view directly (discouraged) or make sure all parent views have bounded height. Forgetting to transfer <code>{flex: 1}</code> down the view stack can lead to errors here, which the element inspector makes easy to debug.</p>
<p>Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.</p>
<p><code>&lt;ScrollView&gt;</code> vs <a href="/react-native/docs/flatlist"><code>&lt;FlatList&gt;</code></a> - which one to use?</p>
<p><code>&lt;ScrollView&gt;</code> vs <a href="/react-native/docs/0.56/flatlist"><code>&lt;FlatList&gt;</code></a> - which one to use?</p>
<p><code>ScrollView</code> simply renders all its react child components at once. That makes it very easy to understand and use.</p>
<p>On the other hand, this has a performance downside. Imagine you have a very long list of items you want to display, maybe several screens worth of content. Creating JS components and native views for everything all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.</p>
<p>This is where <code>FlatList</code> comes into play. <code>FlatList</code> renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.</p>
<p><code>FlatList</code> is also handy if you want to render separators between your items, multiple columns, infinite scroll loading, or any number of other features it supports out of the box.</p>
<h3><a class="anchor" aria-hidden="true" id="props"></a><a href="#props" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Props</h3>
<ul>
<li><a href="/react-native/docs/view#props">View props...</a></li>
<li><a href="/react-native/docs/0.56/view#props">View props...</a></li>
</ul>
<ul>
<li><a href="/react-native/docs/scrollview#alwaysbouncevertical"><code>alwaysBounceVertical</code></a></li>
<li><a href="/react-native/docs/scrollview#contentcontainerstyle"><code>contentContainerStyle</code></a></li>
<li><a href="/react-native/docs/scrollview#keyboarddismissmode"><code>keyboardDismissMode</code></a></li>
<li><a href="/react-native/docs/scrollview#keyboardshouldpersisttaps"><code>keyboardShouldPersistTaps</code></a></li>
<li><a href="/react-native/docs/scrollview#oncontentsizechange"><code>onContentSizeChange</code></a></li>
<li><a href="/react-native/docs/scrollview#onmomentumscrollbegin"><code>onMomentumScrollBegin</code></a></li>
<li><a href="/react-native/docs/scrollview#onmomentumscrollend"><code>onMomentumScrollEnd</code></a></li>
<li><a href="/react-native/docs/scrollview#onscroll"><code>onScroll</code></a></li>
<li><a href="/react-native/docs/scrollview#onscrollbegindrag"><code>onScrollBeginDrag</code></a></li>
<li><a href="/react-native/docs/scrollview#onscrollenddrag"><code>onScrollEndDrag</code></a></li>
<li><a href="/react-native/docs/scrollview#pagingenabled"><code>pagingEnabled</code></a></li>
<li><a href="/react-native/docs/scrollview#refreshcontrol"><code>refreshControl</code></a></li>
<li><a href="/react-native/docs/scrollview#removeclippedsubviews"><code>removeClippedSubviews</code></a></li>
<li><a href="/react-native/docs/scrollview#scrollenabled"><code>scrollEnabled</code></a></li>
<li><a href="/react-native/docs/scrollview#showshorizontalscrollindicator"><code>showsHorizontalScrollIndicator</code></a></li>
<li><a href="/react-native/docs/scrollview#showsverticalscrollindicator"><code>showsVerticalScrollIndicator</code></a></li>
<li><a href="/react-native/docs/scrollview#stickyheaderindices"><code>stickyHeaderIndices</code></a></li>
<li><a href="/react-native/docs/scrollview#endfillcolor"><code>endFillColor</code></a></li>
<li><a href="/react-native/docs/scrollview#overscrollmode"><code>overScrollMode</code></a></li>
<li><a href="/react-native/docs/scrollview#scrollperftag"><code>scrollPerfTag</code></a></li>
<li><a href="/react-native/docs/scrollview#deprecated-sendupdatedchildframes"><code>DEPRECATED_sendUpdatedChildFrames</code></a></li>
<li><a href="/react-native/docs/scrollview#alwaysbouncehorizontal"><code>alwaysBounceHorizontal</code></a></li>
<li><a href="/react-native/docs/scrollview#horizontal"><code>horizontal</code></a></li>
<li><a href="/react-native/docs/scrollview#automaticallyadjustcontentinsets"><code>automaticallyAdjustContentInsets</code></a></li>
<li><a href="/react-native/docs/scrollview#bounces"><code>bounces</code></a></li>
<li><a href="/react-native/docs/scrollview#bounceszoom"><code>bouncesZoom</code></a></li>
<li><a href="/react-native/docs/scrollview#cancancelcontenttouches"><code>canCancelContentTouches</code></a></li>
<li><a href="/react-native/docs/scrollview#centercontent"><code>centerContent</code></a></li>
<li><a href="/react-native/docs/scrollview#contentinset"><code>contentInset</code></a></li>
<li><a href="/react-native/docs/scrollview#contentinsetadjustmentbehavior"><code>contentInsetAdjustmentBehavior</code></a></li>
<li><a href="/react-native/docs/scrollview#contentoffset"><code>contentOffset</code></a></li>
<li><a href="/react-native/docs/scrollview#decelerationrate"><code>decelerationRate</code></a></li>
<li><a href="/react-native/docs/scrollview#directionallockenabled"><code>directionalLockEnabled</code></a></li>
<li><a href="/react-native/docs/scrollview#indicatorstyle"><code>indicatorStyle</code></a></li>
<li><a href="/react-native/docs/scrollview#maximumzoomscale"><code>maximumZoomScale</code></a></li>
<li><a href="/react-native/docs/scrollview#minimumzoomscale"><code>minimumZoomScale</code></a></li>
<li><a href="/react-native/docs/scrollview#pinchgestureenabled"><code>pinchGestureEnabled</code></a></li>
<li><a href="/react-native/docs/scrollview#scrolleventthrottle"><code>scrollEventThrottle</code></a></li>
<li><a href="/react-native/docs/scrollview#scrollindicatorinsets"><code>scrollIndicatorInsets</code></a></li>
<li><a href="/react-native/docs/scrollview#scrollstotop"><code>scrollsToTop</code></a></li>
<li><a href="/react-native/docs/scrollview#snaptoalignment"><code>snapToAlignment</code></a></li>
<li><a href="/react-native/docs/scrollview#snaptointerval"><code>snapToInterval</code></a></li>
<li><a href="/react-native/docs/scrollview#zoomscale"><code>zoomScale</code></a></li>
<li><a href="/react-native/docs/scrollview#nestedscrollenabled"><code>nestedScrollEnabled</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#alwaysbouncevertical"><code>alwaysBounceVertical</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#contentcontainerstyle"><code>contentContainerStyle</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#keyboarddismissmode"><code>keyboardDismissMode</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#keyboardshouldpersisttaps"><code>keyboardShouldPersistTaps</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#oncontentsizechange"><code>onContentSizeChange</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#onmomentumscrollbegin"><code>onMomentumScrollBegin</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#onmomentumscrollend"><code>onMomentumScrollEnd</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#onscroll"><code>onScroll</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#onscrollbegindrag"><code>onScrollBeginDrag</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#onscrollenddrag"><code>onScrollEndDrag</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#pagingenabled"><code>pagingEnabled</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#refreshcontrol"><code>refreshControl</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#removeclippedsubviews"><code>removeClippedSubviews</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollenabled"><code>scrollEnabled</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#showshorizontalscrollindicator"><code>showsHorizontalScrollIndicator</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#showsverticalscrollindicator"><code>showsVerticalScrollIndicator</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#stickyheaderindices"><code>stickyHeaderIndices</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#endfillcolor"><code>endFillColor</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#overscrollmode"><code>overScrollMode</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollperftag"><code>scrollPerfTag</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#deprecated-sendupdatedchildframes"><code>DEPRECATED_sendUpdatedChildFrames</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#alwaysbouncehorizontal"><code>alwaysBounceHorizontal</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#horizontal"><code>horizontal</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#automaticallyadjustcontentinsets"><code>automaticallyAdjustContentInsets</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#bounces"><code>bounces</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#bounceszoom"><code>bouncesZoom</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#cancancelcontenttouches"><code>canCancelContentTouches</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#centercontent"><code>centerContent</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#contentinset"><code>contentInset</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#contentinsetadjustmentbehavior"><code>contentInsetAdjustmentBehavior</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#contentoffset"><code>contentOffset</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#decelerationrate"><code>decelerationRate</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#directionallockenabled"><code>directionalLockEnabled</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#indicatorstyle"><code>indicatorStyle</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#maximumzoomscale"><code>maximumZoomScale</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#minimumzoomscale"><code>minimumZoomScale</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#pinchgestureenabled"><code>pinchGestureEnabled</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrolleventthrottle"><code>scrollEventThrottle</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollindicatorinsets"><code>scrollIndicatorInsets</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollstotop"><code>scrollsToTop</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#snaptoalignment"><code>snapToAlignment</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#snaptointerval"><code>snapToInterval</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#zoomscale"><code>zoomScale</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#nestedscrollenabled"><code>nestedScrollEnabled</code></a></li>
</ul>
<h3><a class="anchor" aria-hidden="true" id="methods"></a><a href="#methods" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Methods</h3>
<ul>
<li><a href="/react-native/docs/scrollview#scrollto"><code>scrollTo</code></a></li>
<li><a href="/react-native/docs/scrollview#scrolltoend"><code>scrollToEnd</code></a></li>
<li><a href="/react-native/docs/scrollview#scrollwithoutanimationto"><code>scrollWithoutAnimationTo</code></a></li>
<li><a href="/react-native/docs/scrollview#flashscrollindicators"><code>flashScrollIndicators</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollto"><code>scrollTo</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrolltoend"><code>scrollToEnd</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#scrollwithoutanimationto"><code>scrollWithoutAnimationTo</code></a></li>
<li><a href="/react-native/docs/0.56/scrollview#flashscrollindicators"><code>flashScrollIndicators</code></a></li>
</ul>
<hr>
<h1><a class="anchor" aria-hidden="true" id="reference"></a><a href="#reference" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Reference</h1>
@@ -250,7 +250,7 @@ const styles = StyleSheet.create({
<hr>
<h3><a class="anchor" aria-hidden="true" id="refreshcontrol"></a><a href="#refreshcontrol" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>refreshControl</code></h3>
<p>A RefreshControl component, used to provide pull-to-refresh functionality for the ScrollView. Only works for vertical ScrollViews (<code>horizontal</code> prop must be <code>false</code>).</p>
<p>See <a href="/react-native/docs/refreshcontrol">RefreshControl</a>.</p>
<p>See <a href="/react-native/docs/0.56/refreshcontrol">RefreshControl</a>.</p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
@@ -323,7 +323,7 @@ const styles = StyleSheet.create({
<tr><th>Type</th><th>Required</th><th>Platform</th></tr>
</thead>
<tbody>
<tr><td><a href="/react-native/docs/colors">color</a></td><td>No</td><td>Android</td></tr>
<tr><td><a href="/react-native/docs/0.56/colors">color</a></td><td>No</td><td>Android</td></tr>
</tbody>
</table>
<hr>
@@ -664,6 +664,6 @@ const styles = StyleSheet.create({
apiKey: '2c98749b4a1e588efec53b2acec13025',
indexName: 'react-native-versions',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["tags:current"],"hitsPerPage":5}
algoliaOptions: {"facetFilters":["tags:0.56"],"hitsPerPage":5}
});
</script></body></html>