React Native Animation(动画)在Android上不起作用

时间:2018-09-19 08:41:05

标签: android react-native animation

在尝试调用屏幕键盘时使图像动画缩小(请参见下面的代码)。它可以在IOS上运行,但不能在Android上运行:(

我已经在网上搜索了解决方案,但到目前为止没有任何效果。有什么建议吗?

预先感谢

constructor(props) {
  super(props);

  this.imageSize = new Animated.Value(imageSizeNormal);
}

componentWillMount() {
    this.keyboardWillShowSub = Keyboard.addListener('keyboardWillShow', this.keyboardWillShow);
    this.keyboardWillHideSub = Keyboard.addListener('keyboardWillHide', this.keyboardWillHide);
}

componentWillUnmount() {
    this.keyboardWillShowSub.remove();
    this.keyboardWillHideSub.remove();
}

keyboardWillShow = (event) => {
    Animated.timing(this.imageSize, {
        toValue: imageSizeSmall
    }).start();
};


keyboardWillHide = (event) => {
    Animated.timing(this.imageSize, {
        toValue: imageSize
    }).start();
};


render() {
    return (
      <Animated.Image 
         source={require('../../assets/circle.png')} 
         resizeMode="contain"
         style={[styles.logo, { height: this.imageSize, width: this.imageSize}]}
       />
    )
}


const imageSizeNormal = Dimensions.get("window").width/2;

const imageSizeSmall = Dimensions.get("window").width/4;

1 个答案:

答案 0 :(得分:0)

这是我解决的方式。

我要做的第一件事是将关键字“ keyboardWill ...”更改为“ keyboardDid ...””

第二,我将以下内容添加到AndroidManifest.xml

    android:fitsSystemWindows="true"
    android:windowSoftInputMode="adjustResize"

来源:

windowSoftInputMode="adjustResize" not working with translucent action/navbar

https://medium.freecodecamp.org/how-to-make-your-react-native-app-respond-gracefully-when-the-keyboard-pops-up-7442c1535580