1

当屏幕以 react-native 加载时，如何在 Button 上显示动画？

我想在 Button 上应用动画并在它加载到屏幕时显示它的效果。所以请帮助我。我如何在 react-native 中实现此功能。

4

3 回答 3

2

使用此微调按钮库并根据 api 响应更改您的标志。

于 2020-02-11T12:22:44.283 回答
1

使用react-native-animatableandreact-native-button你可以实现一个按钮上的动画，一个简单的表达式如下

<View style={styles.container}>
     <Button onPress={this.onPress}>
          <Animatable.Text 
               animation="pulse"
               easing="ease-out" 
               iterationCount="infinite" 
               style={{ textAlign: 'center', fontSize: 100 }}>
                  OK
         </Animatable.Text>
      </Button>
 </View>

您可以在加载完成时设置 isLoading 的状态并将迭代计数设置为 0

于 2020-02-11T12:34:05.040 回答
1 
<View style={styles.container}>
     <Button onPress={this.onPress}>
{this.state.isLoading ? 
<React.Fragment>
          <Text style={{ textAlign: 'center', fontSize: 100 }}>
                  Loading ...
         </Text>


<ActivityIndicator/>

</React.Fragment> : <Text>Press me <Text>
      </Button>
 </View>
于 2020-02-12T05:15:59.403 回答