[解決済み】Scaffold.of()がScaffoldを含まないコンテキストで呼び出された場合

質問

ご覧の通り、私のボタンは Scaffold の本文です。しかし、この例外が発生します。

Scaffold.of()は、Scaffoldを含まないコンテキストで呼び出されました。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('SnackBar Playground'),
      ),
      body: Center(
        child: RaisedButton(
          color: Colors.pink,
          textColor: Colors.white,
          onPressed: _displaySnackBar(context),
          child: Text('Display SnackBar'),
        ),
      ),
    );
  }
}

_displaySnackBar(BuildContext context) {
  final snackBar = SnackBar(content: Text('Are you talkin\' to me?'));
  Scaffold.of(context).showSnackBar(snackBar);
}

EDIT

この問題に対する別の解決策を見つけました。もし Scaffold をキーとする GlobalKey<ScaffoldState> で囲むことなく、以下のようにSnackBarを表示することができます。 Builder ウィジェットです。を返すウィジェットは Scaffold はステートフルウィジェットでなければなりませんが。

 _scaffoldKey.currentState.showSnackBar(snackbar); 

解決方法は？

この例外が発生するのは context をインスタンス化したウィジェットの Scaffold . ではなく context の子の Scaffold .

この問題は、別のコンテキストを使用することで解決できます。

Scaffold(
    appBar: AppBar(
        title: Text('SnackBar Playground'),
    ),
    body: Builder(
        builder: (context) => 
            Center(
            child: RaisedButton(
            color: Colors.pink,
            textColor: Colors.white,
            onPressed: () => _displaySnackBar(context),
            child: Text('Display SnackBar'),
            ),
        ),
    ),
);

を使っていることに注意してください。 Builder を取得するための唯一の方法というわけではありません。 BuildContext .

また、サブツリーを別の Widget (通常 extract widget リファクタリング)