flutter - 使用 BottomSheet 时未找到 Scaffold 小部件

Question

我刚刚学习 Flutter 并陷入了这个错误：

No Scaffold widget found.

Home widgets require a Scaffold widget ancestor.
The specific widget that could not find a Scaffold ancestor was: Home
The ancestors of this widget were

但正如你从我的代码中看到的那样，我确实有一个脚手架，我尽可能地添加它，但我没有工作。

我在那里做了或没有注意到的原因是什么？

import 'package:firebase_redux_app/services/firebase.auth.dart';
import 'package:flutter/material.dart';
// import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_redux_app/services/firestore.dart';
import 'package:provider/provider.dart';
import 'package:firebase_redux_app/screens/home/brewList.dart';
import 'package:firebase_redux_app/models/brew.dart';

class Home extends StatelessWidget {
  final AuthService _auth = AuthService();

  @override
  Widget build(BuildContext context) {
    void _showSettingsPanel() {
      showBottomSheet(
          context: context,
          builder: (context) {
            return Container(
              padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 60.0),
              child: Text('bottom sheet'),
            );
          });
    }

    return StreamProvider<List<Brew>>.value(
      value: DBFirestore().brews,
      child: Scaffold(
        backgroundColor: Colors.brown[50],
        appBar: AppBar(
          title: Text('Brew Crew'),
          backgroundColor: Colors.brown[400],
          elevation: 0.0,
          actions: <Widget>[
            FlatButton.icon(
                onPressed: () async {
                  await _auth.signOut();
                },
                icon: Icon(Icons.person),
                label: Text('Log Out')),
            FlatButton.icon(
              icon: Icon(Icons.settings),
              label: Text('settings'),
              onPressed: () => _showSettingsPanel(),
            )
          ],
        ),
        body: BrewList(),
      ),
    );
  }
}

标签： flutterdartflutter-layout

Answer 1

此错误是由于您的_showSettingsPanel方法的范围引起的

你可以做两件事

1. 在_showSettingsPanel创建一个方法，Home并允许它以上下文作为参数。因此，将您的设置 包装FlatButton在 a 中Builder并将 传递context给该_showSettingsPanel方法。

像这样

class Home extends StatelessWidget {

  void _showSettingsPanel(context) {
    showBottomSheet(
        context: context,
        builder: (context) {
          return Container(
            padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 60.0),
            child: Text('bottom sheet'),
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return StreamProvider<List<Brew>>(
      value: DBFireStore().brews
      child: Scaffold(
        backgroundColor: Colors.brown[50],
        appBar: AppBar(
          title: Text('Brew Crew'),
          backgroundColor: Colors.brown[400],
          elevation: 0.0,
          actions: <Widget>[
            FlatButton.icon(
                onPressed: () async {
                },
                icon: Icon(Icons.person),
                label: Text('Log Out')),
            Builder(
              builder: (context) {
                return FlatButton.icon(
                  icon: Icon(Icons.settings),
                  label: Text('settings'),
                  onPressed: () => _showSettingsPanel(context),
                );
              }
            )
          ],
        ),
        body: BrewList(),
      ),
    );
  }
}

2.Home将小部件 包装Scaffold在您使用它的任何地方，而不是仅使用Home

像这样

Scaffold(body: Home())