将 SnackBar 与 CupertinoPageScaffold 一起使用

Question

有没有办法将SnackBar 与CupertinoPageScaffold 一起使用？

我收到以下错误：

Scaffold.of() called with a context that does not contain a Scaffold.
No Scaffold ancestor could be found starting from the context that was passed to Scaffold.of().

使用以下方法在子小部件中调用SnackBar：

final snackBar = SnackBar(
      content: Text('Yay! A SnackBar!'),
      action: SnackBarAction(
      label: 'Undo',
      onPressed: () {
      // Some code to undo the change!
      },
      ),
      );

// Find the Scaffold in the Widget tree and use it to show a SnackBar!
Scaffold.of(context).showSnackBar(snackBar);

Answer 1

Cupertino 小部件应该是特定于 iOS 的，SnackBar 来取代 Android Toasts 但在 iOS 中没有 Android Toast 等价物，因此您不能将 SnackBar 本地添加到 CupertinoScaffold，因为它会不遵循 iOS 准则。

一种解决方案是扩展 CupertinoScaffold 并将其添加到 SnackBar 代码。

另一个在 Mazin Ibrahim answer，注意不建议嵌套 Scaffolds。

Answer 2

您需要包含Scaffold，因为CupertinoPageScaffold 不是它的子对象，然后您需要将调用showSnackBar 函数的代码与Scaffold 的代码分开到一个单独的类中这里是SnackBarBody，因为不能从同一个Build 函数调用SnackBar 和Scaffold。这是一个完整的工作示例：

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

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

class SnackBarDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
     title: 'SnackBar Demo',
     home: CupertinoPageScaffold(
    child: SnackBarPage(),
       ),
     );
   }
 }

class SnackBarPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
   body: SnackBarBody(),
   );
 }
}

class SnackBarBody extends StatefulWidget {
  SnackBarBody({Key key,}):
      super(key: key);

  @override
  _SnackBarBodyState createState() => new _SnackBarBodyState();
}

class _SnackBarBodyState extends State<SnackBarBody> {

@override
Widget build(BuildContext context) {
  return Center(
    child: RaisedButton(
      onPressed: () {
        final snackBar = SnackBar(content: Text('Yay! A SnackBar!'),action: SnackBarAction(label: 'Undo',
          onPressed: () {
            // Some code to undo the change!
          },
        ),
      );

        // Find the Scaffold in the Widget tree and use it to show a SnackBar!
        Scaffold.of(context).showSnackBar(snackBar);
       },
      child: Text('Show SnackBar'),
     ),
   );
  }
}