Как отобразить анимацию на кнопке при загрузке экрана в реагирующем режиме?

Question

Как я могу отображать анимацию на кнопке, когда экран загружается в реагирующем родном?

Я хочу применить анимацию на кнопке и отображать ее эффект, когда она загружается на экране. Поэтому, пожалуйста, помогите мне. Как я могу может достигнуть этой функциональности в реагировать родной.

Answer 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>

Answer 2

Используйте эту библиотеку spinner и измените свой флаг в соответствии с ответом API.

Answer 3

Используя react-native-animatable и react-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 и установить iterationCount на 0, когда загрузка завершена