FlutterでToastを作成する方法 質問する

FlutterでToastを作成する方法 質問する

似たようなものを作ることはできますか?乾杯Flutter では?

ここに画像の説明を入力してください

ユーザーの目の前に直接表示されず、背後のビューをロックしたりフェードアウトしたりしない、小さな通知ウィンドウです。

ベストアンサー1

更新: Scaffold.of(context).showSnackBar Flutter 2.0.0 (安定版) では非推奨です

ScaffoldMessengerStateを使用して親にアクセスできますScaffoldMessenger.of(context)

次のようなことをする

ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
     content: Text("Sending Message"),
));

スナックバーはマテリアルデザインの公式「トースト」です。スナックバー

以下に完全に動作する例を示します。

ここに画像の説明を入力してください

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  const Home({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Snack bar'),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () => _showToast(context),
          child: const Text('Show toast'),
        ),
      ),
    );
  }

  void _showToast(BuildContext context) {
    final scaffold = ScaffoldMessenger.of(context);
    scaffold.showSnackBar(
      SnackBar(
        content: const Text('Added to favorite'),
        action: SnackBarAction(label: 'UNDO', onPressed: scaffold.hideCurrentSnackBar),
      ),
    );
  }
}

おすすめ記事