リアクションネイティブマップ（Airbnb）+マーカーアニメーション

Question

React-native-maps {Google}マーカーをアニメーション化したいと思います。

アニメーションモジュールを試しましたが、マーカーでは複雑なスタイルは使用できません。

よう?,マーカーの座標を変更し、それをアニメーションを与えるために任意の機能があります：

marker.setAnimation(google.maps.Animation.BOUNCE); 

私は試してみました：

<MapView.Marker.Animated> 

しかし、私は効果を作成することはできません。座標をアニメーションドロップとして編集する関数はありますか？

Answer 1

ネイティブマップマーカーは、デフォルトでは「アニメーション化されていません」と表示され、gif画像、スプライト、アニメーションAPIなどを受け入れることはできません。 。しかし、私はそれをイメージ遷移を通して厳しい方法でアニメーション化することができました。ここに私の例があります：

constructor(props, context) { 
    super(props, context); 
    this.state = { 
    startTransition: 1, 
    endTransition: 4, 
    }; 
} 

componentDidMount() { 
    this.animate(); 
} 

animate() { 
    const {startTransition, endTransition} = this.state; 
    if(startTransition < endTransition){ 
    let currentTransition = startTransition + 1; 
    this.setState({startTransition: currentTransition}); 
    } else { 
    this.setState({startTransition: 1}); 
    } 
    let x = setTimeout(()=>{ 
    this.animate() 
    }, 500); 
} 

renderImg(imgTrans) { 
    if(imgTrans === 1) { 
    return require('./walk1.png'); 
    } 
    if(imgTrans === 2) { 
    return require('./walk2.png'); 
    } 
    if(imgTrans === 3) { 
    return require('./walk3.png'); 
    } 
    if(imgTrans === 4) { 
    return require('./walk4.png'); 
    } 
} 

render() { 
    const {startTransition} = this.state; 
    return (
    <MapView.Marker 
     coordinate={tapCoords} 
     image={this.renderImg(startTransition)} 
    > 
) 
} 

これは私が今アニメーションをした方法です。