Animated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
Animated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-
-
- This can easily be done by modifying
stylein the example above like so:
+ - This can be done by modifying
stylein the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
Animated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
Animated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-
-
- This can easily be done by modifying
stylein the example above like so:
+ - This can be done by modifying
stylein the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
AsyncStorage
AsyncStorage is a simple, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
+AsyncStorage
AsyncStorage is an 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.
-This JS code is a simple facade over the native iOS implementation to provide a clear JS API, real Error objects, and simple non-multi functions. Each method returns a Promise object.
This JS code is a facade over the native iOS implementation to provide a clear JS API, real Error objects, and non-multi functions. Each method returns a Promise object.
Methods
getItem
diff --git a/docs/0.23/asyncstorage/index.html b/docs/0.23/asyncstorage/index.html
index 47cb2c7c8fc..8a1e5087951 100644
--- a/docs/0.23/asyncstorage/index.html
+++ b/docs/0.23/asyncstorage/index.html
@@ -1,4 +1,4 @@
-
AsyncStorage
AsyncStorage is a simple, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
+AsyncStorage
AsyncStorage is an 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.
-This JS code is a simple facade over the native iOS implementation to provide a clear JS API, real Error objects, and simple non-multi functions. Each method returns a Promise object.
This JS code is a facade over the native iOS implementation to provide a clear JS API, real Error objects, and non-multi functions. Each method returns a Promise object.
Methods
getItem
diff --git a/docs/0.23/dimensions.html b/docs/0.23/dimensions.html
index b6f07eef5af..d107e4f14ab 100644
--- a/docs/0.23/dimensions.html
+++ b/docs/0.23/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.23/dimensions/index.html b/docs/0.23/dimensions/index.html
index b6f07eef5af..d107e4f14ab 100644
--- a/docs/0.23/dimensions/index.html
+++ b/docs/0.23/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.23/easing.html b/docs/0.23/easing.html
index 4dd636d41e3..628da57f5ca 100644
--- a/docs/0.23/easing.html
+++ b/docs/0.23/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.23/easing/index.html b/docs/0.23/easing/index.html
index 4dd636d41e3..628da57f5ca 100644
--- a/docs/0.23/easing/index.html
+++ b/docs/0.23/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.23/scrollview.html b/docs/0.23/scrollview.html
index 7662e0c85f3..3296b15cf9b 100644
--- a/docs/0.23/scrollview.html
+++ b/docs/0.23/scrollview.html
@@ -69,7 +69,7 @@
}
});
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.
Props
-
@@ -427,6 +427,7 @@
default(the default), same asblack.black, scroll indicator is black. This style is good against a white content background.
@@ -440,6 +441,7 @@
indicatorStyle
The style of the scroll indicators.
+maximumZoomScale
The maximum allowed zoom scale. The default value is 1.0.
diff --git a/docs/0.23/scrollview/index.html b/docs/0.23/scrollview/index.html index 7662e0c85f3..3296b15cf9b 100644 --- a/docs/0.23/scrollview/index.html +++ b/docs/0.23/scrollview/index.html @@ -69,7 +69,7 @@ } });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.
Props
-
@@ -427,6 +427,7 @@
default(the default), same asblack.black, scroll indicator is black. This style is good against a white content background.
@@ -440,6 +441,7 @@
indicatorStyle
The style of the scroll indicators.
+maximumZoomScale
The maximum allowed zoom scale. The default value is 1.0.
diff --git a/docs/0.23/textinput.html b/docs/0.23/textinput.html index 692d4918c84..70c5ff67985 100644 --- a/docs/0.23/textinput.html +++ b/docs/0.23/textinput.html @@ -69,7 +69,7 @@ } });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. An example:
<TextInput
style={{height: 40, borderColor: 'gray', borderWidth: 1}}
onChangeText={(text) => this.setState({text})}
@@ -179,7 +179,7 @@
defaultValue
-Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you don't 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 don't want to deal with listening to events and updating the value prop to keep the controlled state in sync.
Type Required
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.
Type Required EditTextInput
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. An example:
<TextInput
style={{height: 40, borderColor: 'gray', borderWidth: 1}}
onChangeText={(text) => this.setState({text})}
@@ -179,7 +179,7 @@
defaultValue
-Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you don't 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 don't want to deal with listening to events and updating the value prop to keep the controlled state in sync.
Type Required
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.
Type Required Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.24/animated/index.html b/docs/0.24/animated/index.html
index 236f61d271e..e1d4ff6b370 100644
--- a/docs/0.24/animated/index.html
+++ b/docs/0.24/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.24/asyncstorage.html b/docs/0.24/asyncstorage.html
index 124990504e7..b01f3d523f6 100644
--- a/docs/0.24/asyncstorage.html
+++ b/docs/0.24/asyncstorage.html
@@ -1,4 +1,4 @@
-AsyncStorage · React Native EditAsyncStorage
AsyncStorage is a simple, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
+ EditAsyncStorage
AsyncStorage is an 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.
-This JS code is a simple facade over the native iOS implementation to provide a clear JS API, real Error objects, and simple non-multi functions. Each method returns a Promise object.
+This JS code is a facade over the native iOS implementation to provide a clear JS API, real Error objects, and non-multi functions. Each method returns a Promise object.
Methods
getItemAsyncStorage · React Native
EditAsyncStorage
AsyncStorage is a simple, asynchronous, persistent, key-value storage system that is global to the app. It should be used instead of LocalStorage.
+ EditAsyncStorage
AsyncStorage is an 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.
-This JS code is a simple facade over the native iOS implementation to provide a clear JS API, real Error objects, and simple non-multi functions. Each method returns a Promise object.
+This JS code is a facade over the native iOS implementation to provide a clear JS API, real Error objects, and non-multi functions. Each method returns a Promise object.
Methods
getItem
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.24/dimensions/index.html b/docs/0.24/dimensions/index.html
index 5ccc5fc51a4..1611f0b020c 100644
--- a/docs/0.24/dimensions/index.html
+++ b/docs/0.24/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.24/easing.html b/docs/0.24/easing.html
index e095bc54c1a..69a8deb9c46 100644
--- a/docs/0.24/easing.html
+++ b/docs/0.24/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.24/easing/index.html b/docs/0.24/easing/index.html
index e095bc54c1a..69a8deb9c46 100644
--- a/docs/0.24/easing/index.html
+++ b/docs/0.24/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.25/animated.html b/docs/0.25/animated.html
index b284f517ba3..40219b163a1 100644
--- a/docs/0.25/animated.html
+++ b/docs/0.25/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.25/animated/index.html b/docs/0.25/animated/index.html
index b284f517ba3..40219b163a1 100644
--- a/docs/0.25/animated/index.html
+++ b/docs/0.25/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.25/dimensions.html b/docs/0.25/dimensions.html
index ffeb9ac48ec..34f8bf5195c 100644
--- a/docs/0.25/dimensions.html
+++ b/docs/0.25/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.25/dimensions/index.html b/docs/0.25/dimensions/index.html
index ffeb9ac48ec..34f8bf5195c 100644
--- a/docs/0.25/dimensions/index.html
+++ b/docs/0.25/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.25/easing.html b/docs/0.25/easing.html
index fdefb803982..d8b7988f610 100644
--- a/docs/0.25/easing.html
+++ b/docs/0.25/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.25/easing/index.html b/docs/0.25/easing/index.html
index fdefb803982..d8b7988f610 100644
--- a/docs/0.25/easing/index.html
+++ b/docs/0.25/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.26/animated.html b/docs/0.26/animated.html
index ac5864b68d8..aa8ccabca6d 100644
--- a/docs/0.26/animated.html
+++ b/docs/0.26/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.26/animated/index.html b/docs/0.26/animated/index.html
index ac5864b68d8..aa8ccabca6d 100644
--- a/docs/0.26/animated/index.html
+++ b/docs/0.26/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.26/dimensions.html b/docs/0.26/dimensions.html
index 18140f882b2..4096d92b56c 100644
--- a/docs/0.26/dimensions.html
+++ b/docs/0.26/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.26/dimensions/index.html b/docs/0.26/dimensions/index.html
index 18140f882b2..4096d92b56c 100644
--- a/docs/0.26/dimensions/index.html
+++ b/docs/0.26/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.26/easing.html b/docs/0.26/easing.html
index ad86ec4d8d0..21a57dff2d5 100644
--- a/docs/0.26/easing.html
+++ b/docs/0.26/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.26/easing/index.html b/docs/0.26/easing/index.html
index ad86ec4d8d0..21a57dff2d5 100644
--- a/docs/0.26/easing/index.html
+++ b/docs/0.26/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.27/animated.html b/docs/0.27/animated.html
index a247e24b421..f73b801696e 100644
--- a/docs/0.27/animated.html
+++ b/docs/0.27/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.27/animated/index.html b/docs/0.27/animated/index.html
index a247e24b421..f73b801696e 100644
--- a/docs/0.27/animated/index.html
+++ b/docs/0.27/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.27/dimensions.html b/docs/0.27/dimensions.html
index 4da21e6bca0..17e7bdbfa7c 100644
--- a/docs/0.27/dimensions.html
+++ b/docs/0.27/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.27/dimensions/index.html b/docs/0.27/dimensions/index.html
index 4da21e6bca0..17e7bdbfa7c 100644
--- a/docs/0.27/dimensions/index.html
+++ b/docs/0.27/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.27/easing.html b/docs/0.27/easing.html
index 1f106256639..a5cd4646ea1 100644
--- a/docs/0.27/easing.html
+++ b/docs/0.27/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.27/easing/index.html b/docs/0.27/easing/index.html
index 1f106256639..a5cd4646ea1 100644
--- a/docs/0.27/easing/index.html
+++ b/docs/0.27/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.28/animated.html b/docs/0.28/animated.html
index 6b65d0f6660..3d047b514f0 100644
--- a/docs/0.28/animated.html
+++ b/docs/0.28/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.28/animated/index.html b/docs/0.28/animated/index.html
index 6b65d0f6660..3d047b514f0 100644
--- a/docs/0.28/animated/index.html
+++ b/docs/0.28/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.28/dimensions.html b/docs/0.28/dimensions.html
index 7e3f1444733..d649244ec56 100644
--- a/docs/0.28/dimensions.html
+++ b/docs/0.28/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.28/dimensions/index.html b/docs/0.28/dimensions/index.html
index 7e3f1444733..d649244ec56 100644
--- a/docs/0.28/dimensions/index.html
+++ b/docs/0.28/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.28/easing.html b/docs/0.28/easing.html
index 0632b573896..a260175bc79 100644
--- a/docs/0.28/easing.html
+++ b/docs/0.28/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.28/easing/index.html b/docs/0.28/easing/index.html
index 0632b573896..a260175bc79 100644
--- a/docs/0.28/easing/index.html
+++ b/docs/0.28/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.29/animated.html b/docs/0.29/animated.html
index 71953b8c1e2..ea8c53b49e8 100644
--- a/docs/0.29/animated.html
+++ b/docs/0.29/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.29/animated/index.html b/docs/0.29/animated/index.html
index 71953b8c1e2..ea8c53b49e8 100644
--- a/docs/0.29/animated/index.html
+++ b/docs/0.29/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.29/dimensions.html b/docs/0.29/dimensions.html
index 7d6cecf62ac..dc7bd2b25a7 100644
--- a/docs/0.29/dimensions.html
+++ b/docs/0.29/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.29/dimensions/index.html b/docs/0.29/dimensions/index.html
index 7d6cecf62ac..dc7bd2b25a7 100644
--- a/docs/0.29/dimensions/index.html
+++ b/docs/0.29/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.29/easing.html b/docs/0.29/easing.html
index f40935cfba6..2b962e9245a 100644
--- a/docs/0.29/easing.html
+++ b/docs/0.29/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.29/easing/index.html b/docs/0.29/easing/index.html
index f40935cfba6..2b962e9245a 100644
--- a/docs/0.29/easing/index.html
+++ b/docs/0.29/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.30/animated.html b/docs/0.30/animated.html
index 3cd222641ef..b49efec8c05 100644
--- a/docs/0.30/animated.html
+++ b/docs/0.30/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.30/animated/index.html b/docs/0.30/animated/index.html
index 3cd222641ef..b49efec8c05 100644
--- a/docs/0.30/animated/index.html
+++ b/docs/0.30/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.30/dimensions.html b/docs/0.30/dimensions.html
index bd94fba90b9..b35bcf537c8 100644
--- a/docs/0.30/dimensions.html
+++ b/docs/0.30/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.30/dimensions/index.html b/docs/0.30/dimensions/index.html
index bd94fba90b9..b35bcf537c8 100644
--- a/docs/0.30/dimensions/index.html
+++ b/docs/0.30/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.30/easing.html b/docs/0.30/easing.html
index e59da68d229..de34f428786 100644
--- a/docs/0.30/easing.html
+++ b/docs/0.30/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.30/easing/index.html b/docs/0.30/easing/index.html
index e59da68d229..de34f428786 100644
--- a/docs/0.30/easing/index.html
+++ b/docs/0.30/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.31/animated.html b/docs/0.31/animated.html
index 3e5cc8e5273..369f8640c1b 100644
--- a/docs/0.31/animated.html
+++ b/docs/0.31/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.31/animated/index.html b/docs/0.31/animated/index.html
index 3e5cc8e5273..369f8640c1b 100644
--- a/docs/0.31/animated/index.html
+++ b/docs/0.31/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.31/dimensions.html b/docs/0.31/dimensions.html
index 7cd818c8ded..4d82fb9bc2e 100644
--- a/docs/0.31/dimensions.html
+++ b/docs/0.31/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.31/dimensions/index.html b/docs/0.31/dimensions/index.html
index 7cd818c8ded..4d82fb9bc2e 100644
--- a/docs/0.31/dimensions/index.html
+++ b/docs/0.31/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.31/easing.html b/docs/0.31/easing.html
index ec07d8a545a..4c12a04a59a 100644
--- a/docs/0.31/easing.html
+++ b/docs/0.31/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.31/easing/index.html b/docs/0.31/easing/index.html
index ec07d8a545a..4c12a04a59a 100644
--- a/docs/0.31/easing/index.html
+++ b/docs/0.31/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.32/animated.html b/docs/0.32/animated.html
index 8d2f6ecb83a..9437ceae877 100644
--- a/docs/0.32/animated.html
+++ b/docs/0.32/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.32/animated/index.html b/docs/0.32/animated/index.html
index 8d2f6ecb83a..9437ceae877 100644
--- a/docs/0.32/animated/index.html
+++ b/docs/0.32/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.32/dimensions.html b/docs/0.32/dimensions.html
index 049af01b4ce..cd00cb3f670 100644
--- a/docs/0.32/dimensions.html
+++ b/docs/0.32/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.32/dimensions/index.html b/docs/0.32/dimensions/index.html
index 049af01b4ce..cd00cb3f670 100644
--- a/docs/0.32/dimensions/index.html
+++ b/docs/0.32/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.32/easing.html b/docs/0.32/easing.html
index 226580e231c..4f15fab18ab 100644
--- a/docs/0.32/easing.html
+++ b/docs/0.32/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.32/easing/index.html b/docs/0.32/easing/index.html
index 226580e231c..4f15fab18ab 100644
--- a/docs/0.32/easing/index.html
+++ b/docs/0.32/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.33/animated.html b/docs/0.33/animated.html
index b054aea05ab..a93ee07250d 100644
--- a/docs/0.33/animated.html
+++ b/docs/0.33/animated.html
@@ -1,4 +1,4 @@
-Animated · React Native
EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.33/animated/index.html b/docs/0.33/animated/index.html
index b054aea05ab..a93ee07250d 100644
--- a/docs/0.33/animated/index.html
+++ b/docs/0.33/animated/index.html
@@ -1,4 +1,4 @@
-Animated · React Native EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid, powerful, and easy to build and maintain.
+ EditAnimated
Animations are an important part of modern UX, and the Animated library is designed to make them fluid and powerful.
The simplest workflow is to create an Animated.Value, hook it up to one or more style attributes of an animated component, and then drive updates either via animations, such as Animated.timing, or by hooking into gestures like panning or scrolling via Animated.event. Animated.Value can also bind to props other than style, and can be interpolated as well. Here is a basic example of a container view that will fade in when it's mounted:
class FadeInView extends React.Component {
constructor(props) {
@@ -86,7 +86,7 @@
}
render() {
return (
- <Animated.View // Special animatable View
+ <Animated.View // Animatable View
style={{opacity: this.state.fadeAnim}}>
{' '}
// Binds
@@ -96,12 +96,12 @@
}
}
-Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. 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.
+Note that only animatable components can be animated. View, Text, and Image are already provided, and you can create custom ones with createAnimatedComponent. These 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.
Animations are heavily configurable. Custom and pre-defined easing functions, delays, durations, decay factors, spring constants, and more can all be tweaked depending on the type of animation.
A single Animated.Value can drive any number of properties, and each property can be run through an interpolation first. An interpolation maps input ranges to output ranges, typically using a linear interpolation but also supports easing functions. By default, it will extrapolate the curve beyond the ranges given, but you can also have it clamp the output value.
For example, you may want to think about your Animated.Value as going from 0 to 1, but animate the position from 150px to 0px and the opacity from 0 to
-- This can easily be done by modifying
style in the example above like so:
+- This can be done by modifying
style in the example above like so:
style={{
opacity: this.state.fadeAnim, // Binds directly
@@ -113,7 +113,7 @@
}],
}}>
-Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together simply by setting the toValue of one animation to be another Animated.Value.
+Animations can also be combined in complex ways using composition functions such as sequence and parallel, and can also be chained together by setting the toValue of one animation to be another Animated.Value.
Animated.ValueXY is handy for 2D animations, like panning, and there are other helpful additions like setOffset and getLayout to aid with typical interaction patterns, like drag-and-drop.
You can see more example usage in AnimationExample.js, the Gratuitous Animation App, and Animations documentation guide.
Note that Animated is designed to be fully serializable so that animations can be run in a high performance way, independent of the normal JavaScript event loop. This does influence the API, so keep that in mind when it seems a little trickier to do something compared to a fully synchronous system. Checkout Animated.Value.addListener as a way to work around some of these limitations, but use it sparingly since it might have performance implications in the future.
diff --git a/docs/0.33/dimensions.html b/docs/0.33/dimensions.html
index 770166431c6..6687cf50f55 100644
--- a/docs/0.33/dimensions.html
+++ b/docs/0.33/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.33/dimensions/index.html b/docs/0.33/dimensions/index.html
index 770166431c6..6687cf50f55 100644
--- a/docs/0.33/dimensions/index.html
+++ b/docs/0.33/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.33/easing.html b/docs/0.33/easing.html
index 6268e82d000..f4e4e745e38 100644
--- a/docs/0.33/easing.html
+++ b/docs/0.33/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.33/easing/index.html b/docs/0.33/easing/index.html
index 6268e82d000..f4e4e745e38 100644
--- a/docs/0.33/easing/index.html
+++ b/docs/0.33/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.34/dimensions.html b/docs/0.34/dimensions.html
index 44e41694039..7cc57cac994 100644
--- a/docs/0.34/dimensions.html
+++ b/docs/0.34/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.34/dimensions/index.html b/docs/0.34/dimensions/index.html
index 44e41694039..7cc57cac994 100644
--- a/docs/0.34/dimensions/index.html
+++ b/docs/0.34/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.34/easing.html b/docs/0.34/easing.html
index 4d9a8b2f061..024d3423156 100644
--- a/docs/0.34/easing.html
+++ b/docs/0.34/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.34/easing/index.html b/docs/0.34/easing/index.html
index 4d9a8b2f061..024d3423156 100644
--- a/docs/0.34/easing/index.html
+++ b/docs/0.34/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.35/dimensions.html b/docs/0.35/dimensions.html
index e59c1640ba8..692deabe46b 100644
--- a/docs/0.35/dimensions.html
+++ b/docs/0.35/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.35/dimensions/index.html b/docs/0.35/dimensions/index.html
index e59c1640ba8..692deabe46b 100644
--- a/docs/0.35/dimensions/index.html
+++ b/docs/0.35/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.35/easing.html b/docs/0.35/easing.html
index 544b3a8bd39..58a0a04a559 100644
--- a/docs/0.35/easing.html
+++ b/docs/0.35/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.35/easing/index.html b/docs/0.35/easing/index.html
index 544b3a8bd39..58a0a04a559 100644
--- a/docs/0.35/easing/index.html
+++ b/docs/0.35/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.36/dimensions.html b/docs/0.36/dimensions.html
index 574f66f4b34..a098328a90d 100644
--- a/docs/0.36/dimensions.html
+++ b/docs/0.36/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.36/dimensions/index.html b/docs/0.36/dimensions/index.html
index 574f66f4b34..a098328a90d 100644
--- a/docs/0.36/dimensions/index.html
+++ b/docs/0.36/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.36/easing.html b/docs/0.36/easing.html
index 089dbfd61f2..9da660606bc 100644
--- a/docs/0.36/easing.html
+++ b/docs/0.36/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.36/easing/index.html b/docs/0.36/easing/index.html
index 089dbfd61f2..9da660606bc 100644
--- a/docs/0.36/easing/index.html
+++ b/docs/0.36/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.37/dimensions.html b/docs/0.37/dimensions.html
index e92bb152dd8..131d38b1cea 100644
--- a/docs/0.37/dimensions.html
+++ b/docs/0.37/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.37/dimensions/index.html b/docs/0.37/dimensions/index.html
index e92bb152dd8..131d38b1cea 100644
--- a/docs/0.37/dimensions/index.html
+++ b/docs/0.37/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.37/easing.html b/docs/0.37/easing.html
index 15b0661998a..c8c62f4d2e5 100644
--- a/docs/0.37/easing.html
+++ b/docs/0.37/easing.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.37/easing/index.html b/docs/0.37/easing/index.html
index 15b0661998a..c8c62f4d2e5 100644
--- a/docs/0.37/easing/index.html
+++ b/docs/0.37/easing/index.html
@@ -135,7 +135,7 @@
elastic()
static elastic(bounciness)
-A simple elastic interaction, similar to a spring. 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.
+An elastic interaction, similar to a spring. 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.
Wolfram Plots:
http://tiny.cc/elastic_b_1 (default bounciness = 1) http://tiny.cc/elastic_b_3 (bounciness = 3)
diff --git a/docs/0.38/dimensions.html b/docs/0.38/dimensions.html
index 8b20dd1133f..28a9c5717a6 100644
--- a/docs/0.38/dimensions.html
+++ b/docs/0.38/dimensions.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.38/dimensions/index.html b/docs/0.38/dimensions/index.html
index 8b20dd1133f..28a9c5717a6 100644
--- a/docs/0.38/dimensions/index.html
+++ b/docs/0.38/dimensions/index.html
@@ -80,7 +80,7 @@
static set(dims)
This should only be called from native code by sending the didUpdateDimensions event.
-@param {object} dims Simple string-keyed object of dimensions to set
+@param {object} dims string-keyed object of dimensions to set
get()
static get(dim)
diff --git a/docs/0.38/easing.html b/docs/0.38/easing.html
index 6c3c4e9e21a..75592e0b057 100644
--- a/docs/0.38/easing.html
+++ b/docs/0.38/easing.html
@@ -135,7 +135,7 @@