页面转换后如何显示 SnackBar答案

【问题标题】：How to show SnackBar after page transition页面转换后如何显示 SnackBar
【发布时间】：2018-02-16 21:13:15
【问题描述】：

我只想在页面显示时显示一次 SnackBar。但是我们不能在 build 方法中调用 showSnackBar。

是否有在构建后调用的处理程序？

【问题讨论】：

【解决方案1】：

您可以使用StatefulWidget 并在您的State 的initState 中调用showSnackBar。您需要在触发showSnackBar 之前添加一个短暂的延迟。这是一个代码示例。

import 'dart:async';
import 'package:flutter/material.dart';

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

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

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.developer_board),
        onPressed: () {
          Navigator.of(context).push(
            new MaterialPageRoute(builder: (_) => new MySecondPage()),
          );
        },
      ),
    );
  }
}

class MySecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Developer Mode'),
      ),
      body: new MySecondPageBody(),
    );
  }
}

class MySecondPageBody extends StatefulWidget {
  @override
  State createState() => new MySecondPageBodyState();
}

class MySecondPageBodyState extends State<MySecondPageBody> {
  @override
  void initState() {
    new Future<Null>.delayed(Duration.ZERO, () {
      Scaffold.of(context).showSnackBar(
        new SnackBar(content: new Text("You made it! Congrats.")),
      );
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Center(
      child: new Text('You are now a developer.'),
    );
  }
}

【讨论】：

据我所知，initState 将在build 之前调用。 Scaffold还没发？
但是initState没有上下文，你怎么能提供上下文？
@AbdulRahmanAlHamali 小部件具有上下文属性。这就像在做this.context
@CollinJackson你也可以用 Future 代替 scheduleMicrotask
@collin 是否有任何方法可以在第一页设置小吃栏消息并在从第一页重定向到第二页后在第二页显示？请建议。谢谢。

【解决方案2】：

使用 StatelessWidget 和 scheduleMicrotask 你也可以实现它

import 'dart:async';
import 'package:flutter/material.dart';

class App extends StatelessWidget {
  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
  App() {
    scheduleMicrotask(() => _scaffoldKey.currentState.showSnackBar(SnackBar(
          content: Text('Hey!'),
        )));
  }
  @override
  Widget build(BuildContext ctx) {
    return Scaffold(
        key: _scaffoldKey,
        appBar: AppBar(
          title: Text('Look mum!'),
        ),
        body: Container());
  }
}

【讨论】：

【解决方案3】：

您也可以尝试附加到 addPostFrameCallback (https://api.flutter.dev/flutter/scheduler/SchedulerBinding/addPostFrameCallback.html)

SchedulerBinding.instance.addPostFrameCallback((_) {
    //show snackbar here
  });

【讨论】：