未経験から最短3カ月でプログラマーへ！！【０円スクール】
この記事はで読むことができます。
ElevatedButtonは、ユーザーがボタンをタップすることでアクションを起こすことができるウィジェットですが、もちろんそれだけではありません。
Flutterでは、ElevatedButtonに加えて、ボタンを長押し（Long Press）したときに実行されるonLongPressイベントをカスタマイズすることもできます。
この記事では、初心者向けにElevatedButtonのonLongPressイベントの使い方を解説します。
アプリ開発に必須なキャッチコピーやテキストをAI（人工知能）が自動作成
まずは、ElevatedButtonの基本的な使い方から確認しましょう。
以下は、シンプルなElevatedButtonのコード例です。
Dart
ElevatedButton(
onPressed: () {
// ボタンがタップされたときの処理
},
child: Text('ボタン'),
);ElevatedButtonにonLongPressイベントを追加することで、ボタンを長押しした際の動作をカスタマイズできます。
以下は、ボタンを長押ししたときに実行される処理を追加する例です。
Dart
ElevatedButton(
onPressed: () {
// ボタンがタップされたときの処理
},
onLongPress: () {
// ボタンが長押しされたときの処理
},
child: Text('ボタン'),
);onLongPressイベントを利用することで、ボタンが長押しされたときに行うアクションを自由にカスタマイズすることができます。
例えば、長押し時にダイアログを表示したり、特定の動作をトリガーしたりすることができます。
Dart
ElevatedButton(
onPressed: () {
// ボタンがタップされたときの処理
},
onLongPress: () {
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: Text('ボタンを長押ししました'),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('閉じる'),
),
],
);
},
);
},
child: Text('ボタン'),
);ElevatedButtonのonLongPressイベントを活用することで、ユーザーがボタンを長押ししたときの挙動をカスタマイズできます。
長押し時に表示されるダイアログやアクションを通じて、ユーザーエクスペリエンスを向上させることができます。
ぜひ、これらのテクニックを使って、アプリのボタンをさらにインタラクティブにする方法を試してみましょう！
