※https://docs.flutter.dev/ui/interactivity/gestures/drag-outside のリファレンスブログです。
アプリのどこかにドラッグ アンド ドロップを実装したい場合があります。
実行できる潜在的なアプローチはいくつかあります。
1つは Flutter ウィジェットを直接使用し、
もう 1 つはpub.devで入手できるパッケージ ( super_drag_and_drop ) を使用します。
1.アプリ内でドラッグ可能なウィジェットの使用
Flutterアプリ内でドラッグ&ドロップを実装する場合、以下のような手法を使用できます。
(1)Draggable / DragTarget ウィジェットを直接利用する
- Draggable は、ウィジェットをドラッグ可能なオブジェクトとして設定します。
このウィジェットをユーザーがドラッグすると、そのオブジェクトが移動され、指定された DragTarget にドロップすることができます。 - DragTarget は、ドロップされたオブジェクトを受け取るウィジェットとして設定されます。DragTarget には、onWillAccept や onAccept などのコールバックを指定することができ、これらを使ってドロップを受け入れるかどうかを判断したり、ドロップされた後に何らかのアクションを実行できます。
- 利点
- Draggable と DragTarget を使用することで、Dartコードでドロップの受け入れ条件を柔軟に設定することができます。
- Flutterウィジェットの一部としてドラッグ&ドロップを管理できるため、UIやレイアウトと密接に連携しやすいのが特徴です。
- 参考
- 上記アプローチの詳細:「アプリ内でUI要素をドラッグする」
- Draggable:「今週のウイジェット(Draggable)」
(2)super_drag_and_drop パッケージを利用する
アプリ内で使用するローカルデータ(アプリ内のデータ)をsuper_drag_and_dropパッケージに渡し、そのデータを用いてドラッグを実行させることができます。
しかしアプリ内でのドラッグ&ドロップだけであれば、上記(1)手法の方が簡単に実装できます。
この(2)手法は、以下(アプリ間のドラッグ&ドロップ)の場合で利用するためのものです。
(もしくは、アプリ内、アプリ外のドラッグ&ドロップを両方実装する必要がある場合に、この(2)手法で統一するのが好ましい、とのことです)
2.アプリ間のドラッグ&ドロップを実装する
アプリ内だけでなく、他の(おそらくFlutterではない)アプリケーション間でドラッグ&ドロップを実装する場合、以下の方法が考えられます。
- super_drag_and_drop パッケージを使用する:
- このパッケージを使用することで、Flutterアプリと他のアプリケーション(例えば、デスクトップのファイルシステムなど)間でのドラッグ&ドロップを実装することができます。
- super_drag_and_drop は、モバイル、デスクトップ、Web など多くのプラットフォームで動作するのが特徴です。アプリ外でのドラッグ&ドロップを実装する場合、Flutterウィジェットだけではカバーできない部分を補完してくれます。
- 制約
- このアプローチを使用する場合、プラットフォームAPIが同期的なレスポンスを要求するため、フレームワーク側からの非同期レスポンスを行うことができません。そのため、アプリケーションが受け入れるデータをあらかじめパッケージに伝えておく必要があります。