在选定的TextButton之间设置动画

import React, { Component } from 'react';
import { Animated, Text, TouchableOpacity } from 'react-native';

class AnimatedButton extends Component {
  constructor(props) {
    super(props);
    this.animatedValue = new Animated.Value(0);
  }
  
  // ...
}

componentDidMount() {
  Animated.timing(this.animatedValue, {
    toValue: 1,
    duration: 1000, // 动画持续时间
    useNativeDriver: true, // 使用原生驱动器以提高性能
  }).start();
}

render() {
  const opacity = this.animatedValue.interpolate({
    inputRange: [0, 1],
    outputRange: [0, 1],
  });
  
  return (
    <Animated.View style={{ opacity }}>
      <TouchableOpacity onPress={this.props.onPress}>
        <TextButton>{this.props.text}</TextButton>
      </TouchableOpacity>
    </Animated.View>
  );
}