2016-05-30 4 views
2

私はキャンバスの周りにオブジェクトをドラッグできるだけでなく、実際のキャンバス '背景'をドラッグしてページ全体をスクロールする必要があるプロジェクトに取り組んでいる私PIXIスプライトは、私はここでこの男の成果を踏襲:PIXI - Androidデバイスで動作しないpreventDefaultタッチイベントを無効にする

https://github.com/pixijs/pixi.js/issues/2483を:

をデフォルトでは、ピクシーキャンバス/表示領域は、それを含む Webページをスクロールするために使用することはできません。これはタッチスクリーン上で重要です。 (例えば、 の残りのウェブページを使用してPixiキャンバスをピンチズームすると、 はキャンバス以外の領域がないため、トラップされてズームアウト(またはパンニング)することができない あなたのピンチジェスチャーを と "つかむ"ためのページの)。

この機能を有効にするには、autoPreventDefaultを使用します。しかし、 には、スクロール/ピンチズーム操作のような望ましくない副作用があります。 のような方法で「タップ」またはクリックを登録するキャンバス上の 。それを回避するには

(すなわち。私はピクシーキャンバスと相互作用しないその点、 で外ページをズームやスクロールしようとしています)、私は適用することができます ピクシーの私自身のカスタムバージョンを変更してコンパイルより細かい方法でpreventDefault ...

ページスクロール機能を使用するには、InteractionManager.prototype.onTouchEnd 機能で preventDefaultする必要があるようです。 autoPreventDefaultは、3以外でも のデフォルトを無効にします。 (onMouseDown、onTouchMove、onTouchStart)。

autoPreventDefault = falseのままにして、preventDefaultをonTouchEndの にのみ適用すると、私に必要な機能が提供されます。しかし、 では、この方法でPixiをカスタマイズして再構築する必要はありません。 (申し訳ありませんが 私はここに欠けている何か他のものがあります場合。私は完全に はピクシーでイベントシステムを理解していないか、またはこの スクロールタッチ問題について他に何をすべきか)

だから私無効E。 'onTouchStart'と 'onMouseMove'のpreventDefault()はonTouchEndのままにします。

これはIOSデバイスでは機能しますが、Androidでは使用できません。唯一の例外はAdblockブラウザを使用しているSamsung A7 )。

これについては本当に助かります。

TLDR:onTouchStartとONMOUSEMOVEにPIXI's e.preventDefaultを無効に

は、IOSデバイス上で動作し、私はAndroidデバイス上の周りではなく、私のキャンバスをdragginしてページをスクロールすることができます。

答えて

1

renderer.plugins.interaction.autoPreventDefault=trueを使用するとすべきことです。そのため

0

私のソリューションは、これは、iOSとAndroid上で動作するはず

renderer.plugins.interaction.autoPreventDefault = false 

を使用することでした。 autoPreventDefaultのドキュメントは、次のようになっています。

デフォルトのブラウザアクションは、自動的に無効にする必要があります。

PIXI 4.5.6を使用しています。 ドキュメントをご覧ください: http://pixijs.download/dev/docs/PIXI.CanvasRenderer.html#plugins http://pixijs.download/dev/docs/PIXI.interaction.InteractionManager.html

関連する問題