反应原生

时间:2017-10-29 13:11:32

标签: javascript react-native components

我会尽量让我的问题变得清晰。

一般来说,如果它不断变化,我如何获得组件位置属性:left,top etc')?

具体做法是:

我在react-native中创建了一个组件,该组件为其子样式的左侧和顶部属性设置动画(这是为该对象的左侧位置设置动画的组件的代码):

class MovementAnimation extends Component {
  state = {
    moveAnim: new Animated.Value(100),  // Initial value for left: 100
  }

    componentDidMount() {                   //Call the animation
        this.runMovementAnimation()
    }

    runMovementAnimation(){
        var firstPosRand = parseInt(randomize('0', 3)) % 300;
        var secondPosRand = parseInt(randomize('0', 3)) % 300;
        var firstTimeRand = (parseInt(randomize('0',5)) % 3000) + 3000; //Stupid temporary solution to set a number between 500-3500
        var secondTimeRand = (parseInt(randomize('0',5))% 3000) + 3000;   

        Animated.sequence([
            Animated.timing(this.state.moveAnim, {
              toValue: firstPosRand,                   // Animation
              duration: firstTimeRand
            }),
            Animated.timing(this.state.moveAnim, {
              toValue: secondPosRand,
              duration: secondTimeRand
            })
            ]).start(() => this.runMovementAnimation())         // repeat the animation
    }

  render() {
    let { moveAnim } = this.state;

    return (
      <Animated.View  ref='myElement'               // Special animatable View
        style={{
          ...this.props.style,
          left: moveAnim,         // Bind opacity to animated value
        }}
      >
        {this.props.children}
      </Animated.View>
    );
  }
}

现在,在我的主页中,我正在控制一个我用这个动画组件制作的圆形组件,它运行得很好。但是,我想使用这个特定的圆圈“左”属性来控制另一个属性,如何从不同的类中访问它?

提前致谢! 阿米特

0 个答案:

没有答案