問題タブ [react-native-gesture-handler]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - react-native-gesture-handler から PanGestureHandler を使用しているときに位置が 0 にリセットされる
の非常に簡単な例を示しPanGestureHandler
ました。初めてボックスを移動すると、ボックスはある位置に移動し、その位置にとどまります。しかし、もう一度動かそうとすると、元の位置からではなく、ゼロの位置から始まります。
どんな助けでも大歓迎です。
編集
これは、オフセットがリセットされるために発生することに気付きました。
react-native - React Native では、アニメーション ビューをスケーリングするときに変換値を調整して、スケーリングが任意の点に原点があるように見えるようにするにはどうすればよいですか?
私はPanGestureHandler
とPinchGestureHandler
を使用して、画面上で大きな画像をパンおよびズームイン/ズームアウトできるようにしています。ただし、スケーリング変換を導入すると、パンの動作が異なります。
この実装には 3 つの目標があります。
- ビューが最初に読み込まれたときに、特定の高さに合わせて画像を縮小しようとしています。これは、ユーザーができるだけ多くの画像を見ることができるようにするためです。画像にスケール変換のみを適用する場合、 の平行移動値は
0
画像を左上隅に配置しません (中央のスケール原点の結果として)。 - 誰かがピンチ ジェスチャを使用してズームしたときに、ズームの原点がユーザーがジェスチャを開始した時点にあるかのように見えるように、変換値も調整されるようにしようとしています (React Native は現在、スケール変換の中心原点)。これを達成するには、ユーザーがズームしたときに移動値を調整する必要があると思います (スケールが 以外の場合
1
)。 - ズーム後にパンするとき、ズームからのスケールに関連する移動値を調整することにより、パンがユーザーの指を (速く/遅く移動するのではなく) 追跡するようにします。
これが私がこれまでに持っているものです:
平行移動値から寸法の差を差し引く方法に沿って何かを試しました。
この実装では数値がうまく機能しないため、おそらくこれを正しく行っていません。また、これは私の最初の目標のみを説明するものであり、他の 2 つを達成するには、スケール値に基づいて変換値を補間するようなことを行う必要があると推測しています。