#SnackBarの記事は世に溢れている
FlutterでSnackBarを出す方法を調べると簡単に情報が出てくる。
// ボタンを押したらスナックバーを出す
onPressed: () {
// 変数snackbarの中に表示したい情報を詰める
final snackbar = SnackBar(
content: Text('10秒後に消えます'),
action: SnackBarAction(
label: '閉じる',
// 閉じるボタンを押したら
onPressed: () {
Scaffold.of(context).removeCurrentSnackBar();
},
),
// 何秒後に消えるか
duration: Duration(seconds: 10),
);
// ここで変数snackbarの中身を表示
Scaffold.of(context).showSnackBar(snackbar);
},
しかしこのスナックバーをどこからでも呼び出せる共通部品にしようとした時、どうやってもうまくいかなかった。
色々模索した結果
・returnしない
・Builderで囲う
のがコツだとわかった
// CenterをBuilderで囲ってcontextを渡せるようにしてあげる
body: Builder(builder: (BuildContext context) {
return Center(
child: Column(
children: [
RaisedButton(
child: Text('スナックバー表示'),
color: Colors.blue,
textColor: Colors.white,
onPressed: () {
// contextを引数にしてカスタムスナックバーに渡す
// 他の変数も用意すれば渡せる
final snackbar = CustomSnackBar(context);
Scaffold.of(context).showSnackBar(snackbar);
},
),
],
),
);
})
// スナックバーを部品化したクラス
class CustomSnackBar extends SnackBar {
// Widget build とか returnは書かない
CustomSnackBar(BuildContext context) : super(
content: Text('10秒後に消えます'),
action: SnackBarAction(
label: '閉じる',
onPressed: () {
Scaffold.of(context).removeCurrentSnackBar();
},
),
duration: Duration(seconds: 10),
);
}
Flutterはよくわからぬ…