扑-具有透明背景的小部件

Question

我正在创建一个具有透明背景的StatefulWidget。相同的代码是：

return Scaffold(
  body: Builder(
    builder: (context) => Material(
          color: Colors.black.withOpacity(0.75),
          child: new SafeArea(
            child: Center(
              child: Container(
                color: Colors.white,
                child: ListView(
                  children: <Widget>[
                    resetPasswordLabel,
                    inputFields,
                    doneButton(context),
                  ],
                ),
                height: 250.0,
                margin: EdgeInsets.only(left: 20.0, right: 20.0),
              ),
            ),
          ),
        ),
  ),
);

问题：：当我使用导航器打开此小部件时，透明颜色可见1到2秒钟，然后变成黑色背景。

输出：

可接受的输出应为：

请在这里帮助我。

Answer 1

您可以创建一个自定义对话框，并在下面的行中将其打开...

Navigator.of(context).push(
    PageRouteBuilder(
        pageBuilder: (context, _, __) => CustomAlertDialog(), opaque: false),
);

不透明：false 将使背景保持透明。

Answer 2

当您以推入状态打开新的“页面”时，旧的“页面”或状态将被处置，直到您调用Navigator.pop(context)。如果要在提供的屏幕截图中显示效果，请使用dialog。