これを反応ネイティブでアニメーション化する方法は？

Question

How to make this transform with React-Native?

私はこの位置アニメーションコードの書き方を

Animated.timing(
       this.state.transform, 
       {toValue:[{ perspective: 850 }, 
          { translateX: -width * 0.24 }, 
          { rotateY: '60deg'}]}, 
      ).start(); 

に

constructor(props) { 
     super(props); 
     this.state={ 
      loaded:false, 

      transform:[{ perspective: 0 }, 
         { translateX: width }, 
         { rotateY: '0deg'}], 
      isMenuOpen:false, 
     } 
    } 

アニメイトこの静的な位置をしたいですか？

Answer 1

あなたにはアニメーションを使用することはできませんそんなやり方... Animatedあなたは次のことをする必要がありますリンクを見てください：

<MyComponent style={{ 
      transform:[{ perspective: this.state.anim.interpolate({ 
            inputRange: [0, 1], 
            outputRange: [0, 850], 
        })}, 
        { translateX: this.state.anim.interpolate({ 
            inputRange: [0, 1], 
            outputRange: [width, -width * 0.24], 
        })}, 
        { rotateY: this.state.anim.interpolate({ 
            inputRange: [0, 1], 
            outputRange: ["0deg", "60deg"], 
        })}], 
     }], 
    }}/> 

------ //// ------

  Animated.timing(this.state.anim, { 
       toValue: 1 
      }), 

------ //// --------

constructor(props) { 
     super(props); 
     this.state={ 
      anim: AnimateValue(0) 
     } 
    }