From 07d5b50fbec5f1bc8124fc2414b48fccadfddbfe Mon Sep 17 00:00:00 2001 From: Website Deployment Script Date: Thu, 17 Oct 2019 10:37:12 +0000 Subject: [PATCH] Deploy website Deploy website version based on 7272773ea39342d883995387d12de60836b2e65c --- docs/0.30/drawerlayoutandroid.html | 2 +- docs/0.30/drawerlayoutandroid/index.html | 2 +- docs/0.30/layout-props.html | 4 ++-- docs/0.30/layout-props/index.html | 4 ++-- docs/0.30/modal.html | 4 ++-- docs/0.30/modal/index.html | 4 ++-- docs/0.30/scrollview.html | 6 +++--- docs/0.30/scrollview/index.html | 6 +++--- docs/0.30/textinput.html | 6 +++--- docs/0.30/textinput/index.html | 6 +++--- docs/0.31/drawerlayoutandroid.html | 2 +- docs/0.31/drawerlayoutandroid/index.html | 2 +- docs/0.31/layout-props.html | 4 ++-- docs/0.31/layout-props/index.html | 4 ++-- docs/0.31/modal.html | 4 ++-- docs/0.31/modal/index.html | 4 ++-- docs/0.31/scrollview.html | 6 +++--- docs/0.31/scrollview/index.html | 6 +++--- docs/0.32/drawerlayoutandroid.html | 2 +- docs/0.32/drawerlayoutandroid/index.html | 2 +- docs/0.32/modal.html | 4 ++-- docs/0.32/modal/index.html | 4 ++-- docs/0.33/drawerlayoutandroid.html | 2 +- docs/0.33/drawerlayoutandroid/index.html | 2 +- docs/0.33/modal.html | 4 ++-- docs/0.33/modal/index.html | 4 ++-- docs/0.34/drawerlayoutandroid.html | 2 +- docs/0.34/drawerlayoutandroid/index.html | 2 +- docs/0.35/drawerlayoutandroid.html | 2 +- docs/0.35/drawerlayoutandroid/index.html | 2 +- docs/0.36/drawerlayoutandroid.html | 2 +- docs/0.36/drawerlayoutandroid/index.html | 2 +- docs/0.37/drawerlayoutandroid.html | 2 +- docs/0.37/drawerlayoutandroid/index.html | 2 +- docs/0.37/layout-props.html | 4 ++-- docs/0.37/layout-props/index.html | 4 ++-- docs/0.37/modal.html | 4 ++-- docs/0.37/modal/index.html | 4 ++-- docs/0.37/navigatorios.html | 5 +++-- docs/0.37/navigatorios/index.html | 5 +++-- docs/0.37/panresponder.html | 6 +++--- docs/0.37/panresponder/index.html | 6 +++--- docs/0.37/scrollview.html | 6 +++--- docs/0.37/scrollview/index.html | 6 +++--- docs/0.37/textinput.html | 6 +++--- docs/0.37/textinput/index.html | 6 +++--- docs/0.38/drawerlayoutandroid.html | 2 +- docs/0.38/drawerlayoutandroid/index.html | 2 +- docs/0.38/layout-props.html | 4 ++-- docs/0.38/layout-props/index.html | 4 ++-- docs/0.38/navigatorios.html | 5 +++-- docs/0.38/navigatorios/index.html | 5 +++-- docs/0.38/panresponder.html | 6 +++--- docs/0.38/panresponder/index.html | 6 +++--- docs/0.38/scrollview.html | 6 +++--- docs/0.38/scrollview/index.html | 6 +++--- docs/0.39/drawerlayoutandroid.html | 2 +- docs/0.39/drawerlayoutandroid/index.html | 2 +- docs/0.39/layout-props.html | 4 ++-- docs/0.39/layout-props/index.html | 4 ++-- docs/0.39/navigatorios.html | 5 +++-- docs/0.39/navigatorios/index.html | 5 +++-- docs/0.39/panresponder.html | 6 +++--- docs/0.39/panresponder/index.html | 6 +++--- docs/0.39/scrollview.html | 6 +++--- docs/0.39/scrollview/index.html | 6 +++--- docs/0.40/drawerlayoutandroid.html | 2 +- docs/0.40/drawerlayoutandroid/index.html | 2 +- docs/0.40/navigatorios.html | 5 +++-- docs/0.40/navigatorios/index.html | 5 +++-- docs/0.41/drawerlayoutandroid.html | 2 +- docs/0.41/drawerlayoutandroid/index.html | 2 +- docs/0.41/navigatorios.html | 5 +++-- docs/0.41/navigatorios/index.html | 5 +++-- docs/0.42/drawerlayoutandroid.html | 2 +- docs/0.42/drawerlayoutandroid/index.html | 2 +- docs/0.43/drawerlayoutandroid.html | 2 +- docs/0.43/drawerlayoutandroid/index.html | 2 +- docs/0.44/animated.html | 10 +++++----- docs/0.44/animated/index.html | 10 +++++----- docs/0.44/drawerlayoutandroid.html | 2 +- docs/0.44/drawerlayoutandroid/index.html | 2 +- docs/0.44/flatlist.html | 8 ++++---- docs/0.44/flatlist/index.html | 8 ++++---- docs/0.44/listview.html | 4 ++-- docs/0.44/listview/index.html | 4 ++-- docs/0.44/listviewdatasource.html | 10 +++++----- docs/0.44/listviewdatasource/index.html | 10 +++++----- docs/0.44/modal.html | 4 ++-- docs/0.44/modal/index.html | 4 ++-- docs/0.44/navigatorios.html | 5 +++-- docs/0.44/navigatorios/index.html | 5 +++-- docs/0.44/scrollview.html | 9 +++++---- docs/0.44/scrollview/index.html | 9 +++++---- docs/0.44/sectionlist.html | 2 +- docs/0.44/sectionlist/index.html | 2 +- docs/0.44/textinput.html | 6 +++--- docs/0.44/textinput/index.html | 6 +++--- docs/0.44/view.html | 4 ++-- docs/0.44/view/index.html | 4 ++-- docs/0.45/animated.html | 10 +++++----- docs/0.45/animated/index.html | 10 +++++----- docs/0.45/drawerlayoutandroid.html | 2 +- docs/0.45/drawerlayoutandroid/index.html | 2 +- docs/0.45/listview.html | 4 ++-- docs/0.45/listview/index.html | 4 ++-- docs/0.45/listviewdatasource.html | 10 +++++----- docs/0.45/listviewdatasource/index.html | 10 +++++----- docs/0.45/modal.html | 4 ++-- docs/0.45/modal/index.html | 4 ++-- docs/0.46/drawerlayoutandroid.html | 2 +- docs/0.46/drawerlayoutandroid/index.html | 2 +- docs/0.46/listviewdatasource.html | 10 +++++----- docs/0.46/listviewdatasource/index.html | 10 +++++----- docs/0.46/modal.html | 4 ++-- docs/0.46/modal/index.html | 4 ++-- docs/0.47/drawerlayoutandroid.html | 2 +- docs/0.47/drawerlayoutandroid/index.html | 2 +- docs/0.47/flatlist.html | 8 ++++---- docs/0.47/flatlist/index.html | 8 ++++---- docs/0.47/layout-props.html | 4 ++-- docs/0.47/layout-props/index.html | 4 ++-- docs/0.47/listviewdatasource.html | 10 +++++----- docs/0.47/listviewdatasource/index.html | 10 +++++----- docs/0.47/modal.html | 4 ++-- docs/0.47/modal/index.html | 4 ++-- docs/0.47/scrollview.html | 9 +++++---- docs/0.47/scrollview/index.html | 9 +++++---- docs/0.47/sectionlist.html | 2 +- docs/0.47/sectionlist/index.html | 2 +- docs/0.47/view.html | 4 ++-- docs/0.47/view/index.html | 4 ++-- docs/0.48/drawerlayoutandroid.html | 2 +- docs/0.48/drawerlayoutandroid/index.html | 2 +- docs/0.49/drawerlayoutandroid.html | 2 +- docs/0.49/drawerlayoutandroid/index.html | 2 +- docs/0.50/drawerlayoutandroid.html | 2 +- docs/0.50/drawerlayoutandroid/index.html | 2 +- docs/0.51/animated.html | 16 ++++++++-------- docs/0.51/animated/index.html | 16 ++++++++-------- docs/0.51/drawerlayoutandroid.html | 2 +- docs/0.51/drawerlayoutandroid/index.html | 2 +- docs/0.51/easing.html | 14 +++++++------- docs/0.51/easing/index.html | 14 +++++++------- docs/0.51/flatlist.html | 4 ++-- docs/0.51/flatlist/index.html | 4 ++-- docs/0.51/layout-props.html | 4 ++-- docs/0.51/layout-props/index.html | 4 ++-- docs/0.51/scrollview.html | 9 +++++---- docs/0.51/scrollview/index.html | 9 +++++---- docs/0.51/sectionlist.html | 2 +- docs/0.51/sectionlist/index.html | 2 +- docs/0.51/text.html | 4 ++-- docs/0.51/text/index.html | 4 ++-- docs/0.51/textinput.html | 6 +++--- docs/0.51/textinput/index.html | 6 +++--- docs/0.52/drawerlayoutandroid.html | 2 +- docs/0.52/drawerlayoutandroid/index.html | 2 +- docs/0.52/easing.html | 14 +++++++------- docs/0.52/easing/index.html | 14 +++++++------- docs/0.52/scrollview.html | 9 +++++---- docs/0.52/scrollview/index.html | 9 +++++---- docs/0.52/text.html | 4 ++-- docs/0.52/text/index.html | 4 ++-- docs/0.52/textinput.html | 6 +++--- docs/0.52/textinput/index.html | 6 +++--- docs/0.53/drawerlayoutandroid.html | 2 +- docs/0.53/drawerlayoutandroid/index.html | 2 +- docs/0.53/easing.html | 14 +++++++------- docs/0.53/easing/index.html | 14 +++++++------- docs/0.53/text.html | 4 ++-- docs/0.53/text/index.html | 4 ++-- docs/0.54/drawerlayoutandroid.html | 2 +- docs/0.54/drawerlayoutandroid/index.html | 2 +- docs/0.54/easing.html | 14 +++++++------- docs/0.54/easing/index.html | 14 +++++++------- docs/0.54/text.html | 4 ++-- docs/0.54/text/index.html | 4 ++-- docs/0.55/drawerlayoutandroid.html | 2 +- docs/0.55/drawerlayoutandroid/index.html | 2 +- docs/0.56/animated.html | 19 ++++++++++--------- docs/0.56/animated/index.html | 19 ++++++++++--------- docs/0.56/asyncstorage.html | 6 +++--- docs/0.56/asyncstorage/index.html | 6 +++--- docs/0.56/drawerlayoutandroid.html | 2 +- docs/0.56/drawerlayoutandroid/index.html | 2 +- docs/0.56/flatlist.html | 8 ++++---- docs/0.56/flatlist/index.html | 8 ++++---- docs/0.56/inputaccessoryview.html | 2 +- docs/0.56/inputaccessoryview/index.html | 2 +- docs/0.56/layout-props.html | 4 ++-- docs/0.56/layout-props/index.html | 4 ++-- docs/0.56/navigatorios.html | 8 +++++--- docs/0.56/navigatorios/index.html | 8 +++++--- docs/0.56/panresponder.html | 6 +++--- docs/0.56/panresponder/index.html | 6 +++--- docs/0.56/scrollview.html | 7 ++++--- docs/0.56/scrollview/index.html | 7 ++++--- docs/0.56/sectionlist.html | 2 +- docs/0.56/sectionlist/index.html | 2 +- docs/0.56/text.html | 4 ++-- docs/0.56/text/index.html | 4 ++-- docs/0.56/textinput.html | 6 +++--- docs/0.56/textinput/index.html | 6 +++--- docs/0.56/vibration.html | 2 +- docs/0.56/vibration/index.html | 2 +- docs/0.56/webview.html | 1 + docs/0.56/webview/index.html | 1 + docs/0.57/asyncstorage.html | 6 +++--- docs/0.57/asyncstorage/index.html | 6 +++--- docs/0.57/drawerlayoutandroid.html | 2 +- docs/0.57/drawerlayoutandroid/index.html | 2 +- docs/0.57/flatlist.html | 8 ++++---- docs/0.57/flatlist/index.html | 8 ++++---- docs/0.57/inputaccessoryview.html | 2 +- docs/0.57/inputaccessoryview/index.html | 2 +- docs/0.57/panresponder.html | 6 +++--- docs/0.57/panresponder/index.html | 6 +++--- docs/0.57/scrollview.html | 7 ++++--- docs/0.57/scrollview/index.html | 7 ++++--- docs/0.57/sectionlist.html | 2 +- docs/0.57/sectionlist/index.html | 2 +- docs/0.57/vibration.html | 2 +- docs/0.57/vibration/index.html | 2 +- 224 files changed, 578 insertions(+), 546 deletions(-) diff --git a/docs/0.30/drawerlayoutandroid.html b/docs/0.30/drawerlayoutandroid.html index 33fce5ae4ae..0baef989d80 100644 --- a/docs/0.30/drawerlayoutandroid.html +++ b/docs/0.30/drawerlayoutandroid.html @@ -126,7 +126,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.30/drawerlayoutandroid/index.html b/docs/0.30/drawerlayoutandroid/index.html
index 33fce5ae4ae..0baef989d80 100644
--- a/docs/0.30/drawerlayoutandroid/index.html
+++ b/docs/0.30/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.30/layout-props.html b/docs/0.30/layout-props.html
index dc66dd0ebae..cc98b171866 100644
--- a/docs/0.30/layout-props.html
+++ b/docs/0.30/layout-props.html
@@ -480,9 +480,9 @@
 
 

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.30/layout-props/index.html b/docs/0.30/layout-props/index.html index dc66dd0ebae..cc98b171866 100644 --- a/docs/0.30/layout-props/index.html +++ b/docs/0.30/layout-props/index.html @@ -480,9 +480,9 @@

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.30/modal.html b/docs/0.30/modal.html index 8a805ab3eb5..d084eaae954 100644 --- a/docs/0.30/modal.html +++ b/docs/0.30/modal.html @@ -1,4 +1,4 @@ -Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.30/modal/index.html b/docs/0.30/modal/index.html
index 8a805ab3eb5..d084eaae954 100644
--- a/docs/0.30/modal/index.html
+++ b/docs/0.30/modal/index.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.30/scrollview.html b/docs/0.30/scrollview.html
index 9565797cd75..3d831b84eda 100644
--- a/docs/0.30/scrollview.html
+++ b/docs/0.30/scrollview.html
@@ -69,7 +69,7 @@
               }
             });
         
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector can help to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -451,8 +451,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is black. This style is good against a light content background.
    • +
    • white, scroll indicator is white. This style is good against a dark content background.
diff --git a/docs/0.30/scrollview/index.html b/docs/0.30/scrollview/index.html index 9565797cd75..3d831b84eda 100644 --- a/docs/0.30/scrollview/index.html +++ b/docs/0.30/scrollview/index.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector can help to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -451,8 +451,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is black. This style is good against a light content background.
    • +
    • white, scroll indicator is white. This style is good against a dark content background.
diff --git a/docs/0.30/textinput.html b/docs/0.30/textinput.html index 8051092ca84..0fde49a4cce 100644 --- a/docs/0.30/textinput.html +++ b/docs/0.30/textinput.html @@ -69,7 +69,7 @@ } });
Edit

TextInput

A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

-

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

+

A nice use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. For example:


defaultValue

-

Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

+

Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

@@ -523,7 +523,7 @@ AppRegistry.registerComponent(
TypeRequired

value

-

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

+

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to set the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

diff --git a/docs/0.30/textinput/index.html b/docs/0.30/textinput/index.html index 8051092ca84..0fde49a4cce 100644 --- a/docs/0.30/textinput/index.html +++ b/docs/0.30/textinput/index.html @@ -69,7 +69,7 @@ } });
Edit

TextInput

A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

-

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

+

A nice use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. For example:

TypeRequired

defaultValue

-

Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

+

Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

@@ -523,7 +523,7 @@ AppRegistry.registerComponent(
TypeRequired

value

-

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

+

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to set the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

diff --git a/docs/0.31/drawerlayoutandroid.html b/docs/0.31/drawerlayoutandroid.html index 7ae2e0a8e3e..c43f32ed78d 100644 --- a/docs/0.31/drawerlayoutandroid.html +++ b/docs/0.31/drawerlayoutandroid.html @@ -126,7 +126,7 @@
TypeRequired

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.31/drawerlayoutandroid/index.html b/docs/0.31/drawerlayoutandroid/index.html
index 7ae2e0a8e3e..c43f32ed78d 100644
--- a/docs/0.31/drawerlayoutandroid/index.html
+++ b/docs/0.31/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.31/layout-props.html b/docs/0.31/layout-props.html
index b0eadbcca5c..d36c44eb003 100644
--- a/docs/0.31/layout-props.html
+++ b/docs/0.31/layout-props.html
@@ -480,9 +480,9 @@
 
 

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.31/layout-props/index.html b/docs/0.31/layout-props/index.html index b0eadbcca5c..d36c44eb003 100644 --- a/docs/0.31/layout-props/index.html +++ b/docs/0.31/layout-props/index.html @@ -480,9 +480,9 @@

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.31/modal.html b/docs/0.31/modal.html index dc9f4c434e6..0756270067b 100644 --- a/docs/0.31/modal.html +++ b/docs/0.31/modal.html @@ -1,4 +1,4 @@ -Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.31/modal/index.html b/docs/0.31/modal/index.html
index dc9f4c434e6..0756270067b 100644
--- a/docs/0.31/modal/index.html
+++ b/docs/0.31/modal/index.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.31/scrollview.html b/docs/0.31/scrollview.html
index 3e1619f5b74..fb1000b55bb 100644
--- a/docs/0.31/scrollview.html
+++ b/docs/0.31/scrollview.html
@@ -69,7 +69,7 @@
               }
             });
         
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector can help to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -451,8 +451,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is black. This style is good against a light content background.
    • +
    • white, scroll indicator is white. This style is good against a dark content background.
diff --git a/docs/0.31/scrollview/index.html b/docs/0.31/scrollview/index.html index 3e1619f5b74..fb1000b55bb 100644 --- a/docs/0.31/scrollview/index.html +++ b/docs/0.31/scrollview/index.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector can help to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -451,8 +451,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is black. This style is good against a light content background.
    • +
    • white, scroll indicator is white. This style is good against a dark content background.
diff --git a/docs/0.32/drawerlayoutandroid.html b/docs/0.32/drawerlayoutandroid.html index ad3dd4b4403..8887f20eb7d 100644 --- a/docs/0.32/drawerlayoutandroid.html +++ b/docs/0.32/drawerlayoutandroid.html @@ -126,7 +126,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.32/drawerlayoutandroid/index.html b/docs/0.32/drawerlayoutandroid/index.html
index ad3dd4b4403..8887f20eb7d 100644
--- a/docs/0.32/drawerlayoutandroid/index.html
+++ b/docs/0.32/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.32/modal.html b/docs/0.32/modal.html
index b98ae2c2ca9..5f4ce810530 100644
--- a/docs/0.32/modal.html
+++ b/docs/0.32/modal.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.32/modal/index.html b/docs/0.32/modal/index.html
index b98ae2c2ca9..5f4ce810530 100644
--- a/docs/0.32/modal/index.html
+++ b/docs/0.32/modal/index.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.33/drawerlayoutandroid.html b/docs/0.33/drawerlayoutandroid.html
index d76d3398092..424505c7bd6 100644
--- a/docs/0.33/drawerlayoutandroid.html
+++ b/docs/0.33/drawerlayoutandroid.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.33/drawerlayoutandroid/index.html b/docs/0.33/drawerlayoutandroid/index.html
index d76d3398092..424505c7bd6 100644
--- a/docs/0.33/drawerlayoutandroid/index.html
+++ b/docs/0.33/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.33/modal.html b/docs/0.33/modal.html
index 3643410e9ea..828999e7c33 100644
--- a/docs/0.33/modal.html
+++ b/docs/0.33/modal.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.33/modal/index.html b/docs/0.33/modal/index.html
index 3643410e9ea..828999e7c33 100644
--- a/docs/0.33/modal/index.html
+++ b/docs/0.33/modal/index.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator. Go here to compare navigation options.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.34/drawerlayoutandroid.html b/docs/0.34/drawerlayoutandroid.html
index 40711bb5857..31e2c22ebd2 100644
--- a/docs/0.34/drawerlayoutandroid.html
+++ b/docs/0.34/drawerlayoutandroid.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.34/drawerlayoutandroid/index.html b/docs/0.34/drawerlayoutandroid/index.html
index 40711bb5857..31e2c22ebd2 100644
--- a/docs/0.34/drawerlayoutandroid/index.html
+++ b/docs/0.34/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.35/drawerlayoutandroid.html b/docs/0.35/drawerlayoutandroid.html
index ee4a60aed64..759ea07a52c 100644
--- a/docs/0.35/drawerlayoutandroid.html
+++ b/docs/0.35/drawerlayoutandroid.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.35/drawerlayoutandroid/index.html b/docs/0.35/drawerlayoutandroid/index.html
index ee4a60aed64..759ea07a52c 100644
--- a/docs/0.35/drawerlayoutandroid/index.html
+++ b/docs/0.35/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.36/drawerlayoutandroid.html b/docs/0.36/drawerlayoutandroid.html
index 3e11efd45ba..9c862c83e68 100644
--- a/docs/0.36/drawerlayoutandroid.html
+++ b/docs/0.36/drawerlayoutandroid.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.36/drawerlayoutandroid/index.html b/docs/0.36/drawerlayoutandroid/index.html
index 3e11efd45ba..9c862c83e68 100644
--- a/docs/0.36/drawerlayoutandroid/index.html
+++ b/docs/0.36/drawerlayoutandroid/index.html
@@ -126,7 +126,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.37/drawerlayoutandroid.html b/docs/0.37/drawerlayoutandroid.html
index f73a8b948e3..df96b694bec 100644
--- a/docs/0.37/drawerlayoutandroid.html
+++ b/docs/0.37/drawerlayoutandroid.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.37/drawerlayoutandroid/index.html b/docs/0.37/drawerlayoutandroid/index.html
index f73a8b948e3..df96b694bec 100644
--- a/docs/0.37/drawerlayoutandroid/index.html
+++ b/docs/0.37/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.37/layout-props.html b/docs/0.37/layout-props.html
index 7fe4a3aa74d..afd02676307 100644
--- a/docs/0.37/layout-props.html
+++ b/docs/0.37/layout-props.html
@@ -526,9 +526,9 @@
 
 

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.37/layout-props/index.html b/docs/0.37/layout-props/index.html index 7fe4a3aa74d..afd02676307 100644 --- a/docs/0.37/layout-props/index.html +++ b/docs/0.37/layout-props/index.html @@ -526,9 +526,9 @@

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.37/modal.html b/docs/0.37/modal.html index be5956bed08..42df1b9b292 100644 --- a/docs/0.37/modal.html +++ b/docs/0.37/modal.html @@ -1,4 +1,4 @@ -Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.37/modal/index.html b/docs/0.37/modal/index.html
index be5956bed08..42df1b9b292 100644
--- a/docs/0.37/modal/index.html
+++ b/docs/0.37/modal/index.html
@@ -1,4 +1,4 @@
-Modal · React Native
Edit

Modal

The Modal component is a simple way to present content above an enclosing view.

+
Edit

Modal

The Modal component is a way to present content above an enclosing view.

Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

import React, {Component} from 'react';
 import {Modal, Text, TouchableHighlight, View} from 'react-native';
diff --git a/docs/0.37/navigatorios.html b/docs/0.37/navigatorios.html
index f02709c4a10..26200853c07 100644
--- a/docs/0.37/navigatorios.html
+++ b/docs/0.37/navigatorios.html
@@ -248,6 +248,7 @@ render() {
 

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.37/navigatorios/index.html b/docs/0.37/navigatorios/index.html index f02709c4a10..26200853c07 100644 --- a/docs/0.37/navigatorios/index.html +++ b/docs/0.37/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.37/panresponder.html b/docs/0.37/panresponder.html index 64c3f1fd2b7..555f7c058d6 100644 --- a/docs/0.37/panresponder.html +++ b/docs/0.37/panresponder.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.37/panresponder/index.html b/docs/0.37/panresponder/index.html index 64c3f1fd2b7..555f7c058d6 100644 --- a/docs/0.37/panresponder/index.html +++ b/docs/0.37/panresponder/index.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.37/scrollview.html b/docs/0.37/scrollview.html index 882256fd6fc..891b131dbfd 100644 --- a/docs/0.37/scrollview.html +++ b/docs/0.37/scrollview.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.37/scrollview/index.html b/docs/0.37/scrollview/index.html index 882256fd6fc..891b131dbfd 100644 --- a/docs/0.37/scrollview/index.html +++ b/docs/0.37/scrollview/index.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.37/textinput.html b/docs/0.37/textinput.html index 3b55ca08c72..c1b3de647a7 100644 --- a/docs/0.37/textinput.html +++ b/docs/0.37/textinput.html @@ -69,7 +69,7 @@ } });
Edit

TextInput

A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

-

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

+

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. An example:


defaultValue

-

Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

+

Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

@@ -549,7 +549,7 @@ AppRegistry.registerComponent(
TypeRequired

value

-

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

+

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

diff --git a/docs/0.37/textinput/index.html b/docs/0.37/textinput/index.html index 3b55ca08c72..c1b3de647a7 100644 --- a/docs/0.37/textinput/index.html +++ b/docs/0.37/textinput/index.html @@ -69,7 +69,7 @@ } });
Edit

TextInput

A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

-

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

+

The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. An example:

TypeRequired

defaultValue

-

Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

+

Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

@@ -549,7 +549,7 @@ AppRegistry.registerComponent(
TypeRequired

value

-

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

+

The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

diff --git a/docs/0.38/drawerlayoutandroid.html b/docs/0.38/drawerlayoutandroid.html index 6d5af98bf6e..88261196abe 100644 --- a/docs/0.38/drawerlayoutandroid.html +++ b/docs/0.38/drawerlayoutandroid.html @@ -228,7 +228,7 @@
TypeRequired

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.38/drawerlayoutandroid/index.html b/docs/0.38/drawerlayoutandroid/index.html
index 6d5af98bf6e..88261196abe 100644
--- a/docs/0.38/drawerlayoutandroid/index.html
+++ b/docs/0.38/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.38/layout-props.html b/docs/0.38/layout-props.html
index 07799eb3b80..31109bbba72 100644
--- a/docs/0.38/layout-props.html
+++ b/docs/0.38/layout-props.html
@@ -526,9 +526,9 @@
 
 

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.38/layout-props/index.html b/docs/0.38/layout-props/index.html index 07799eb3b80..31109bbba72 100644 --- a/docs/0.38/layout-props/index.html +++ b/docs/0.38/layout-props/index.html @@ -526,9 +526,9 @@

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.38/navigatorios.html b/docs/0.38/navigatorios.html index 7abdcd568c5..befe51b2fb2 100644 --- a/docs/0.38/navigatorios.html +++ b/docs/0.38/navigatorios.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.38/navigatorios/index.html b/docs/0.38/navigatorios/index.html index 7abdcd568c5..befe51b2fb2 100644 --- a/docs/0.38/navigatorios/index.html +++ b/docs/0.38/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.38/panresponder.html b/docs/0.38/panresponder.html index 61a9f34c21c..cecdb0aebe4 100644 --- a/docs/0.38/panresponder.html +++ b/docs/0.38/panresponder.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.38/panresponder/index.html b/docs/0.38/panresponder/index.html index 61a9f34c21c..cecdb0aebe4 100644 --- a/docs/0.38/panresponder/index.html +++ b/docs/0.38/panresponder/index.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.38/scrollview.html b/docs/0.38/scrollview.html index 6a3b18634be..c3762505f77 100644 --- a/docs/0.38/scrollview.html +++ b/docs/0.38/scrollview.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.38/scrollview/index.html b/docs/0.38/scrollview/index.html index 6a3b18634be..c3762505f77 100644 --- a/docs/0.38/scrollview/index.html +++ b/docs/0.38/scrollview/index.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.39/drawerlayoutandroid.html b/docs/0.39/drawerlayoutandroid.html index b5e1513e273..8023fa990a0 100644 --- a/docs/0.39/drawerlayoutandroid.html +++ b/docs/0.39/drawerlayoutandroid.html @@ -228,7 +228,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.39/drawerlayoutandroid/index.html b/docs/0.39/drawerlayoutandroid/index.html
index b5e1513e273..8023fa990a0 100644
--- a/docs/0.39/drawerlayoutandroid/index.html
+++ b/docs/0.39/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.39/layout-props.html b/docs/0.39/layout-props.html
index 6c0b6b43080..dfab9fd34c4 100644
--- a/docs/0.39/layout-props.html
+++ b/docs/0.39/layout-props.html
@@ -526,9 +526,9 @@
 
 

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.39/layout-props/index.html b/docs/0.39/layout-props/index.html index 6c0b6b43080..dfab9fd34c4 100644 --- a/docs/0.39/layout-props/index.html +++ b/docs/0.39/layout-props/index.html @@ -526,9 +526,9 @@

position

-

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

+

position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

-

If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

+

If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

See https://github.com/facebook/css-layout for more details on how position differs between React Native and CSS.

diff --git a/docs/0.39/navigatorios.html b/docs/0.39/navigatorios.html index 0a9a520faad..6d7a46fa90b 100644 --- a/docs/0.39/navigatorios.html +++ b/docs/0.39/navigatorios.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.39/navigatorios/index.html b/docs/0.39/navigatorios/index.html index 0a9a520faad..6d7a46fa90b 100644 --- a/docs/0.39/navigatorios/index.html +++ b/docs/0.39/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.39/panresponder.html b/docs/0.39/panresponder.html index c79b32a950f..9abfc4d1e75 100644 --- a/docs/0.39/panresponder.html +++ b/docs/0.39/panresponder.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.39/panresponder/index.html b/docs/0.39/panresponder/index.html index c79b32a950f..9abfc4d1e75 100644 --- a/docs/0.39/panresponder/index.html +++ b/docs/0.39/panresponder/index.html @@ -1,4 +1,4 @@ -PanResponder · React Native
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

+
Edit

PanResponder

PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize multi-touch gestures.

By default, PanResponder holds an `InteractionManager handle to block long-running JS events from interrupting active gestures.

It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

onPanResponderMove: (event, gestureState) => {}
@@ -157,7 +157,7 @@
 

create()

static create(config)
 
-

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

+

@param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

  • onMoveShouldSetPanResponder: (e, gestureState) => {...}
  • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
  • diff --git a/docs/0.39/scrollview.html b/docs/0.39/scrollview.html index 1a3d8098169..9f8ce82306d 100644 --- a/docs/0.39/scrollview.html +++ b/docs/0.39/scrollview.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.39/scrollview/index.html b/docs/0.39/scrollview/index.html index 1a3d8098169..9f8ce82306d 100644 --- a/docs/0.39/scrollview/index.html +++ b/docs/0.39/scrollview/index.html @@ -69,7 +69,7 @@ } });
Edit

ScrollView

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

-

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

+

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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes painless to debug.

Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

Props

    @@ -450,8 +450,8 @@

    The style of the scroll indicators.

    • default (the default), same as black.
    • -
    • black, scroll indicator is black. This style is good against a white content background.
    • -
    • white, scroll indicator is white. This style is good against a black content background.
    • +
    • black, scroll indicator is dark. This style is good against a light content background.
    • +
    • white, scroll indicator is light. This style is good against a dark content background.
diff --git a/docs/0.40/drawerlayoutandroid.html b/docs/0.40/drawerlayoutandroid.html index 7948e7e31a0..7d47e39452c 100644 --- a/docs/0.40/drawerlayoutandroid.html +++ b/docs/0.40/drawerlayoutandroid.html @@ -228,7 +228,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.40/drawerlayoutandroid/index.html b/docs/0.40/drawerlayoutandroid/index.html
index 7948e7e31a0..7d47e39452c 100644
--- a/docs/0.40/drawerlayoutandroid/index.html
+++ b/docs/0.40/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.40/navigatorios.html b/docs/0.40/navigatorios.html
index b36b5ae37d5..0c1c7ff1fc6 100644
--- a/docs/0.40/navigatorios.html
+++ b/docs/0.40/navigatorios.html
@@ -248,6 +248,7 @@ render() {
 
 

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.40/navigatorios/index.html b/docs/0.40/navigatorios/index.html index b36b5ae37d5..0c1c7ff1fc6 100644 --- a/docs/0.40/navigatorios/index.html +++ b/docs/0.40/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.41/drawerlayoutandroid.html b/docs/0.41/drawerlayoutandroid.html index 96824d67bf9..6d17e1415f1 100644 --- a/docs/0.41/drawerlayoutandroid.html +++ b/docs/0.41/drawerlayoutandroid.html @@ -228,7 +228,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.41/drawerlayoutandroid/index.html b/docs/0.41/drawerlayoutandroid/index.html
index 96824d67bf9..6d17e1415f1 100644
--- a/docs/0.41/drawerlayoutandroid/index.html
+++ b/docs/0.41/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.41/navigatorios.html b/docs/0.41/navigatorios.html
index 3220901a85a..f14a2d42ccf 100644
--- a/docs/0.41/navigatorios.html
+++ b/docs/0.41/navigatorios.html
@@ -248,6 +248,7 @@ render() {
 
 

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.41/navigatorios/index.html b/docs/0.41/navigatorios/index.html index 3220901a85a..f14a2d42ccf 100644 --- a/docs/0.41/navigatorios/index.html +++ b/docs/0.41/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

interactivePopGestureEnabled

+

Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

@@ -356,7 +357,7 @@ render() {

pop()

pop();
 
-

Pop back to the previous scene.

+

Move back to the previous scene.


replaceAtIndex()

replaceAtIndex((route: object), (index: number));
@@ -437,7 +438,7 @@ render() {
 

resetTo()

resetTo((route: object));
 
-

Replaces the top item and pop to it.

+

Replaces the top item and move to it.

Parameters:

diff --git a/docs/0.42/drawerlayoutandroid.html b/docs/0.42/drawerlayoutandroid.html index e1dee4b7f51..92c8914ad68 100644 --- a/docs/0.42/drawerlayoutandroid.html +++ b/docs/0.42/drawerlayoutandroid.html @@ -228,7 +228,7 @@

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.42/drawerlayoutandroid/index.html b/docs/0.42/drawerlayoutandroid/index.html
index e1dee4b7f51..92c8914ad68 100644
--- a/docs/0.42/drawerlayoutandroid/index.html
+++ b/docs/0.42/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.43/drawerlayoutandroid.html b/docs/0.43/drawerlayoutandroid.html
index 2798f551b9e..d2943c94b74 100644
--- a/docs/0.43/drawerlayoutandroid.html
+++ b/docs/0.43/drawerlayoutandroid.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.43/drawerlayoutandroid/index.html b/docs/0.43/drawerlayoutandroid/index.html
index 2798f551b9e..d2943c94b74 100644
--- a/docs/0.43/drawerlayoutandroid/index.html
+++ b/docs/0.43/drawerlayoutandroid/index.html
@@ -228,7 +228,7 @@
 
 

drawerBackgroundColor

-

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

+

Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

return (
   <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
   </DrawerLayoutAndroid>
diff --git a/docs/0.44/animated.html b/docs/0.44/animated.html
index 046fb48a94f..6f8c379b8cc 100644
--- a/docs/0.44/animated.html
+++ b/docs/0.44/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
Edit

Animated

The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

+
Edit

Animated

The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

The simplest workflow for creating an animation is to to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

Animated.timing(
   // Animate value over time
@@ -90,7 +90,7 @@
 

Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

@@ -100,7 +100,7 @@

By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

Animatable components

-

Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

+

Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

@@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    diff --git a/docs/0.44/animated/index.html b/docs/0.44/animated/index.html index 046fb48a94f..6f8c379b8cc 100644 --- a/docs/0.44/animated/index.html +++ b/docs/0.44/animated/index.html @@ -1,4 +1,4 @@ -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    The simplest workflow for creating an animation is to to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    diff --git a/docs/0.44/drawerlayoutandroid.html b/docs/0.44/drawerlayoutandroid.html index 6e8d36e4e4e..151e0543c3f 100644 --- a/docs/0.44/drawerlayoutandroid.html +++ b/docs/0.44/drawerlayoutandroid.html @@ -228,7 +228,7 @@

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.44/drawerlayoutandroid/index.html b/docs/0.44/drawerlayoutandroid/index.html
    index 6e8d36e4e4e..151e0543c3f 100644
    --- a/docs/0.44/drawerlayoutandroid/index.html
    +++ b/docs/0.44/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.44/flatlist.html b/docs/0.44/flatlist.html
    index 3e614f88e34..dfaa4f76f43 100644
    --- a/docs/0.44/flatlist.html
    +++ b/docs/0.44/flatlist.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -198,7 +198,7 @@ class MyList extends React.PureComponent {

      data

      -

      For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      +

      For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      @@ -282,7 +282,7 @@ class MyList extends React.PureComponent {
      TypeRequired

      getItemLayout

      -

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is the most efficient, and is easy to use if you have fixed height items, for example:

      +

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is efficient if you have fixed sized items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
      diff --git a/docs/0.44/flatlist/index.html b/docs/0.44/flatlist/index.html
      index 3e614f88e34..dfaa4f76f43 100644
      --- a/docs/0.44/flatlist/index.html
      +++ b/docs/0.44/flatlist/index.html
      @@ -1,4 +1,4 @@
      -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -198,7 +198,7 @@ class MyList extends React.PureComponent {

      data

      -

      For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      +

      For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      @@ -282,7 +282,7 @@ class MyList extends React.PureComponent {
      TypeRequired

      getItemLayout

      -

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is the most efficient, and is easy to use if you have fixed height items, for example:

      +

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is efficient if you have fixed sized items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
      diff --git a/docs/0.44/listview.html b/docs/0.44/listview.html
      index 2d8d665afb7..b2ed0a5b131 100644
      --- a/docs/0.44/listview.html
      +++ b/docs/0.44/listview.html
      @@ -1,4 +1,4 @@
      -ListView · React Native
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with a simple array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    +
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with an array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    Minimal example:

    class MyComponent extends Component {
       constructor() {
    diff --git a/docs/0.44/listview/index.html b/docs/0.44/listview/index.html
    index 2d8d665afb7..b2ed0a5b131 100644
    --- a/docs/0.44/listview/index.html
    +++ b/docs/0.44/listview/index.html
    @@ -1,4 +1,4 @@
    -ListView · React Native
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with a simple array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    +
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with an array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    Minimal example:

    class MyComponent extends Component {
       constructor() {
    diff --git a/docs/0.44/listviewdatasource.html b/docs/0.44/listviewdatasource.html
    index ca57186140c..41b3d7fdfc7 100644
    --- a/docs/0.44/listviewdatasource.html
    +++ b/docs/0.44/listviewdatasource.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.44/listviewdatasource/index.html b/docs/0.44/listviewdatasource/index.html
    index ca57186140c..41b3d7fdfc7 100644
    --- a/docs/0.44/listviewdatasource/index.html
    +++ b/docs/0.44/listviewdatasource/index.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.44/modal.html b/docs/0.44/modal.html
    index 959e108f80a..df30c1cd508 100644
    --- a/docs/0.44/modal.html
    +++ b/docs/0.44/modal.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.44/modal/index.html b/docs/0.44/modal/index.html
    index 959e108f80a..df30c1cd508 100644
    --- a/docs/0.44/modal/index.html
    +++ b/docs/0.44/modal/index.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.44/navigatorios.html b/docs/0.44/navigatorios.html
    index 5f68ddad6b5..e2cff297687 100644
    --- a/docs/0.44/navigatorios.html
    +++ b/docs/0.44/navigatorios.html
    @@ -248,6 +248,7 @@ render() {
     
     

    interactivePopGestureEnabled

    +

    Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

    If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

    @@ -356,7 +357,7 @@ render() {

    pop()

    pop();
     
    -

    Pop back to the previous scene.

    +

    Get and remove the previous scene.


    replaceAtIndex()

    replaceAtIndex((route: object), (index: number));
    @@ -437,7 +438,7 @@ render() {
     

    resetTo()

    resetTo((route: object));
     
    -

    Replaces the top item and pop to it.

    +

    Replaces the top item, gets back to and removes it.

    Parameters:

    diff --git a/docs/0.44/navigatorios/index.html b/docs/0.44/navigatorios/index.html index 5f68ddad6b5..e2cff297687 100644 --- a/docs/0.44/navigatorios/index.html +++ b/docs/0.44/navigatorios/index.html @@ -248,6 +248,7 @@ render() {

    interactivePopGestureEnabled

    +

    Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

    If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

    @@ -356,7 +357,7 @@ render() {

    pop()

    pop();
     
    -

    Pop back to the previous scene.

    +

    Get and remove the previous scene.


    replaceAtIndex()

    replaceAtIndex((route: object), (index: number));
    @@ -437,7 +438,7 @@ render() {
     

    resetTo()

    resetTo((route: object));
     
    -

    Replaces the top item and pop to it.

    +

    Replaces the top item, gets back to and removes it.

    Parameters:

    diff --git a/docs/0.44/scrollview.html b/docs/0.44/scrollview.html index 359f16c1ddc..0f56e971338 100644 --- a/docs/0.44/scrollview.html +++ b/docs/0.44/scrollview.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    -

    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 everythign all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    ScrollView renders all its react child components at once, but 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 everythign all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -490,6 +490,7 @@

      indicatorStyle

      The style of the scroll indicators.

      +
      • default (the default), same as black.
      • black, scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.44/scrollview/index.html b/docs/0.44/scrollview/index.html index 359f16c1ddc..0f56e971338 100644 --- a/docs/0.44/scrollview/index.html +++ b/docs/0.44/scrollview/index.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    -

    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 everythign all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    ScrollView renders all its react child components at once, but 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 everythign all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -490,6 +490,7 @@

      indicatorStyle

      The style of the scroll indicators.

      +
      • default (the default), same as black.
      • black, scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.44/sectionlist.html b/docs/0.44/sectionlist.html index bff40db82f3..884d052fe32 100644 --- a/docs/0.44/sectionlist.html +++ b/docs/0.44/sectionlist.html @@ -83,7 +83,7 @@

      If you don't need section support and want a simpler interface, use <FlatList>.

      If you need sticky section header support, use ListView for now.

      -

      Simple Examples:

      +

      Examples:

      <SectionList
         renderItem={({item}) => <ListItem title={item.title}}
         renderSectionHeader={({section}) => <H1 title={section.key} />}
      diff --git a/docs/0.44/sectionlist/index.html b/docs/0.44/sectionlist/index.html
      index bff40db82f3..884d052fe32 100644
      --- a/docs/0.44/sectionlist/index.html
      +++ b/docs/0.44/sectionlist/index.html
      @@ -83,7 +83,7 @@
       

    If you don't need section support and want a simpler interface, use <FlatList>.

    If you need sticky section header support, use ListView for now.

    -

    Simple Examples:

    +

    Examples:

    <SectionList
       renderItem={({item}) => <ListItem title={item.title}}
       renderSectionHeader={({section}) => <H1 title={section.key} />}
    diff --git a/docs/0.44/textinput.html b/docs/0.44/textinput.html
    index 97949294d13..313ced165ce 100644
    --- a/docs/0.44/textinput.html
    +++ b/docs/0.44/textinput.html
    @@ -69,7 +69,7 @@
                   }
                 });
             
    Edit

    TextInput

    A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

    -

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

    +

    The most basic use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:


    defaultValue

    -

    Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    +

    Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    @@ -578,7 +578,7 @@ AppRegistry.registerComponent(
    TypeRequired

    value

    -

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    +

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    diff --git a/docs/0.44/textinput/index.html b/docs/0.44/textinput/index.html index 97949294d13..313ced165ce 100644 --- a/docs/0.44/textinput/index.html +++ b/docs/0.44/textinput/index.html @@ -69,7 +69,7 @@ } });
    Edit

    TextInput

    A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

    -

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

    +

    The most basic use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:

    TypeRequired

    defaultValue

    -

    Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    +

    Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    @@ -578,7 +578,7 @@ AppRegistry.registerComponent(
    TypeRequired

    value

    -

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    +

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    diff --git a/docs/0.44/view.html b/docs/0.44/view.html index fc50a601cb3..4fd5e556308 100644 --- a/docs/0.44/view.html +++ b/docs/0.44/view.html @@ -371,7 +371,7 @@
    TypeRequired

    removeClippedSubviews

    -

    This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

    +

    This is a reserved performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

    @@ -484,7 +484,7 @@

    renderToHardwareTextureAndroid

    Whether this View should render itself (and all of its children) into a single hardware texture on the GPU.

    -

    On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

    +

    On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

    TypeRequired
    diff --git a/docs/0.44/view/index.html b/docs/0.44/view/index.html index fc50a601cb3..4fd5e556308 100644 --- a/docs/0.44/view/index.html +++ b/docs/0.44/view/index.html @@ -371,7 +371,7 @@
    TypeRequiredPlatform

    removeClippedSubviews

    -

    This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

    +

    This is a reserved performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

    @@ -484,7 +484,7 @@

    renderToHardwareTextureAndroid

    Whether this View should render itself (and all of its children) into a single hardware texture on the GPU.

    -

    On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

    +

    On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

    TypeRequired
    diff --git a/docs/0.45/animated.html b/docs/0.45/animated.html index da510d92f76..af2d2946a2a 100644 --- a/docs/0.45/animated.html +++ b/docs/0.45/animated.html @@ -1,4 +1,4 @@ -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    The simplest workflow for creating an animation is to to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    diff --git a/docs/0.45/animated/index.html b/docs/0.45/animated/index.html index da510d92f76..af2d2946a2a 100644 --- a/docs/0.45/animated/index.html +++ b/docs/0.45/animated/index.html @@ -1,4 +1,4 @@ -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    The simplest workflow for creating an animation is to to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    diff --git a/docs/0.45/drawerlayoutandroid.html b/docs/0.45/drawerlayoutandroid.html index 4566173240e..3f5c2bfbafc 100644 --- a/docs/0.45/drawerlayoutandroid.html +++ b/docs/0.45/drawerlayoutandroid.html @@ -228,7 +228,7 @@
    TypeRequiredPlatform

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.45/drawerlayoutandroid/index.html b/docs/0.45/drawerlayoutandroid/index.html
    index 4566173240e..3f5c2bfbafc 100644
    --- a/docs/0.45/drawerlayoutandroid/index.html
    +++ b/docs/0.45/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.45/listview.html b/docs/0.45/listview.html
    index a725fed1b26..bad4c13344f 100644
    --- a/docs/0.45/listview.html
    +++ b/docs/0.45/listview.html
    @@ -1,4 +1,4 @@
    -ListView · React Native
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with a simple array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    +
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with an array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    Minimal example:

    class MyComponent extends Component {
       constructor() {
    diff --git a/docs/0.45/listview/index.html b/docs/0.45/listview/index.html
    index a725fed1b26..bad4c13344f 100644
    --- a/docs/0.45/listview/index.html
    +++ b/docs/0.45/listview/index.html
    @@ -1,4 +1,4 @@
    -ListView · React Native
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with a simple array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    +
    Edit

    ListView

    ListView - A core component designed for efficient display of vertically scrolling lists of changing data. The minimal API is to create a ListView.DataSource, populate it with an array of data blobs, and instantiate a ListView component with that data source and a renderRow callback which takes a blob from the data array and returns a renderable component.

    Minimal example:

    class MyComponent extends Component {
       constructor() {
    diff --git a/docs/0.45/listviewdatasource.html b/docs/0.45/listviewdatasource.html
    index 6e89311c3a0..27d853afcd2 100644
    --- a/docs/0.45/listviewdatasource.html
    +++ b/docs/0.45/listviewdatasource.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.45/listviewdatasource/index.html b/docs/0.45/listviewdatasource/index.html
    index 6e89311c3a0..27d853afcd2 100644
    --- a/docs/0.45/listviewdatasource/index.html
    +++ b/docs/0.45/listviewdatasource/index.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.45/modal.html b/docs/0.45/modal.html
    index 1d1e5bf832b..38ff23f60b6 100644
    --- a/docs/0.45/modal.html
    +++ b/docs/0.45/modal.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.45/modal/index.html b/docs/0.45/modal/index.html
    index 1d1e5bf832b..38ff23f60b6 100644
    --- a/docs/0.45/modal/index.html
    +++ b/docs/0.45/modal/index.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.46/drawerlayoutandroid.html b/docs/0.46/drawerlayoutandroid.html
    index 62b5766b87e..b5e900201eb 100644
    --- a/docs/0.46/drawerlayoutandroid.html
    +++ b/docs/0.46/drawerlayoutandroid.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.46/drawerlayoutandroid/index.html b/docs/0.46/drawerlayoutandroid/index.html
    index 62b5766b87e..b5e900201eb 100644
    --- a/docs/0.46/drawerlayoutandroid/index.html
    +++ b/docs/0.46/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.46/listviewdatasource.html b/docs/0.46/listviewdatasource.html
    index f551cd0cd6d..9d2af1e241b 100644
    --- a/docs/0.46/listviewdatasource.html
    +++ b/docs/0.46/listviewdatasource.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.46/listviewdatasource/index.html b/docs/0.46/listviewdatasource/index.html
    index f551cd0cd6d..9d2af1e241b 100644
    --- a/docs/0.46/listviewdatasource/index.html
    +++ b/docs/0.46/listviewdatasource/index.html
    @@ -1,4 +1,4 @@
    -ListViewDataSource · React Native
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

    -

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    +
    Edit

    ListViewDataSource

    Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

    +

    To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

    In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

    getInitialState: function() {
       var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
    @@ -124,9 +124,9 @@ _onDataArrived(newData) {
     

    cloneWithRows()

    cloneWithRows(dataBlob, rowIdentities);
     
    -

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    +

    Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

    The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

    -

    Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

    +

    Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


    cloneWithRowsAndSections()

    cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
    diff --git a/docs/0.46/modal.html b/docs/0.46/modal.html
    index 3d47bae407f..a9474fc23c5 100644
    --- a/docs/0.46/modal.html
    +++ b/docs/0.46/modal.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.46/modal/index.html b/docs/0.46/modal/index.html
    index 3d47bae407f..a9474fc23c5 100644
    --- a/docs/0.46/modal/index.html
    +++ b/docs/0.46/modal/index.html
    @@ -1,4 +1,4 @@
    -Modal · React Native
    Edit

    Modal

    The Modal component is a simple way to present content above an enclosing view.

    +
    Edit

    Modal

    The Modal component is a basic way to present content above an enclosing view.

    Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

    import React, {Component} from 'react';
     import {Modal, Text, TouchableHighlight, View} from 'react-native';
    diff --git a/docs/0.47/drawerlayoutandroid.html b/docs/0.47/drawerlayoutandroid.html
    index 3b2c861ea6e..2db2dbe0f5a 100644
    --- a/docs/0.47/drawerlayoutandroid.html
    +++ b/docs/0.47/drawerlayoutandroid.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.47/drawerlayoutandroid/index.html b/docs/0.47/drawerlayoutandroid/index.html
    index 3b2c861ea6e..2db2dbe0f5a 100644
    --- a/docs/0.47/drawerlayoutandroid/index.html
    +++ b/docs/0.47/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.47/flatlist.html b/docs/0.47/flatlist.html
    index 566204a7fa5..951cfdba9fa 100644
    --- a/docs/0.47/flatlist.html
    +++ b/docs/0.47/flatlist.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -202,7 +202,7 @@ class MyList extends React.PureComponent {

      data

      -

      For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      +

      For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      @@ -286,7 +286,7 @@ class MyList extends React.PureComponent {
      TypeRequired

      getItemLayout

      -

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is the most efficient, and is easy to use if you have fixed height items, for example:

      +

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is efficient if you have fixed sized items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
      diff --git a/docs/0.47/flatlist/index.html b/docs/0.47/flatlist/index.html
      index 566204a7fa5..951cfdba9fa 100644
      --- a/docs/0.47/flatlist/index.html
      +++ b/docs/0.47/flatlist/index.html
      @@ -1,4 +1,4 @@
      -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -202,7 +202,7 @@ class MyList extends React.PureComponent {

      data

      -

      For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      +

      For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

      @@ -286,7 +286,7 @@ class MyList extends React.PureComponent {
      TypeRequired

      getItemLayout

      -

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is the most efficient, and is easy to use if you have fixed height items, for example:

      +

      getItemLayout is an optional optimizations that let us skip measurement of dynamic content if you know the height of items a priori. getItemLayout is efficient if you have fixed sized items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
      diff --git a/docs/0.47/layout-props.html b/docs/0.47/layout-props.html
      index 13620f50e91..e4e86395081 100644
      --- a/docs/0.47/layout-props.html
      +++ b/docs/0.47/layout-props.html
      @@ -571,9 +571,9 @@
       
       

      position

      -

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

      +

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

      If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

      -

      If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

      +

      If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

      See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

      diff --git a/docs/0.47/layout-props/index.html b/docs/0.47/layout-props/index.html index 13620f50e91..e4e86395081 100644 --- a/docs/0.47/layout-props/index.html +++ b/docs/0.47/layout-props/index.html @@ -571,9 +571,9 @@

      position

      -

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

      +

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

      If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

      -

      If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

      +

      If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

      See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

      diff --git a/docs/0.47/listviewdatasource.html b/docs/0.47/listviewdatasource.html index 5804ffbac6d..bcba0ba987e 100644 --- a/docs/0.47/listviewdatasource.html +++ b/docs/0.47/listviewdatasource.html @@ -1,4 +1,4 @@ -ListViewDataSource · React Native
      Edit

      ListViewDataSource

      Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

      -

      To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

      +
      Edit

      ListViewDataSource

      Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

      +

      To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

      In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

      getInitialState: function() {
         var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
      @@ -124,9 +124,9 @@ _onDataArrived(newData) {
       

      cloneWithRows()

      cloneWithRows(dataBlob, rowIdentities);
       
      -

      Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

      +

      Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

      The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

      -

      Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

      +

      Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


      cloneWithRowsAndSections()

      cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
      diff --git a/docs/0.47/listviewdatasource/index.html b/docs/0.47/listviewdatasource/index.html
      index 5804ffbac6d..bcba0ba987e 100644
      --- a/docs/0.47/listviewdatasource/index.html
      +++ b/docs/0.47/listviewdatasource/index.html
      @@ -1,4 +1,4 @@
      -ListViewDataSource · React Native
      Edit

      ListViewDataSource

      Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be as simple as an array of strings, or an object with rows nested inside section objects.

      -

      To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods suck in the new data and compute a diff for each row so ListView knows whether to re-render it or not.

      +
      Edit

      ListViewDataSource

      Provides efficient data processing and access to the ListView component. A ListViewDataSource is created with functions for extracting data from the input blob, and comparing elements (with default implementations for convenience). The input blob can be an array of strings, or an object with rows nested inside section objects.

      +

      To update the data in the datasource, use cloneWithRows (or cloneWithRowsAndSections if you care about sections). The data in the data source is immutable, so you can't modify it directly. The clone methods feed from the new data and compute a diff for each row so ListView knows whether to re-render it or not.

      In this example, a component receives data in chunks, handled by _onDataArrived, which concats the new data onto the old data and updates the data source. We use concat to create a new array - mutating this._data, e.g. with this._data.push(newRowData), would be an error. _rowHasChanged understands the shape of the row data and knows how to efficiently compare it.

      getInitialState: function() {
         var ds = new ListViewDataSource({rowHasChanged: this._rowHasChanged});
      @@ -124,9 +124,9 @@ _onDataArrived(newData) {
       

      cloneWithRows()

      cloneWithRows(dataBlob, rowIdentities);
       
      -

      Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is just an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

      +

      Clones this ListViewDataSource with the specified dataBlob and rowIdentities. The dataBlob is only an arbitrary blob of data. At construction an extractor to get the interesting information was defined (or the default was used).

      The rowIdentities is a 2D array of identifiers for rows. ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's assumed that the keys of the section data are the row identities.

      -

      Note: This function does NOT clone the data in this data source. It simply passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.

      +

      Note: This function does NOT clone the data in this data source. It passes the functions defined at construction to a new data source with the data specified. If you wish to maintain the existing data you must handle merging of old and new data separately and then pass that into this function as the dataBlob.


      cloneWithRowsAndSections()

      cloneWithRowsAndSections(dataBlob, sectionIdentities, rowIdentities);
      diff --git a/docs/0.47/modal.html b/docs/0.47/modal.html
      index 87e7ea9735c..4ceec2be016 100644
      --- a/docs/0.47/modal.html
      +++ b/docs/0.47/modal.html
      @@ -1,4 +1,4 @@
      -Modal · React Native
      Edit

      Modal

      The Modal component is a simple way to present content above an enclosing view.

      +
      Edit

      Modal

      The Modal component is a basic way to present content above an enclosing view.

      Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

      import React, {Component} from 'react';
       import {Modal, Text, TouchableHighlight, View} from 'react-native';
      diff --git a/docs/0.47/modal/index.html b/docs/0.47/modal/index.html
      index 87e7ea9735c..4ceec2be016 100644
      --- a/docs/0.47/modal/index.html
      +++ b/docs/0.47/modal/index.html
      @@ -1,4 +1,4 @@
      -Modal · React Native
      Edit

      Modal

      The Modal component is a simple way to present content above an enclosing view.

      +
      Edit

      Modal

      The Modal component is a basic way to present content above an enclosing view.

      Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.

      import React, {Component} from 'react';
       import {Modal, Text, TouchableHighlight, View} from 'react-native';
      diff --git a/docs/0.47/scrollview.html b/docs/0.47/scrollview.html
      index 6286092a4cb..377954fa502 100644
      --- a/docs/0.47/scrollview.html
      +++ b/docs/0.47/scrollview.html
      @@ -69,12 +69,12 @@
                     }
                   });
               
      Edit

      ScrollView

      Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

      -

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

      +

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

      Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

      <ScrollView> vs <FlatList> - which one to use?

      -

      ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

      -

      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.

      -

      This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      +

      ScrollView renders all its react child components at once, but 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.

      +

      This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      FlatList 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.

      Props

        @@ -514,6 +514,7 @@ const styles = StyleSheet.create({

        indicatorStyle

        The style of the scroll indicators.

        +
        • 'default' (the default), same as black.
        • 'black', scroll indicator is black. This style is good against a light background.
        • diff --git a/docs/0.47/scrollview/index.html b/docs/0.47/scrollview/index.html index 6286092a4cb..377954fa502 100644 --- a/docs/0.47/scrollview/index.html +++ b/docs/0.47/scrollview/index.html @@ -69,12 +69,12 @@ } });
      Edit

      ScrollView

      Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

      -

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

      +

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

      Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

      <ScrollView> vs <FlatList> - which one to use?

      -

      ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

      -

      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.

      -

      This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      +

      ScrollView renders all its react child components at once, but 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.

      +

      This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      FlatList 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.

      Props

        @@ -514,6 +514,7 @@ const styles = StyleSheet.create({

        indicatorStyle

        The style of the scroll indicators.

        +
        • 'default' (the default), same as black.
        • 'black', scroll indicator is black. This style is good against a light background.
        • diff --git a/docs/0.47/sectionlist.html b/docs/0.47/sectionlist.html index 61781957e10..61777f3ccb2 100644 --- a/docs/0.47/sectionlist.html +++ b/docs/0.47/sectionlist.html @@ -82,7 +82,7 @@
        • Scroll loading.

        If you don't need section support and want a simpler interface, use <FlatList>.

        -

        Simple Examples:

        +

        Examples:

        <SectionList
           renderItem={({item}) => <ListItem title={item.title} />}
           renderSectionHeader={({section}) => <H1 title={section.title} />}
        diff --git a/docs/0.47/sectionlist/index.html b/docs/0.47/sectionlist/index.html
        index 61781957e10..61777f3ccb2 100644
        --- a/docs/0.47/sectionlist/index.html
        +++ b/docs/0.47/sectionlist/index.html
        @@ -82,7 +82,7 @@
         
      • Scroll loading.

      If you don't need section support and want a simpler interface, use <FlatList>.

      -

      Simple Examples:

      +

      Examples:

      <SectionList
         renderItem={({item}) => <ListItem title={item.title} />}
         renderSectionHeader={({section}) => <H1 title={section.title} />}
      diff --git a/docs/0.47/view.html b/docs/0.47/view.html
      index 04e2429c7a8..68508ba9acc 100644
      --- a/docs/0.47/view.html
      +++ b/docs/0.47/view.html
      @@ -386,7 +386,7 @@
       

      removeClippedSubviews

      -

      This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

      +

      This is a reserved performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

      @@ -499,7 +499,7 @@

      renderToHardwareTextureAndroid

      Whether this View should render itself (and all of its children) into a single hardware texture on the GPU.

      -

      On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

      +

      On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

      TypeRequired
      diff --git a/docs/0.47/view/index.html b/docs/0.47/view/index.html index 04e2429c7a8..68508ba9acc 100644 --- a/docs/0.47/view/index.html +++ b/docs/0.47/view/index.html @@ -386,7 +386,7 @@
      TypeRequiredPlatform

      removeClippedSubviews

      -

      This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

      +

      This is a reserved performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).

      @@ -499,7 +499,7 @@

      renderToHardwareTextureAndroid

      Whether this View should render itself (and all of its children) into a single hardware texture on the GPU.

      -

      On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

      +

      On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.

      TypeRequired
      diff --git a/docs/0.48/drawerlayoutandroid.html b/docs/0.48/drawerlayoutandroid.html index f1c43d1d15b..bf056958b0c 100644 --- a/docs/0.48/drawerlayoutandroid.html +++ b/docs/0.48/drawerlayoutandroid.html @@ -228,7 +228,7 @@
      TypeRequiredPlatform

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.48/drawerlayoutandroid/index.html b/docs/0.48/drawerlayoutandroid/index.html
      index f1c43d1d15b..bf056958b0c 100644
      --- a/docs/0.48/drawerlayoutandroid/index.html
      +++ b/docs/0.48/drawerlayoutandroid/index.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.49/drawerlayoutandroid.html b/docs/0.49/drawerlayoutandroid.html
      index 874ab8d0089..fcec1fe7827 100644
      --- a/docs/0.49/drawerlayoutandroid.html
      +++ b/docs/0.49/drawerlayoutandroid.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.49/drawerlayoutandroid/index.html b/docs/0.49/drawerlayoutandroid/index.html
      index 874ab8d0089..fcec1fe7827 100644
      --- a/docs/0.49/drawerlayoutandroid/index.html
      +++ b/docs/0.49/drawerlayoutandroid/index.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.50/drawerlayoutandroid.html b/docs/0.50/drawerlayoutandroid.html
      index 55f5ae7bb00..596adb60d7b 100644
      --- a/docs/0.50/drawerlayoutandroid.html
      +++ b/docs/0.50/drawerlayoutandroid.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.50/drawerlayoutandroid/index.html b/docs/0.50/drawerlayoutandroid/index.html
      index 55f5ae7bb00..596adb60d7b 100644
      --- a/docs/0.50/drawerlayoutandroid/index.html
      +++ b/docs/0.50/drawerlayoutandroid/index.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.51/animated.html b/docs/0.51/animated.html
      index efa4525488f..138cf948ff8 100644
      --- a/docs/0.51/animated.html
      +++ b/docs/0.51/animated.html
      @@ -1,4 +1,4 @@
      -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    -

    The simplest workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    +

    The most basic workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
       this.state.fadeAnim, // The value to drive
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    @@ -213,14 +213,14 @@

    Animates a value according to an analytical spring model based on damped harmonic oscillation. Tracks velocity state to create fluid motions as the toValue updates, and can be chained together.

    Config is an object that may have the following options.

    Note that you can only define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one:

    -

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    +

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    • friction: Controls "bounciness"/overshoot. Default 7.
    • tension: Controls speed. Default 40.
    • speed: Controls speed of the animation. Default 12.
    • bounciness: Controls bounciness. Default 8.
    -

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation primitive.

    +

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation.

    • stiffness: The spring stiffness coefficient. Default 100.
    • damping: Defines how the spring’s motion should be damped due to the forces of friction. Default 10.
    • diff --git a/docs/0.51/animated/index.html b/docs/0.51/animated/index.html index efa4525488f..138cf948ff8 100644 --- a/docs/0.51/animated/index.html +++ b/docs/0.51/animated/index.html @@ -1,4 +1,4 @@ -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    -

    The simplest workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    +

    The most basic workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
       this.state.fadeAnim, // The value to drive
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, multiplication, division, or modulo to make a new animated value:

    @@ -213,14 +213,14 @@

    Animates a value according to an analytical spring model based on damped harmonic oscillation. Tracks velocity state to create fluid motions as the toValue updates, and can be chained together.

    Config is an object that may have the following options.

    Note that you can only define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one:

    -

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    +

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    • friction: Controls "bounciness"/overshoot. Default 7.
    • tension: Controls speed. Default 40.
    • speed: Controls speed of the animation. Default 12.
    • bounciness: Controls bounciness. Default 8.
    -

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation primitive.

    +

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation.

    • stiffness: The spring stiffness coefficient. Default 100.
    • damping: Defines how the spring’s motion should be damped due to the forces of friction. Default 10.
    • diff --git a/docs/0.51/drawerlayoutandroid.html b/docs/0.51/drawerlayoutandroid.html index 9acfd4901b9..0383f4cf784 100644 --- a/docs/0.51/drawerlayoutandroid.html +++ b/docs/0.51/drawerlayoutandroid.html @@ -228,7 +228,7 @@

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.51/drawerlayoutandroid/index.html b/docs/0.51/drawerlayoutandroid/index.html
      index 9acfd4901b9..0383f4cf784 100644
      --- a/docs/0.51/drawerlayoutandroid/index.html
      +++ b/docs/0.51/drawerlayoutandroid/index.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.51/easing.html b/docs/0.51/easing.html
      index f0872b1669c..271cbde8d52 100644
      --- a/docs/0.51/easing.html
      +++ b/docs/0.51/easing.html
      @@ -73,10 +73,10 @@
       

      Predefined animations

      The Easing module provides several predefined animations through the following methods:

        -
      • back provides a simple animation where the object goes slightly back before moving forward
      • +
      • back provides a basic animation where the object goes slightly back before moving forward
      • bounce provides a bouncing animation
      • -
      • ease provides a simple inertial animation
      • -
      • elastic provides a simple spring interaction
      • +
      • ease provides a basic inertial animation
      • +
      • elastic provides a basic spring interaction

      Standard functions

      Three standard easing functions are provided:

      @@ -142,7 +142,7 @@

      ease()

      static ease(t)
       
      -

      A simple inertial interaction, similar to an object slowly accelerating to speed.

      +

      A basic inertial interaction, similar to an object slowly accelerating to speed.

      http://cubic-bezier.com/#.42,0,1,1


      quad()

      @@ -184,14 +184,14 @@

      elastic()

      static elastic(bounciness)
       
      -

      A simple elastic interaction, similar to a spring oscillating back and forth.

      +

      A basic elastic interaction, similar to a spring oscillating back and forth.

      Default bounciness is 1, which overshoots a little bit once. 0 bounciness doesn't overshoot at all, and bounciness of N > 1 will overshoot about N times.

      http://easings.net/#easeInElastic


      back()

      static back(s)
       
      -

      Use with Animated.parallel() to create a simple effect where the object animates back slightly as the animation starts.

      +

      Use with Animated.parallel() to create a basic effect where the object animates back slightly as the animation starts.

      Wolfram Plot:

      • http://tiny.cc/back_default (s = 1.70158, default)
      • @@ -200,7 +200,7 @@

        bounce()

        static bounce(t)
         
        -

        Provides a simple bouncing effect.

        +

        Provides a basic bouncing effect.

        http://easings.net/#easeInBounce


        bezier()

        diff --git a/docs/0.51/easing/index.html b/docs/0.51/easing/index.html index f0872b1669c..271cbde8d52 100644 --- a/docs/0.51/easing/index.html +++ b/docs/0.51/easing/index.html @@ -73,10 +73,10 @@

        Predefined animations

        The Easing module provides several predefined animations through the following methods:

          -
        • back provides a simple animation where the object goes slightly back before moving forward
        • +
        • back provides a basic animation where the object goes slightly back before moving forward
        • bounce provides a bouncing animation
        • -
        • ease provides a simple inertial animation
        • -
        • elastic provides a simple spring interaction
        • +
        • ease provides a basic inertial animation
        • +
        • elastic provides a basic spring interaction

        Standard functions

        Three standard easing functions are provided:

        @@ -142,7 +142,7 @@

        ease()

        static ease(t)
         
        -

        A simple inertial interaction, similar to an object slowly accelerating to speed.

        +

        A basic inertial interaction, similar to an object slowly accelerating to speed.

        http://cubic-bezier.com/#.42,0,1,1


        quad()

        @@ -184,14 +184,14 @@

        elastic()

        static elastic(bounciness)
         
        -

        A simple elastic interaction, similar to a spring oscillating back and forth.

        +

        A basic elastic interaction, similar to a spring oscillating back and forth.

        Default bounciness is 1, which overshoots a little bit once. 0 bounciness doesn't overshoot at all, and bounciness of N > 1 will overshoot about N times.

        http://easings.net/#easeInElastic


        back()

        static back(s)
         
        -

        Use with Animated.parallel() to create a simple effect where the object animates back slightly as the animation starts.

        +

        Use with Animated.parallel() to create a basic effect where the object animates back slightly as the animation starts.

        Wolfram Plot:

        • http://tiny.cc/back_default (s = 1.70158, default)
        • @@ -200,7 +200,7 @@

          bounce()

          static bounce(t)
           
          -

          Provides a simple bouncing effect.

          +

          Provides a basic bouncing effect.

          http://easings.net/#easeInBounce


          bezier()

          diff --git a/docs/0.51/flatlist.html b/docs/0.51/flatlist.html index aab08e1d51b..54b36e5b0c4 100644 --- a/docs/0.51/flatlist.html +++ b/docs/0.51/flatlist.html @@ -1,4 +1,4 @@ -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • diff --git a/docs/0.51/flatlist/index.html b/docs/0.51/flatlist/index.html index aab08e1d51b..54b36e5b0c4 100644 --- a/docs/0.51/flatlist/index.html +++ b/docs/0.51/flatlist/index.html @@ -1,4 +1,4 @@ -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • diff --git a/docs/0.51/layout-props.html b/docs/0.51/layout-props.html index d8801a37e83..e8b91e3feb4 100644 --- a/docs/0.51/layout-props.html +++ b/docs/0.51/layout-props.html @@ -657,9 +657,9 @@

      position

      -

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

      +

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

      If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

      -

      If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

      +

      If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

      See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

      diff --git a/docs/0.51/layout-props/index.html b/docs/0.51/layout-props/index.html index d8801a37e83..e8b91e3feb4 100644 --- a/docs/0.51/layout-props/index.html +++ b/docs/0.51/layout-props/index.html @@ -657,9 +657,9 @@

      position

      -

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

      +

      position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

      If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

      -

      If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

      +

      If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

      See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

      diff --git a/docs/0.51/scrollview.html b/docs/0.51/scrollview.html index 2a46e838947..6690b5ebbda 100644 --- a/docs/0.51/scrollview.html +++ b/docs/0.51/scrollview.html @@ -69,12 +69,12 @@ } });
      Edit

      ScrollView

      Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

      -

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

      +

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

      Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

      <ScrollView> vs <FlatList> - which one to use?

      -

      ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

      -

      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.

      -

      This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      +

      ScrollView renders all its react child components at once, but 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.

      +

      This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      FlatList 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.

      Props

        @@ -518,6 +518,7 @@ const styles = StyleSheet.create({

        indicatorStyle

        The style of the scroll indicators.

        +
        • 'default' (the default), same as black.
        • 'black', scroll indicator is black. This style is good against a light background.
        • diff --git a/docs/0.51/scrollview/index.html b/docs/0.51/scrollview/index.html index 2a46e838947..6690b5ebbda 100644 --- a/docs/0.51/scrollview/index.html +++ b/docs/0.51/scrollview/index.html @@ -69,12 +69,12 @@ } });
      Edit

      ScrollView

      Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

      -

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

      +

      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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

      Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

      <ScrollView> vs <FlatList> - which one to use?

      -

      ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

      -

      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.

      -

      This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      +

      ScrollView renders all its react child components at once, but 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.

      +

      This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

      FlatList 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.

      Props

        @@ -518,6 +518,7 @@ const styles = StyleSheet.create({

        indicatorStyle

        The style of the scroll indicators.

        +
        • 'default' (the default), same as black.
        • 'black', scroll indicator is black. This style is good against a light background.
        • diff --git a/docs/0.51/sectionlist.html b/docs/0.51/sectionlist.html index 5815daccefd..dd786fbb1b1 100644 --- a/docs/0.51/sectionlist.html +++ b/docs/0.51/sectionlist.html @@ -82,7 +82,7 @@
        • Scroll loading.

        If you don't need section support and want a simpler interface, use <FlatList>.

        -

        Simple Examples:

        +

        Examples:

        <SectionList
           renderItem={({item}) => <ListItem title={item} />}
           renderSectionHeader={({section}) => <Header title={section.title} />}
        diff --git a/docs/0.51/sectionlist/index.html b/docs/0.51/sectionlist/index.html
        index 5815daccefd..dd786fbb1b1 100644
        --- a/docs/0.51/sectionlist/index.html
        +++ b/docs/0.51/sectionlist/index.html
        @@ -82,7 +82,7 @@
         
      • Scroll loading.

      If you don't need section support and want a simpler interface, use <FlatList>.

      -

      Simple Examples:

      +

      Examples:

      <SectionList
         renderItem={({item}) => <ListItem title={item} />}
         renderSectionHeader={({section}) => <Header title={section.title} />}
      diff --git a/docs/0.51/text.html b/docs/0.51/text.html
      index a1c610e02dc..86821ae0d44 100644
      --- a/docs/0.51/text.html
      +++ b/docs/0.51/text.html
      @@ -199,7 +199,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
       

      In order to use this feature, you must give the view a width and a height.

      Containers

      -

      The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

      +

      The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

      <Text>
         <Text>First part and </Text>
         <Text>second part</Text>
      @@ -248,7 +248,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
         <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
       </View>
       
      -

      Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

      +

      Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

      class MyAppHeaderText extends Component {
         render() {
           <MyAppText>
      diff --git a/docs/0.51/text/index.html b/docs/0.51/text/index.html
      index a1c610e02dc..86821ae0d44 100644
      --- a/docs/0.51/text/index.html
      +++ b/docs/0.51/text/index.html
      @@ -199,7 +199,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
       

      In order to use this feature, you must give the view a width and a height.

      Containers

      -

      The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

      +

      The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

      <Text>
         <Text>First part and </Text>
         <Text>second part</Text>
      @@ -248,7 +248,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
         <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
       </View>
       
      -

      Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

      +

      Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

      class MyAppHeaderText extends Component {
         render() {
           <MyAppText>
      diff --git a/docs/0.51/textinput.html b/docs/0.51/textinput.html
      index a71b0c491bf..f22cffc3fcb 100644
      --- a/docs/0.51/textinput.html
      +++ b/docs/0.51/textinput.html
      @@ -69,7 +69,7 @@
                     }
                   });
               
      Edit

      TextInput

      A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

      -

      The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

      +

      The most basic use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:


      defaultValue

      -

      Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

      +

      Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

      @@ -632,7 +632,7 @@ AppRegistry.registerComponent(
      TypeRequired

      value

      -

      The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

      +

      The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

      diff --git a/docs/0.51/textinput/index.html b/docs/0.51/textinput/index.html index a71b0c491bf..f22cffc3fcb 100644 --- a/docs/0.51/textinput/index.html +++ b/docs/0.51/textinput/index.html @@ -69,7 +69,7 @@ } });
      Edit

      TextInput

      A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

      -

      The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

      +

      The most basic use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:

      TypeRequired

      defaultValue

      -

      Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

      +

      Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

      @@ -632,7 +632,7 @@ AppRegistry.registerComponent(
      TypeRequired

      value

      -

      The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

      +

      The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

      diff --git a/docs/0.52/drawerlayoutandroid.html b/docs/0.52/drawerlayoutandroid.html index 673606d392f..f9701841d7c 100644 --- a/docs/0.52/drawerlayoutandroid.html +++ b/docs/0.52/drawerlayoutandroid.html @@ -228,7 +228,7 @@
      TypeRequired

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.52/drawerlayoutandroid/index.html b/docs/0.52/drawerlayoutandroid/index.html
      index 673606d392f..f9701841d7c 100644
      --- a/docs/0.52/drawerlayoutandroid/index.html
      +++ b/docs/0.52/drawerlayoutandroid/index.html
      @@ -228,7 +228,7 @@
       
       

      drawerBackgroundColor

      -

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      +

      Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

      return (
         <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
         </DrawerLayoutAndroid>
      diff --git a/docs/0.52/easing.html b/docs/0.52/easing.html
      index d5bade9f9af..7f9587ea679 100644
      --- a/docs/0.52/easing.html
      +++ b/docs/0.52/easing.html
      @@ -73,10 +73,10 @@
       

      Predefined animations

      The Easing module provides several predefined animations through the following methods:

        -
      • back provides a simple animation where the object goes slightly back before moving forward
      • +
      • back provides a basic animation where the object goes slightly back before moving forward
      • bounce provides a bouncing animation
      • -
      • ease provides a simple inertial animation
      • -
      • elastic provides a simple spring interaction
      • +
      • ease provides a basic inertial animation
      • +
      • elastic provides a basic spring interaction

      Standard functions

      Three standard easing functions are provided:

      @@ -142,7 +142,7 @@

      ease()

      static ease(t)
       
      -

      A simple inertial interaction, similar to an object slowly accelerating to speed.

      +

      A basic inertial interaction, similar to an object slowly accelerating to speed.

      http://cubic-bezier.com/#.42,0,1,1


      quad()

      @@ -184,14 +184,14 @@

      elastic()

      static elastic(bounciness)
       
      -

      A simple elastic interaction, similar to a spring oscillating back and forth.

      +

      A basic elastic interaction, similar to a spring oscillating back and forth.

      Default bounciness is 1, which overshoots a little bit once. 0 bounciness doesn't overshoot at all, and bounciness of N > 1 will overshoot about N times.

      http://easings.net/#easeInElastic


      back()

      static back(s)
       
      -

      Use with Animated.parallel() to create a simple effect where the object animates back slightly as the animation starts.

      +

      Use with Animated.parallel() to create a basic effect where the object animates back slightly as the animation starts.

      Wolfram Plot:

      • http://tiny.cc/back_default (s = 1.70158, default)
      • @@ -200,7 +200,7 @@

        bounce()

        static bounce(t)
         
        -

        Provides a simple bouncing effect.

        +

        Provides a basic bouncing effect.

        http://easings.net/#easeInBounce


        bezier()

        diff --git a/docs/0.52/easing/index.html b/docs/0.52/easing/index.html index d5bade9f9af..7f9587ea679 100644 --- a/docs/0.52/easing/index.html +++ b/docs/0.52/easing/index.html @@ -73,10 +73,10 @@

        Predefined animations

        The Easing module provides several predefined animations through the following methods:

          -
        • back provides a simple animation where the object goes slightly back before moving forward
        • +
        • back provides a basic animation where the object goes slightly back before moving forward
        • bounce provides a bouncing animation
        • -
        • ease provides a simple inertial animation
        • -
        • elastic provides a simple spring interaction
        • +
        • ease provides a basic inertial animation
        • +
        • elastic provides a basic spring interaction

        Standard functions

        Three standard easing functions are provided:

        @@ -142,7 +142,7 @@

        ease()

        static ease(t)
         
        -

        A simple inertial interaction, similar to an object slowly accelerating to speed.

        +

        A basic inertial interaction, similar to an object slowly accelerating to speed.

        http://cubic-bezier.com/#.42,0,1,1


        quad()

        @@ -184,14 +184,14 @@

        elastic()

        static elastic(bounciness)
         
        -

        A simple elastic interaction, similar to a spring oscillating back and forth.

        +

        A basic elastic interaction, similar to a spring oscillating back and forth.

        Default bounciness is 1, which overshoots a little bit once. 0 bounciness doesn't overshoot at all, and bounciness of N > 1 will overshoot about N times.

        http://easings.net/#easeInElastic


        back()

        static back(s)
         
        -

        Use with Animated.parallel() to create a simple effect where the object animates back slightly as the animation starts.

        +

        Use with Animated.parallel() to create a basic effect where the object animates back slightly as the animation starts.

        Wolfram Plot:

        • http://tiny.cc/back_default (s = 1.70158, default)
        • @@ -200,7 +200,7 @@

          bounce()

          static bounce(t)
           
          -

          Provides a simple bouncing effect.

          +

          Provides a basic bouncing effect.

          http://easings.net/#easeInBounce


          bezier()

          diff --git a/docs/0.52/scrollview.html b/docs/0.52/scrollview.html index 300cc07a4a6..43bf4351161 100644 --- a/docs/0.52/scrollview.html +++ b/docs/0.52/scrollview.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    -

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    ScrollView renders all its react child components at once, but 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.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -518,6 +518,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.52/scrollview/index.html b/docs/0.52/scrollview/index.html index 300cc07a4a6..43bf4351161 100644 --- a/docs/0.52/scrollview/index.html +++ b/docs/0.52/scrollview/index.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    -

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    ScrollView renders all its react child components at once, but 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.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -518,6 +518,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.52/text.html b/docs/0.52/text.html index dec5b78476f..bf3555a038c 100644 --- a/docs/0.52/text.html +++ b/docs/0.52/text.html @@ -199,7 +199,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);

        In order to use this feature, you must give the view a width and a height.

        Containers

        -

        The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

        +

        The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

        <Text>
           <Text>First part and </Text>
           <Text>second part</Text>
        @@ -248,7 +248,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
           <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
         </View>
         
        -

        Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

        +

        Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

        class MyAppHeaderText extends Component {
           render() {
             <MyAppText>
        diff --git a/docs/0.52/text/index.html b/docs/0.52/text/index.html
        index dec5b78476f..bf3555a038c 100644
        --- a/docs/0.52/text/index.html
        +++ b/docs/0.52/text/index.html
        @@ -199,7 +199,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
         

        In order to use this feature, you must give the view a width and a height.

        Containers

        -

        The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

        +

        The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

        <Text>
           <Text>First part and </Text>
           <Text>second part</Text>
        @@ -248,7 +248,7 @@ AppRegistry.registerComponent('AwesomeProject', () => BlueIsCool);
           <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
         </View>
         
        -

        Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

        +

        Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

        class MyAppHeaderText extends Component {
           render() {
             <MyAppText>
        diff --git a/docs/0.52/textinput.html b/docs/0.52/textinput.html
        index c72587e9620..59ee9743753 100644
        --- a/docs/0.52/textinput.html
        +++ b/docs/0.52/textinput.html
        @@ -69,7 +69,7 @@
                       }
                     });
                 
    Edit

    TextInput

    A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

    -

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

    +

    The most basic use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:

    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    -

    The simplest workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    +

    The most basic workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
       this.state.fadeAnim, // The value to drive
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, subtraction, multiplication, division, or modulo to make a new animated value:

    @@ -216,14 +216,15 @@

    Animates a value according to an analytical spring model based on damped harmonic oscillation. Tracks velocity state to create fluid motions as the toValue updates, and can be chained together.

    Config is an object that may have the following options.

    Note that you can only define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one:

    -

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    + +

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    • friction: Controls "bounciness"/overshoot. Default 7.
    • tension: Controls speed. Default 40.
    • speed: Controls speed of the animation. Default 12.
    • bounciness: Controls bounciness. Default 8.
    -

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation primitive.

    +

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation.

    • stiffness: The spring stiffness coefficient. Default 100.
    • damping: Defines how the spring’s motion should be damped due to the forces of friction. Default 10.
    • @@ -324,7 +325,7 @@

      forkEvent()

      static forkEvent(event, listener)
       
      -

      Advanced imperative API for snooping on animated events that are passed in through props. It permits to add a new javascript listener to an existing AnimatedEvent. If animatedEvent is a simple javascript listener, it will merge the 2 listeners into a single one, and if animatedEvent is null/undefined, it will assign the javascript listener directly. Use values directly where possible.

      +

      Advanced imperative API for snooping on animated events that are passed in through props. It permits to add a new javascript listener to an existing AnimatedEvent. If animatedEvent is a javascript listener, it will merge the 2 listeners into a single one, and if animatedEvent is null/undefined, it will assign the javascript listener directly. Use values directly where possible.


      unforkEvent()

      static unforkEvent(event, listener)
      diff --git a/docs/0.56/animated/index.html b/docs/0.56/animated/index.html
      index 06e0ff32fac..ac23e6c52df 100644
      --- a/docs/0.56/animated/index.html
      +++ b/docs/0.56/animated/index.html
      @@ -1,4 +1,4 @@
      -Animated · React Native
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and easy to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and simple start/stop methods to control time-based animation execution.

    -

    The simplest workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    +
    Edit

    Animated

    The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative relationships between inputs and outputs, with configurable transforms in between, and start/stop methods to control time-based animation execution.

    +

    The most basic workflow for creating an animation is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates via animations using Animated.timing():

    Animated.timing(
       // Animate value over time
       this.state.fadeAnim, // The value to drive
    @@ -90,7 +90,7 @@
     

    Animated provides three types of animation types. Each animation type provides a particular animation curve that controls how your values animate from their initial value to the final value:

    In most cases, you will be using timing(). By default, it uses a symmetric easeInOut curve that conveys the gradual acceleration of an object to full speed and concludes by gradually decelerating to a stop.

    @@ -100,7 +100,7 @@

    By using the native driver, we send everything about the animation to native before starting the animation, allowing native code to perform the animation on the UI thread without having to go through the bridge on every frame. Once the animation has started, the JS thread can be blocked without affecting the animation.

    You can use the native driver by specifying useNativeDriver: true in your animation configuration. See the Animations guide to learn more.

    Animatable components

    -

    Only animatable components can be animated. These special components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    +

    Only animatable components can be animated. These unique components do the magic of binding the animated values to the properties, and do targeted native updates to avoid the cost of the react render and reconciliation process on every frame. They also handle cleanup on unmount so they are safe by default.

    @@ -119,7 +119,7 @@
  • Animated.sequence() starts the animations in order, waiting for each to complete before starting the next.
  • Animated.stagger() starts animations in order and in parallel, but with successive delays.
  • -

    Animations can also be chained together simply by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    +

    Animations can also be chained together by setting the toValue of one animation to be another Animated.Value. See Tracking dynamic values in the Animations guide.

    By default, if one animation is stopped or interrupted, then all other animations in the group are also stopped.

    Combining animated values

    You can combine two animated values via addition, subtraction, multiplication, division, or modulo to make a new animated value:

    @@ -216,14 +216,15 @@

    Animates a value according to an analytical spring model based on damped harmonic oscillation. Tracks velocity state to create fluid motions as the toValue updates, and can be chained together.

    Config is an object that may have the following options.

    Note that you can only define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one:

    -

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    + +

    The friction/tension or bounciness/speed options match the spring model in Facebook Pop, Rebound, and Origami.

    • friction: Controls "bounciness"/overshoot. Default 7.
    • tension: Controls speed. Default 40.
    • speed: Controls speed of the animation. Default 12.
    • bounciness: Controls bounciness. Default 8.
    -

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation primitive.

    +

    Specifying stiffness/damping/mass as parameters makes Animated.spring use an analytical spring model based on the motion equations of a damped harmonic oscillator. This behavior is slightly more precise and faithful to the physics behind spring dynamics, and closely mimics the implementation in iOS's CASpringAnimation.

    • stiffness: The spring stiffness coefficient. Default 100.
    • damping: Defines how the spring’s motion should be damped due to the forces of friction. Default 10.
    • @@ -324,7 +325,7 @@

      forkEvent()

      static forkEvent(event, listener)
       
      -

      Advanced imperative API for snooping on animated events that are passed in through props. It permits to add a new javascript listener to an existing AnimatedEvent. If animatedEvent is a simple javascript listener, it will merge the 2 listeners into a single one, and if animatedEvent is null/undefined, it will assign the javascript listener directly. Use values directly where possible.

      +

      Advanced imperative API for snooping on animated events that are passed in through props. It permits to add a new javascript listener to an existing AnimatedEvent. If animatedEvent is a javascript listener, it will merge the 2 listeners into a single one, and if animatedEvent is null/undefined, it will assign the javascript listener directly. Use values directly where possible.


      unforkEvent()

      static unforkEvent(event, listener)
      diff --git a/docs/0.56/asyncstorage.html b/docs/0.56/asyncstorage.html
      index 5ac65240d20..2da2143d27f 100644
      --- a/docs/0.56/asyncstorage.html
      +++ b/docs/0.56/asyncstorage.html
      @@ -1,4 +1,4 @@
      -AsyncStorage · React Native
    Edit

    AsyncStorage

    AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    +
    Edit

    AsyncStorage

    AsyncStorage is an unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    It is recommended that you use an abstraction on top of AsyncStorage instead of AsyncStorage directly for anything more than light usage since it operates globally.

    On iOS, AsyncStorage is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, AsyncStorage will use either RocksDB or SQLite based on what is available.

    -

    The AsyncStorage JavaScript code is a simple facade that provides a clear JavaScript API, real Error objects, and simple non-multi functions. Each method in the API returns a Promise object.

    +

    The AsyncStorage JavaScript code is a facade that provides a clear JavaScript API, real Error objects, and non-multi functions. Each method in the API returns a Promise object.

    Importing the AsyncStorage library:

    import { AsyncStorage } from "react-native"
     
    diff --git a/docs/0.56/asyncstorage/index.html b/docs/0.56/asyncstorage/index.html index 5ac65240d20..2da2143d27f 100644 --- a/docs/0.56/asyncstorage/index.html +++ b/docs/0.56/asyncstorage/index.html @@ -1,4 +1,4 @@ -AsyncStorage · React Native
    Edit

    AsyncStorage

    AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    +
    Edit

    AsyncStorage

    AsyncStorage is an unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    It is recommended that you use an abstraction on top of AsyncStorage instead of AsyncStorage directly for anything more than light usage since it operates globally.

    On iOS, AsyncStorage is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, AsyncStorage will use either RocksDB or SQLite based on what is available.

    -

    The AsyncStorage JavaScript code is a simple facade that provides a clear JavaScript API, real Error objects, and simple non-multi functions. Each method in the API returns a Promise object.

    +

    The AsyncStorage JavaScript code is a facade that provides a clear JavaScript API, real Error objects, and non-multi functions. Each method in the API returns a Promise object.

    Importing the AsyncStorage library:

    import { AsyncStorage } from "react-native"
     
    diff --git a/docs/0.56/drawerlayoutandroid.html b/docs/0.56/drawerlayoutandroid.html index 4502515798e..450422e0488 100644 --- a/docs/0.56/drawerlayoutandroid.html +++ b/docs/0.56/drawerlayoutandroid.html @@ -228,7 +228,7 @@

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.56/drawerlayoutandroid/index.html b/docs/0.56/drawerlayoutandroid/index.html
    index 4502515798e..450422e0488 100644
    --- a/docs/0.56/drawerlayoutandroid/index.html
    +++ b/docs/0.56/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.56/flatlist.html b/docs/0.56/flatlist.html
    index 7a31e9a093d..7a5cb9da3a5 100644
    --- a/docs/0.56/flatlist.html
    +++ b/docs/0.56/flatlist.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -231,7 +231,7 @@ class MultiSelectList extends React.PureComponent {

    data

    -

    For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    +

    For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    @@ -310,7 +310,7 @@ class MultiSelectList extends React.PureComponent {

    getItemLayout

    (data, index) => {length: number, offset: number, index: number}
     
    -

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is both efficient and easy to use if you have fixed height items, for example:

    +

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is efficient if you have fixed height items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
    diff --git a/docs/0.56/flatlist/index.html b/docs/0.56/flatlist/index.html
    index 7a31e9a093d..7a5cb9da3a5 100644
    --- a/docs/0.56/flatlist/index.html
    +++ b/docs/0.56/flatlist/index.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -231,7 +231,7 @@ class MultiSelectList extends React.PureComponent {

    data

    -

    For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    +

    For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    TypeRequired
    @@ -310,7 +310,7 @@ class MultiSelectList extends React.PureComponent {

    getItemLayout

    (data, index) => {length: number, offset: number, index: number}
     
    -

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is both efficient and easy to use if you have fixed height items, for example:

    +

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is efficient if you have fixed height items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
    diff --git a/docs/0.56/inputaccessoryview.html b/docs/0.56/inputaccessoryview.html
    index f89c8fa71d9..3aeda286ceb 100644
    --- a/docs/0.56/inputaccessoryview.html
    +++ b/docs/0.56/inputaccessoryview.html
    @@ -69,7 +69,7 @@
                   }
                 });
             
    Edit

    InputAccessoryView

    A component which enables customization of the keyboard input accessory view on iOS. The input accessory view is displayed above the keyboard whenever a TextInput has focus. This component can be used to create custom toolbars.

    -

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A simple example:

    +

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A basic example:

    Edit

    InputAccessoryView

    A component which enables customization of the keyboard input accessory view on iOS. The input accessory view is displayed above the keyboard whenever a TextInput has focus. This component can be used to create custom toolbars.

    -

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A simple example:

    +

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A basic example:

    TypeRequired

    position

    -

    position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

    +

    position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

    If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

    -

    If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

    +

    If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

    See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

    diff --git a/docs/0.56/layout-props/index.html b/docs/0.56/layout-props/index.html index 5baac3ed6af..ae7c1da9003 100644 --- a/docs/0.56/layout-props/index.html +++ b/docs/0.56/layout-props/index.html @@ -668,9 +668,9 @@

    position

    -

    position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always just relative to the parent.

    +

    position in React Native is similar to regular CSS, but everything is set to relative by default, so absolute positioning is always relative to the parent.

    If you want to position a child using specific numbers of logical pixels relative to its parent, set the child to have absolute position.

    -

    If you want to position a child relative to something that is not its parent, just don't use styles for that. Use the component tree.

    +

    If you want to position a child relative to something that is not its parent, don't use styles for that. Use the component tree.

    See https://github.com/facebook/yoga for more details on how position differs between React Native and CSS.

    diff --git a/docs/0.56/navigatorios.html b/docs/0.56/navigatorios.html index 17ffd32ab6c..783ec8c3a70 100644 --- a/docs/0.56/navigatorios.html +++ b/docs/0.56/navigatorios.html @@ -239,7 +239,8 @@ render() {

    barStyle

    -

    The style of the navigation bar. Supported values are 'default', 'black'. Use 'black' instead of setting barTintColor to black. This produces a navigation bar with the native iOS style with higher translucency.

    + +

    The style of the navigation bar. Supported values are default, black. Use black instead of setting barTintColor to black. This produces a navigation bar with the native iOS style with higher translucency.

    @@ -261,6 +262,7 @@ render() {
    TypeRequired

    interactivePopGestureEnabled

    +

    Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

    If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

    @@ -369,7 +371,7 @@ render() {

    pop()

    pop();
     
    -

    Pop back to the previous scene.

    +

    Get and remove the previous scene.


    replaceAtIndex()

    replaceAtIndex((route: object), (index: number));
    @@ -450,7 +452,7 @@ render() {
     

    resetTo()

    resetTo((route: object));
     
    -

    Replaces the top item and pop to it.

    +

    Replaces the top item and goes back to it.

    Parameters:

    diff --git a/docs/0.56/navigatorios/index.html b/docs/0.56/navigatorios/index.html index 17ffd32ab6c..783ec8c3a70 100644 --- a/docs/0.56/navigatorios/index.html +++ b/docs/0.56/navigatorios/index.html @@ -239,7 +239,8 @@ render() {

    barStyle

    -

    The style of the navigation bar. Supported values are 'default', 'black'. Use 'black' instead of setting barTintColor to black. This produces a navigation bar with the native iOS style with higher translucency.

    + +

    The style of the navigation bar. Supported values are default, black. Use black instead of setting barTintColor to black. This produces a navigation bar with the native iOS style with higher translucency.

    @@ -261,6 +262,7 @@ render() {
    TypeRequired

    interactivePopGestureEnabled

    +

    Boolean value that indicates whether the interactive pop gesture is enabled. This is useful for enabling/disabling the back swipe navigation gesture.

    If this prop is not provided, the default behavior is for the back swipe gesture to be enabled when the navigation bar is shown and disabled when the navigation bar is hidden. Once you've provided the interactivePopGestureEnabled prop, you can never restore the default behavior.

    @@ -369,7 +371,7 @@ render() {

    pop()

    pop();
     
    -

    Pop back to the previous scene.

    +

    Get and remove the previous scene.


    replaceAtIndex()

    replaceAtIndex((route: object), (index: number));
    @@ -450,7 +452,7 @@ render() {
     

    resetTo()

    resetTo((route: object));
     
    -

    Replaces the top item and pop to it.

    +

    Replaces the top item and goes back to it.

    Parameters:

    diff --git a/docs/0.56/panresponder.html b/docs/0.56/panresponder.html index e04d09a84d0..0c0898be53c 100644 --- a/docs/0.56/panresponder.html +++ b/docs/0.56/panresponder.html @@ -1,4 +1,4 @@ -PanResponder · React Native
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

    +
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize basic multi-touch gestures.

    By default, PanResponder holds an InteractionManager handle to block long-running JS events from interrupting active gestures.

    It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

    onPanResponderMove: (event, gestureState) => {}
    @@ -160,7 +160,7 @@
     

    create()

    static create(config)
     
    -

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    +

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state, by replacing the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    • onMoveShouldSetPanResponder: (e, gestureState) => {...}
    • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
    • diff --git a/docs/0.56/panresponder/index.html b/docs/0.56/panresponder/index.html index e04d09a84d0..0c0898be53c 100644 --- a/docs/0.56/panresponder/index.html +++ b/docs/0.56/panresponder/index.html @@ -1,4 +1,4 @@ -PanResponder · React Native
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

    +
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize basic multi-touch gestures.

    By default, PanResponder holds an InteractionManager handle to block long-running JS events from interrupting active gestures.

    It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

    onPanResponderMove: (event, gestureState) => {}
    @@ -160,7 +160,7 @@
     

    create()

    static create(config)
     
    -

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    +

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state, by replacing the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    • onMoveShouldSetPanResponder: (e, gestureState) => {...}
    • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
    • diff --git a/docs/0.56/scrollview.html b/docs/0.56/scrollview.html index 77ee185c266..aabf4c442d4 100644 --- a/docs/0.56/scrollview.html +++ b/docs/0.56/scrollview.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    +

    ScrollView renders all its react child components at once.

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -543,6 +543,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.56/scrollview/index.html b/docs/0.56/scrollview/index.html index 77ee185c266..aabf4c442d4 100644 --- a/docs/0.56/scrollview/index.html +++ b/docs/0.56/scrollview/index.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    +

    ScrollView renders all its react child components at once.

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -543,6 +543,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.56/sectionlist.html b/docs/0.56/sectionlist.html index 1e713006f7b..809e8abdbec 100644 --- a/docs/0.56/sectionlist.html +++ b/docs/0.56/sectionlist.html @@ -82,7 +82,7 @@
      • Scroll loading.

      If you don't need section support and want a simpler interface, use <FlatList>.

      -

      Simple Examples:

      +

      Examples:

      // Example 1 (Homogeneous Rendering)
       <SectionList
         renderItem={({item, index, section}) => <Text key={index}>{item}</Text>}
      diff --git a/docs/0.56/sectionlist/index.html b/docs/0.56/sectionlist/index.html
      index 1e713006f7b..809e8abdbec 100644
      --- a/docs/0.56/sectionlist/index.html
      +++ b/docs/0.56/sectionlist/index.html
      @@ -82,7 +82,7 @@
       
    • Scroll loading.

    If you don't need section support and want a simpler interface, use <FlatList>.

    -

    Simple Examples:

    +

    Examples:

    // Example 1 (Homogeneous Rendering)
     <SectionList
       renderItem={({item, index, section}) => <Text key={index}>{item}</Text>}
    diff --git a/docs/0.56/text.html b/docs/0.56/text.html
    index a97f3ee9ebc..90dc15e7d0f 100644
    --- a/docs/0.56/text.html
    +++ b/docs/0.56/text.html
    @@ -163,7 +163,7 @@ AppRegistry.registerComponent('AwesomeProject',
     9-17: bold, red
     

    Containers

    -

    The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

    +

    The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

    <Text>
       <Text>First part and </Text>
       <Text>second part</Text>
    @@ -212,7 +212,7 @@ AppRegistry.registerComponent('AwesomeProject',
       <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
     </View>
     
    -

    Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

    +

    Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

    class MyAppHeaderText extends Component {
       render() {
         return (
    diff --git a/docs/0.56/text/index.html b/docs/0.56/text/index.html
    index a97f3ee9ebc..90dc15e7d0f 100644
    --- a/docs/0.56/text/index.html
    +++ b/docs/0.56/text/index.html
    @@ -163,7 +163,7 @@ AppRegistry.registerComponent('AwesomeProject',
     9-17: bold, red
     

    Containers

    -

    The <Text> element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

    +

    The <Text> element is unique relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a <Text> are no longer rectangles, but wrap when they see the end of the line.

    <Text>
       <Text>First part and </Text>
       <Text>second part</Text>
    @@ -212,7 +212,7 @@ AppRegistry.registerComponent('AwesomeProject',
       <MyAppHeaderText>Text styled as a header</MyAppHeaderText>
     </View>
     
    -

    Assuming that MyAppText is a component that simply renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

    +

    Assuming that MyAppText is a component that only renders out its children into a Text component with styling, then MyAppHeaderText can be defined as follows:

    class MyAppHeaderText extends Component {
       render() {
         return (
    diff --git a/docs/0.56/textinput.html b/docs/0.56/textinput.html
    index 9401e7bf52c..eecb1c10227 100644
    --- a/docs/0.56/textinput.html
    +++ b/docs/0.56/textinput.html
    @@ -69,7 +69,7 @@
                   }
                 });
             
    Edit

    TextInput

    A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

    -

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

    +

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:


    defaultValue

    -

    Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    +

    Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    @@ -862,7 +862,7 @@ AppRegistry.registerComponent(
    TypeRequired

    value

    -

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    +

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    diff --git a/docs/0.56/textinput/index.html b/docs/0.56/textinput/index.html index 9401e7bf52c..eecb1c10227 100644 --- a/docs/0.56/textinput/index.html +++ b/docs/0.56/textinput/index.html @@ -69,7 +69,7 @@ } });
    Edit

    TextInput

    A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.

    -

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A simple example:

    +

    The simplest use case is to plop down a TextInput and subscribe to the onChangeText events to read the user input. There are also other events, such as onSubmitEditing and onFocus that can be subscribed to. A minimal example:

    TypeRequired

    defaultValue

    -

    Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    +

    Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.

    @@ -862,7 +862,7 @@ AppRegistry.registerComponent(
    TypeRequired

    value

    -

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    +

    The value to show for the text input. TextInput is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set editable={false}, or set/update maxLength to prevent unwanted edits without flicker.

    diff --git a/docs/0.56/vibration.html b/docs/0.56/vibration.html index 9753ef0c921..09cf4435fc6 100644 --- a/docs/0.56/vibration.html +++ b/docs/0.56/vibration.html @@ -72,7 +72,7 @@

    There will be no effect on devices that do not support Vibration, eg. the simulator.

    Note for Android: add <uses-permission android:name="android.permission.VIBRATE"/> to AndroidManifest.xml

    The vibration duration in iOS is not configurable, so there are some differences with Android. In Android, if pattern is a number, it specifies the vibration duration in ms. If pattern is an array, those odd indices are the vibration duration, while the even ones are the separation time.

    -

    In iOS, invoking vibrate(duration) will just ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    +

    In iOS, invoking vibrate(duration) will ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    Repeatable vibration is also supported, the vibration will repeat with defined pattern until cancel() is called.

    Example:

    const DURATION = 10000
    diff --git a/docs/0.56/vibration/index.html b/docs/0.56/vibration/index.html
    index 9753ef0c921..09cf4435fc6 100644
    --- a/docs/0.56/vibration/index.html
    +++ b/docs/0.56/vibration/index.html
    @@ -72,7 +72,7 @@
     

    There will be no effect on devices that do not support Vibration, eg. the simulator.

    Note for Android: add <uses-permission android:name="android.permission.VIBRATE"/> to AndroidManifest.xml

    The vibration duration in iOS is not configurable, so there are some differences with Android. In Android, if pattern is a number, it specifies the vibration duration in ms. If pattern is an array, those odd indices are the vibration duration, while the even ones are the separation time.

    -

    In iOS, invoking vibrate(duration) will just ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    +

    In iOS, invoking vibrate(duration) will ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    Repeatable vibration is also supported, the vibration will repeat with defined pattern until cancel() is called.

    Example:

    const DURATION = 10000
    diff --git a/docs/0.56/webview.html b/docs/0.56/webview.html
    index 148a2fcd825..189b24f6b90 100644
    --- a/docs/0.56/webview.html
    +++ b/docs/0.56/webview.html
    @@ -272,6 +272,7 @@
     
    TypeRequired

    originWhitelist

    +

    List of origin strings to allow being navigated to. The strings allow wildcards and get matched against just the origin (not the full URL). If the user taps to navigate to a new page but the new page is not in this whitelist, the URL will be handled by the OS. The default whitelisted origins are "http://" and "https://".

    diff --git a/docs/0.56/webview/index.html b/docs/0.56/webview/index.html index 148a2fcd825..189b24f6b90 100644 --- a/docs/0.56/webview/index.html +++ b/docs/0.56/webview/index.html @@ -272,6 +272,7 @@

    originWhitelist

    +

    List of origin strings to allow being navigated to. The strings allow wildcards and get matched against just the origin (not the full URL). If the user taps to navigate to a new page but the new page is not in this whitelist, the URL will be handled by the OS. The default whitelisted origins are "http://" and "https://".

    diff --git a/docs/0.57/asyncstorage.html b/docs/0.57/asyncstorage.html index 30b68aabae2..56ff6cbbc05 100644 --- a/docs/0.57/asyncstorage.html +++ b/docs/0.57/asyncstorage.html @@ -1,4 +1,4 @@ -AsyncStorage · React Native
    Edit

    AsyncStorage

    AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    +
    Edit

    AsyncStorage

    AsyncStorage is an unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    It is recommended that you use an abstraction on top of AsyncStorage instead of AsyncStorage directly for anything more than light usage since it operates globally.

    On iOS, AsyncStorage is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, AsyncStorage will use either RocksDB or SQLite based on what is available.

    -

    The AsyncStorage JavaScript code is a simple facade that provides a clear JavaScript API, real Error objects, and simple non-multi functions. Each method in the API returns a Promise object.

    +

    The AsyncStorage JavaScript code is a facade that provides a clear JavaScript API, real Error objects, and non-multi functions. Each method in the API returns a Promise object.

    Importing the AsyncStorage library:

    import { AsyncStorage } from "react-native"
     
    diff --git a/docs/0.57/asyncstorage/index.html b/docs/0.57/asyncstorage/index.html index 30b68aabae2..56ff6cbbc05 100644 --- a/docs/0.57/asyncstorage/index.html +++ b/docs/0.57/asyncstorage/index.html @@ -1,4 +1,4 @@ -AsyncStorage · React Native
    Edit

    AsyncStorage

    AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    +
    Edit

    AsyncStorage

    AsyncStorage is an unencrypted, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.

    It is recommended that you use an abstraction on top of AsyncStorage instead of AsyncStorage directly for anything more than light usage since it operates globally.

    On iOS, AsyncStorage is backed by native code that stores small values in a serialized dictionary and larger values in separate files. On Android, AsyncStorage will use either RocksDB or SQLite based on what is available.

    -

    The AsyncStorage JavaScript code is a simple facade that provides a clear JavaScript API, real Error objects, and simple non-multi functions. Each method in the API returns a Promise object.

    +

    The AsyncStorage JavaScript code is a facade that provides a clear JavaScript API, real Error objects, and non-multi functions. Each method in the API returns a Promise object.

    Importing the AsyncStorage library:

    import { AsyncStorage } from "react-native"
     
    diff --git a/docs/0.57/drawerlayoutandroid.html b/docs/0.57/drawerlayoutandroid.html index 67a9d4af239..d3a8662ac80 100644 --- a/docs/0.57/drawerlayoutandroid.html +++ b/docs/0.57/drawerlayoutandroid.html @@ -228,7 +228,7 @@

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.57/drawerlayoutandroid/index.html b/docs/0.57/drawerlayoutandroid/index.html
    index 67a9d4af239..d3a8662ac80 100644
    --- a/docs/0.57/drawerlayoutandroid/index.html
    +++ b/docs/0.57/drawerlayoutandroid/index.html
    @@ -228,7 +228,7 @@
     
     

    drawerBackgroundColor

    -

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    +

    Specifies the background color of the drawer. The default value is white. If you want to set the opacity of the drawer, use rgba. Example:

    return (
       <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
       </DrawerLayoutAndroid>
    diff --git a/docs/0.57/flatlist.html b/docs/0.57/flatlist.html
    index ee60a27a1c7..e333e2a7f4d 100644
    --- a/docs/0.57/flatlist.html
    +++ b/docs/0.57/flatlist.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -231,7 +231,7 @@ class MultiSelectList extends React.PureComponent {

    data

    -

    For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    +

    For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    @@ -310,7 +310,7 @@ class MultiSelectList extends React.PureComponent {

    getItemLayout

    (data, index) => {length: number, offset: number, index: number}
     
    -

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is both efficient and easy to use if you have fixed height items, for example:

    +

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is efficient if you have fixed height items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
    diff --git a/docs/0.57/flatlist/index.html b/docs/0.57/flatlist/index.html
    index ee60a27a1c7..e333e2a7f4d 100644
    --- a/docs/0.57/flatlist/index.html
    +++ b/docs/0.57/flatlist/index.html
    @@ -1,4 +1,4 @@
    -FlatList · React Native
    Edit

    FlatList

    A performant interface for rendering simple, flat lists, supporting the most handy features:

    +
    Edit

    FlatList

    A performant interface for rendering basic, flat lists, supporting the most handy features:

    • Fully cross-platform.
    • Optional horizontal mode.
    • @@ -231,7 +231,7 @@ class MultiSelectList extends React.PureComponent {

    data

    -

    For simplicity, data is just a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    +

    For simplicity, data is a plain array. If you want to use something else, like an immutable list, use the underlying VirtualizedList directly.

    TypeRequired
    @@ -310,7 +310,7 @@ class MultiSelectList extends React.PureComponent {

    getItemLayout

    (data, index) => {length: number, offset: number, index: number}
     
    -

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is both efficient and easy to use if you have fixed height items, for example:

    +

    getItemLayout is an optional optimization that let us skip the measurement of dynamic content if you know the height of items ahead of time. getItemLayout is efficient if you have fixed height items, for example:

      getItemLayout={(data, index) => (
         {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
       )}
    diff --git a/docs/0.57/inputaccessoryview.html b/docs/0.57/inputaccessoryview.html
    index b0183b1abea..cb21851de11 100644
    --- a/docs/0.57/inputaccessoryview.html
    +++ b/docs/0.57/inputaccessoryview.html
    @@ -69,7 +69,7 @@
                   }
                 });
             
    Edit

    InputAccessoryView

    A component which enables customization of the keyboard input accessory view on iOS. The input accessory view is displayed above the keyboard whenever a TextInput has focus. This component can be used to create custom toolbars.

    -

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A simple example:

    +

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A basic example:

    Edit

    InputAccessoryView

    A component which enables customization of the keyboard input accessory view on iOS. The input accessory view is displayed above the keyboard whenever a TextInput has focus. This component can be used to create custom toolbars.

    -

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A simple example:

    +

    To use this component wrap your custom toolbar with the InputAccessoryView component, and set a nativeID. Then, pass that nativeID as the inputAccessoryViewID of whatever TextInput you desire. A basic example:

    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

    +
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize basic multi-touch gestures.

    By default, PanResponder holds an InteractionManager handle to block long-running JS events from interrupting active gestures.

    It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

    onPanResponderMove: (event, gestureState) => {}
    @@ -160,7 +160,7 @@
     

    create()

    static create(config)
     
    -

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    +

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state, by replacing the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    • onMoveShouldSetPanResponder: (e, gestureState) => {...}
    • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
    • diff --git a/docs/0.57/panresponder/index.html b/docs/0.57/panresponder/index.html index b00beeea5d5..5172a59a328 100644 --- a/docs/0.57/panresponder/index.html +++ b/docs/0.57/panresponder/index.html @@ -1,4 +1,4 @@ -PanResponder · React Native
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize simple multi-touch gestures.

    +
    Edit

    PanResponder

    PanResponder reconciles several touches into a single gesture. It makes single-touch gestures resilient to extra touches, and can be used to recognize basic multi-touch gestures.

    By default, PanResponder holds an InteractionManager handle to block long-running JS events from interrupting active gestures.

    It provides a predictable wrapper of the responder handlers provided by the gesture responder system. For each handler, it provides a new gestureState object alongside the native event object:

    onPanResponderMove: (event, gestureState) => {}
    @@ -160,7 +160,7 @@
     

    create()

    static create(config)
     
    -

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state. Simply replace the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    +

    @param {object} config Enhanced versions of all of the responder callbacks that provide not only the typical ResponderSyntheticEvent, but also the PanResponder gesture state, by replacing the word Responder with PanResponder in each of the typical onResponder* callbacks. For example, the config object would look like:

    • onMoveShouldSetPanResponder: (e, gestureState) => {...}
    • onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}
    • diff --git a/docs/0.57/scrollview.html b/docs/0.57/scrollview.html index d2f79dc0a72..4711a28ed04 100644 --- a/docs/0.57/scrollview.html +++ b/docs/0.57/scrollview.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    +

    ScrollView renders all its react child components at once.

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -543,6 +543,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.57/scrollview/index.html b/docs/0.57/scrollview/index.html index d2f79dc0a72..4711a28ed04 100644 --- a/docs/0.57/scrollview/index.html +++ b/docs/0.57/scrollview/index.html @@ -69,12 +69,12 @@ } });
    Edit

    ScrollView

    Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

    -

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes easy to debug.

    +

    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 {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.

    Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.

    <ScrollView> vs <FlatList> - which one to use?

    -

    ScrollView simply renders all its react child components at once. That makes it very easy to understand and use.

    +

    ScrollView renders all its react child components at once.

    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.

    -

    This is where FlatList comes into play. FlatList renders items lazily, just when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    +

    This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.

    FlatList 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.

    Props

      @@ -543,6 +543,7 @@ const styles = StyleSheet.create({

      indicatorStyle

      The style of the scroll indicators.

      +
      • 'default' (the default), same as black.
      • 'black', scroll indicator is black. This style is good against a light background.
      • diff --git a/docs/0.57/sectionlist.html b/docs/0.57/sectionlist.html index 5a8f394756d..fdeebefb2b3 100644 --- a/docs/0.57/sectionlist.html +++ b/docs/0.57/sectionlist.html @@ -82,7 +82,7 @@
      • Scroll loading.

      If you don't need section support and want a simpler interface, use <FlatList>.

      -

      Simple Examples:

      +

      Examples:

      // Example 1 (Homogeneous Rendering)
       <SectionList
         renderItem={({item, index, section}) => <Text key={index}>{item}</Text>}
      diff --git a/docs/0.57/sectionlist/index.html b/docs/0.57/sectionlist/index.html
      index 5a8f394756d..fdeebefb2b3 100644
      --- a/docs/0.57/sectionlist/index.html
      +++ b/docs/0.57/sectionlist/index.html
      @@ -82,7 +82,7 @@
       
    • Scroll loading.

    If you don't need section support and want a simpler interface, use <FlatList>.

    -

    Simple Examples:

    +

    Examples:

    // Example 1 (Homogeneous Rendering)
     <SectionList
       renderItem={({item, index, section}) => <Text key={index}>{item}</Text>}
    diff --git a/docs/0.57/vibration.html b/docs/0.57/vibration.html
    index 4f7eae3d057..ec47d0f3180 100644
    --- a/docs/0.57/vibration.html
    +++ b/docs/0.57/vibration.html
    @@ -72,7 +72,7 @@
     

    There will be no effect on devices that do not support Vibration, eg. the simulator.

    Note for Android: add <uses-permission android:name="android.permission.VIBRATE"/> to AndroidManifest.xml

    The vibration duration in iOS is not configurable, so there are some differences with Android. In Android, if pattern is a number, it specifies the vibration duration in ms. If pattern is an array, those odd indices are the vibration duration, while the even ones are the separation time.

    -

    In iOS, invoking vibrate(duration) will just ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    +

    In iOS, invoking vibrate(duration) will ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    Repeatable vibration is also supported, the vibration will repeat with defined pattern until cancel() is called.

    Example:

    const DURATION = 10000
    diff --git a/docs/0.57/vibration/index.html b/docs/0.57/vibration/index.html
    index 4f7eae3d057..ec47d0f3180 100644
    --- a/docs/0.57/vibration/index.html
    +++ b/docs/0.57/vibration/index.html
    @@ -72,7 +72,7 @@
     

    There will be no effect on devices that do not support Vibration, eg. the simulator.

    Note for Android: add <uses-permission android:name="android.permission.VIBRATE"/> to AndroidManifest.xml

    The vibration duration in iOS is not configurable, so there are some differences with Android. In Android, if pattern is a number, it specifies the vibration duration in ms. If pattern is an array, those odd indices are the vibration duration, while the even ones are the separation time.

    -

    In iOS, invoking vibrate(duration) will just ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    +

    In iOS, invoking vibrate(duration) will ignore the duration and vibrate for a fixed time. While the pattern array is used to define the duration between each vibration. See below example for more.

    Repeatable vibration is also supported, the vibration will repeat with defined pattern until cancel() is called.

    Example:

    const DURATION = 10000
    
    TypeRequired