GitHubContentsジェスチャーイベントの使用ジェスチャーイベントのタイプ例ネイティブブラウザのジェスチャーイベントの処理passiveなジェスチャーリスナーを使うPolymerは、特別なユーザーインタラクションに向けて独自の「ジェスチャーイベント」をオプションでサポートしています。ジェスチャーイベントは、タッチ及びマウスの両環境でアップ/ダウン/トラックに関して一貫したイベントを発生させることができ、仕様のmouse-イベントやtouch-イベントに代えて利用されることが推奨されます。これにより、タッチとマウスの両デバイス間で相互運用性が向上します。通常、モバイルブラウザではtapの代わりに、標準のclickを利用します。後方互換を担保するためtapイベントはジェスチャーイベントのミックスインに含まれていますが、最新のモバイルブラウザではもはや必要とされません。ジェスチャーイベントの使用ハイブリッドエレメントを使用する場合は、デフォルトでジェスチャーイベントがサポートされます。Polymer.Elementをベースにクラススタイルで作成したエレメントでは、Polymer.GestureEventListenersミックスインをインポートすることで、ジェスチャサポートを明示的に追加する必要があります。...</script>ジェスチャーイベントにはいくつか追加の設定が必要なため、単純に一般的なaddEventListenerメソッドを用いてリスナーを追加することはできません。ジェスチャーイベントをリッスンするには、:ジェスチャーイベントの一つにアノテーション付イベントリスナーを使用する。me!</div>アノテーション付イベントリスナーを使用した場合、Polymerは自動的にジェスチャーイベントを特別に記録するようになります。this.trackHandler(e));このPolymer.Gestures.addListenerメソッドを使用して、ホストエレメントにリスナーを追加できます。ジェスチャーイベントのタイプサポートされるジェスチャーイベントのタイプは次のとおりです。各タイプについて簡単な説明とevent.detailから取得できる詳細なプロパティを列挙して紹介します。以下の例では、ホストエレメントに対してリスナーを追加するのにPolymer.Gestures.addListenerを使用しています。このようなケースでは、アノテーション付イベントリスナーで設定することができません。DOMの子に対して設定されている場合には、通常、一度追加したイベントリスナーに関してその削除について心配する必要はありません。動的に追加された子にイベントリスナーを設定する場合には、子を削除する時点で、Polymer.Gestures.addListenerによって設定されたイベントリスナーを削除する必要があるかもしれません。これは、子エレメントがガベージコレクトされるようにするためです。</script></dom-module>ネイティブブラウザのジェスチャーイベントの処理ブラウザは、特定のジェスチャーに対するネイティブな処理を実装しており、タッチによるスクロールやユーザーによるピンチジェスチャーによるコンテンツのズームなどをサポートしています。ジェスチャーイベントをリッスンすると、デフォルトではブラウザネイティブなジェスチャー処理は無効になります。trackイベントのリスナーを持つノードは、ブラウザがスクロールやピンチズームのジェスチャーを処理しないようにします。Polymer.Gestures.setTouchAction関数を使用することで、ブラウザがどのイベントをネイティブに処理するか指定できます。ブラウザによる垂直方向のスクロールをサポートし、エレメントが左右スワイプを処理できるようにするには次のように記述します。pinch-zoom');}setTouchActionの最初の引数は、リスナーがアタッチされているノードです。CSSプロパティの有効な値です。MDNを参照してください。setTouchActionを呼び出すことができます。この変更は、setTouchActionが呼び出さル時、実行中のジェスチャーには影響しません。ネイティブジェスチャー処理が有効になっているときは、ブラウザによっては、Polymerのジェスチャーイベントが発生する可能性があります。ジェスチャーイベントが発生すると、ネイティブブラウザの処理の前にリスナーが呼び出されます。preventDefaultを呼び出すことで、ネイティブブラウザの処理を防ぐことができます。e.preventDefault();}ジェスチャーイベントリスナーがスクロールパフォーマンスを妨げないようにしたい場合は、次のセクションで説明するように、すべてのジェスチャーイベントリスナーを強制的にpassiveにします。Polymer.setPassiveTouchGestures(true)を呼び出すことで、ジェスチャー関連の全てのイベントリスナーを強制的にpassiveにすることができます。passiveイベントリスナーは、preventDefaultを呼び出してデフォルトのブラウザ処理を妨げることはないので、ブラウザはイベントリスナーから戻るのを待たずにネイティブのジェスチャーを処理できます。ジェスチャー関連のイベントリスナーを設定する前にsetPassiveTouchGesturesを呼び出す必要があります。アプリケーションのエントリーポイントや、メインのアプリケーションエレメントのconstructorで設定するようにします(常に最初にロードされるエレメントで呼び出す必要があります)。passiveタッチジェスチャーを使用すればスクロールのパフォーマンスは向上しますが、アプリケーション内のいずれかのエレメントのジェスチャーでpreventDefaultが呼び出される可能性があれば問題が発生するかもしれません。