react native layout animation code example
Example 1: react native layout animation
import React, {Component} from 'react';
import {View, Text, TouchableOpacity, Platform, UIManager} from 'react-native';
if (
Platform.OS === 'android' &&
UIManager.setLayoutAnimationEnabledExperimental
) {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
class AnimatedCollapsible extends React.Component {
state = {expanded: false};
render() {
return (
<View style={{overflow: 'hidden'}}>
<TouchableOpacity
onPress={() => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
this.setState({expanded: !this.state.expanded});
}}>
<Text>
Press me to {this.state.expanded ? 'collapse' : 'expand'}!
</Text>
</TouchableOpacity>
{this.state.expanded && <Text>I disappear sometimes!</Text>}
</View>
);
}
}
Example 2: react native layout animation android
if (Platform.OS === 'android') {
if (UIManager.setLayoutAnimationEnabledExperimental) {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
}