[Docs] Remove sections on AnimationExperimental and Pop
AnimationExperimental has been removed and Pop has been superseded by Animated.
This commit is contained in:
parent
b10a1549c6
commit
4a93d23af2
|
@ -556,79 +556,3 @@ var CustomSceneConfig = Object.assign({}, BaseConfig, {
|
||||||
|
|
||||||
For further information about customizing scene transitions, [read the
|
For further information about customizing scene transitions, [read the
|
||||||
source](https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js).
|
source](https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js).
|
||||||
|
|
||||||
### AnimationExperimental *(Deprecated)*
|
|
||||||
|
|
||||||
As the name would suggest, this was only ever an experimental API and it
|
|
||||||
is **not recommended to use this on your apps**. It has some rough edges
|
|
||||||
and is not under active development. It is built on top of CoreAnimation
|
|
||||||
explicit animations.
|
|
||||||
|
|
||||||
If you choose to use it anyways, here is what you need to know:
|
|
||||||
|
|
||||||
- You will need to include `RCTAnimationExperimental.xcodeproj` and add
|
|
||||||
`libRCTAnimationExperimental.a` to `Build Phases`.
|
|
||||||
- Suited only for static "fire and forget" animations - not continuous gestures.
|
|
||||||
- Hit detection will not work as expected because animations occur on
|
|
||||||
the presentation layer.
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
var AnimationExperimental = require('AnimationExperimental');
|
|
||||||
|
|
||||||
var App = React.createClass({
|
|
||||||
componentDidMount() {
|
|
||||||
AnimationExperimental.startAnimation(
|
|
||||||
{
|
|
||||||
node: this._box,
|
|
||||||
duration: 1000,
|
|
||||||
easing: 'easeInOutBack',
|
|
||||||
property: 'scaleXY',
|
|
||||||
toValue: { x: 1, y: 1 },
|
|
||||||
},
|
|
||||||
);
|
|
||||||
},
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
|
|
||||||
<View ref={component => this._box = component}
|
|
||||||
style={{width: 200, height: 200, backgroundColor: 'red'}} />
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
});
|
|
||||||
```
|
|
||||||
![](/react-native/img/AnimationExperimentalScaleXY.gif)
|
|
||||||
|
|
||||||
Now to demonstrate a known issue, and one of the reasons why it is
|
|
||||||
recommended not to use `AnimationExperimental` currently, let's try to
|
|
||||||
animate `opacity` from 1 to 0.5:
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
AnimationExperimental.startAnimation(
|
|
||||||
{
|
|
||||||
node: this._box,
|
|
||||||
duration: 1000,
|
|
||||||
easing: 'easeInOutBack',
|
|
||||||
property: 'opacity',
|
|
||||||
fromValue: 1,
|
|
||||||
toValue: 0.5,
|
|
||||||
},
|
|
||||||
);
|
|
||||||
```
|
|
||||||
|
|
||||||
![](/react-native/img/AnimationExperimentalOpacity.gif)
|
|
||||||
|
|
||||||
### Pop *(Unsupported, not recommended)*
|
|
||||||
|
|
||||||
[Facebook Pop](https://github.com/facebook/pop) "supports spring and
|
|
||||||
decay dynamic animations, making it useful for building realistic,
|
|
||||||
physics-based interactions."
|
|
||||||
|
|
||||||
This is not officially supported or recommended because the direction is
|
|
||||||
to move towards JavaScript-driven animations, but if you must use it,
|
|
||||||
you can find the code to integrate with React Native
|
|
||||||
[here](https://github.com/facebook/react-native/issues/1365#issuecomment-104792251).
|
|
||||||
Please do not open questions specific to Pop on the React Native issues,
|
|
||||||
StackOverflow is a better place to answer those questions as it is not
|
|
||||||
considered to be part of the core.
|
|
||||||
|
|
Loading…
Reference in New Issue