【Flutter】AbsorbPointerの基本とサンプルコード

本記事では、AbsorbPointerの基本的な使い方とサンプルコード、関連記事を紹介します。

Flutterの公式動画の「Widget of the Week」をベースに日本語で説明しています。

本記事を読むメリット

AbsorbPointerの基本的な使い方

要約

説明

ほとんどのwidgetには入力を無効（disable）にする方法があります。
例えばRaisedButtonはonPressedにnullを指定するとdisableになります。

ListViewの場合は、physicsプロパティにNeverScrollableScrollPhysicsを指定することでユーザーがドラッグしてもスクロールされないように制御することが可能です。

このようにwidgetは個別にdisableに切り替えることが可能ですが、widgetツリーが複雑な場合、個別にそれぞれを制御するのは大変です。

そんな場合はAbsorbPointerを使いましょう。

使い方は簡単です。
disableにしたいwidgetツリーをAbsorbPointerでラップするだけです。

これだけでAbsorbPointerでラップされた全てのwidgetはタッチイベントから守られます。

disableのON/OFFはabsorbingプロパティで切り替えることができます。

また、ignoringSemanticsプロパティを指定することで、スクリーンリーダーなどのモバイル機器のSemanticsからのアクセスの有効/無効を切り替えることができます。

（補足：スクリーンリーダーは主に目の不自由な方向けに文字を音声で読み上げする機能）

動画

サンプルコード

・シンプルなサンプルコード（英語記事、3つのボタンを1つのAbsorbPointerでまとめてラップ）
　AbsorbPointer In Flutter – Flutter Tutorial

関連記事

・Flutter 公式ドキュメント
　AbsorbPointer class – widgets library – Dart API – Flutter

・AbsorbPointerとIgnorePointerの違い
　Flutter AbsorbPointer vs IgnorePointer difference – Stack Overflow

　ベストアンサー：
　　AbsorbPointer
　　　widgetがイベントを吸収（Absorb）し、その後、別のwidgetへのイベントの伝播は発生しない。
　　IgnorePointer
　　　widgetがイベントを無視（ignore）し、その後、別のwidgetへのイベントの伝播は通常通り発生する。
　　　
　例えば、Stackで重ねた2つのwidgetを同時にクリックした場合、
　前面にあるwidgetをAbsorbPointerでラップしてイベントをキャンセルした場合、
　背面にあるもう一つのwidgetのクリックイベントも実行されない。
　IgnorePointerで前面のwidgetをラップした場合は、前面のwidgetに対するクリックが無視されるだけで、
　背面のwidgetにクリックイベントは伝播する。
　結果、背面のwidgetのクリックイベントは実行される。

・Semantics widgetのメリット・使い方
　#47 – Semantics

・関連書籍
　Flutterの基本的な仕組みや周辺知識（テストやCIなど）を網羅的に学べる入門書
　Flutter　モバイルアプリ開発バイブル

・その他のwidgetについてはこちら
　カテゴリ-Flutter