Component <View animation={'xxx.animation'}> Not working in android however in IOS works

[rolignu2]

Hi ,

My problem is in android Component

import {View} from 'react-native-animatable';

<View
animation={this.props.hide !== undefined ? this.props.hide == true ? "bounceOutRight" : "bounceInRight" : "pulse" } iterationCount={1} duration = {500} delay={100} >

when the props change , does different animation , but in the first render does nothing. i delete the view animatable and shows the component, i dont now what is the mistake, please help me to fixed

"dependencies": { "binary-search-tree": "^0.2.6", "connect": "^3.6.6", "dev-tools": "^0.1.6", "link": "^0.1.5", "native-base": "^2.3.10", "prop-types": "^15.6.1", "react": "^16.3.0-alpha.1", "react-native": "0.54.2", "react-native-animatable": "^1.2.4", "react-native-device-info": "^0.21.2", "react-native-fbsdk": "^0.7.0", "react-native-fetch-polyfill": "^1.1.2", "react-native-linear-gradient": "^2.4.0", "react-native-loading-placeholder": "0.0.6", "react-native-restart": "0.0.6", "react-native-router-flux": "^4.0.0-beta.28", "react-native-ui-kitten": "^3.0.0", "react-native-vector-icons": "^4.5.0", "react-navigation": "^1.5.8", "realm": "^2.3.1", "util": "^0.10.3" }, "devDependencies": { "babel-jest": "23.0.0-alpha.0", "babel-preset-react-native": "4.0.0", "jest": "22.4.2", "react-test-renderer": "^16.3.0-alpha.1" },

[BigPun86]

@rolignu2 did you solve this issue? i have the same problem. When i use any animation it wont work and i dont see the View component

[BigPun86]

@rolignu2 never mind i found the issue. i had to wrap my Animatable.View component as children instead of top root...

Wrong:

<Animatable.View animation={'fadeIn'}>
  <TouchableOpacity style={styles.buttonSaveContainer} onPress={this.props.onCreateChild}>
    <Text style={styles.buttonText}>{translate('U|save')}</Text>
  </TouchableOpacity>
</Animatable.View>

Correct:

<TouchableOpacity style={styles.buttonSaveContainer} onPress={this.props.onCreateChild}>
  <Animatable.View animation={'fadeIn'}>
    <Text style={styles.buttonText}>{translate('U|save')}</Text>
  </Animatable.View>
</TouchableOpacity>

[osiellima]

I have the same problem. @BigPun86 solution doesn't solve my problem. When I use animation this way: <Animatable.View animation="lightSpeedIn"> the view dissapear in android. In iOS works perfectly.

[Frank1234]

what if you add "useNativeDriver"