Flutter - FloatingActionButton 中的 SimpleDialog

Question

我正试图在点击 FloatingActionButton 后创建一个 SimpleDialog ，但是当我按下该按钮时什么都没有发生。
我做错了什么？

import "package:flutter/material.dart";

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

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

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) => new Scaffold(
    appBar: new AppBar(
      backgroundColor: new Color(0xFF26C6DA),
    ),
    floatingActionButton: new FloatingActionButton(
      tooltip: 'Add',
      child: new Icon(Icons.add),
      backgroundColor: new Color(0xFFF44336),
      onPressed: (){
        new SimpleDialog(
          title: new Text('Test'),
          children: <Widget>[
            new RadioListTile(
              title: new Text('Testing'), value: null, groupValue: null, onChanged: (value) {},
            )
          ],
        );
      }     
    ),    
  );
}

- rafaelcb21

Answer 1

我注意到被接受的答案使用了child来进行showDialog，但实际上这已经被弃用了，因此建议避免使用。你应该改用builder，以下是一个示例：

onPressed: () {
    showDialog(
        context: context,
        builder: (_) => AlertDialog(
            title: Text('Dialog Title'),
            content: Text('This is my content'),
        )
    );
}

- Mark O'Sullivan

---

谢谢Gil！顺便说一下，你把我的姓拼错了，是O'Sullivan而不是Sullivan :) - Mark O'Sullivan

Answer 2

你需要将此内容包装在一个显示动作对话框中。

showDialog(context: context, builder: (BuildContext context) {
   return new AlertDialog(
      title: new Text("My Super title"),
      content: new Text("Hello World"),
   );
}

- Alexi Coard

---

这个答案是正确的。很可能你最终会想要获取对话框的结果，这时你可以使用 await 等待 showDialog 的结果，并在对话框操作中通过调用 Navigator.pop() 返回你想要返回的值。 - Collin Jackson

经过多次尝试，我终于找到了我的问题所在：如果你的应用程序声明了一个 localizationDelegates 列表但是忘记包含 GlobalMaterialLocalizations.delegate 和/或 GlobalWidgetsLocalizations.delegate ，那么对话框将不会显示。 - Nicolás Carrasco-Stevenson

这已经过时了。 - Jones

Answer 3

在从floatingActionButton显示对话框时，有一个特定的情况需要注意处理。

如果您编写的代码如下所示：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        floatingActionButton: FloatingActionButton(
            onPressed: () {
              showDialog(
                  context: context,
                  builder: (ctxt) => new AlertDialog(
                    title: Text("Text Dialog"),
                  )
              );
            }),
      )
    );
  }
}

它不会显示提示对话框，而是抛出异常“No MaterialLocalizations found.”

当调用对话框的不是根MaterialApp时，就会发生这种情况。在这种情况下，根小部件是应用程序。但是，如果我们将代码更改为

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

class MyAppImpl extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(
          onPressed: () {
            showDialog(
                context: context,
                builder: (ctxt) => new AlertDialog(
                  title: Text("Text Dialog"),
                )
            );
          }),
    );
  }
}

MaterialApp 成为根，一切都很好。在这种情况下，Flutter自动创建材质本地化，否则需要手动创建。

我没有在官方文档中找到相关的说明。

希望这有所帮助。

- Daksh Gupta