ReactNative视图的动画宽度不起作用

时间:2018-05-07 10:09:40

标签: react-native

我想在React Native中为视图的宽度更改设置动画。它是theWidth下面的值:

class MyView extends Component {

  state = {
    theWidth: new Animated.Value(10),
  }

  compontentDidMount() {
    Animated.timing(
      this.state.theWidth,
      {
        toValue: 100,
        duration: 10000,
      }
    ).start();
  }
  render() {
    let { theWidth } = this.state;
    return (
      <Animated.View
        style={{
          ...this.props.style,
          width: theWidth,
        }}
      >
        {this.props.children}

      </Animated.View>
    );
  }
}

export default class HomeScreen extends Component {
  render() {

    return (
      <View style={styles.container}>
        <MyView style={{ width: 550, height: 50, backgroundColor: 'red' }}>
          <Text style={{ fontSize: 28, textAlign: 'center', margin: 10 }}>Fa2ding in1</Text>
        </MyView>
      </View>
    );
  }
}

似乎宽度值(theWidth)没有改变。如何调试?

0 个答案:

没有答案