Flutter，如何从另一个调用 Dialog 函数 class

Question

从另一个 class.

调用 Dialog 函数的正确方法是什么

我已经搜索这个主题一段时间了，但似乎 none 个是我的答案。

我的对话框有一些复杂的服务器通信逻辑和一些分页

所以这段代码对于一个 dart 文件来说会很长。所以我想把它们分开。

我需要一些对话动画，所以我选择了 showGeneralDialog()

我还看到了使用 StatefulBuilder() 的示例对话框实现，它可以使用 setState，

但这个问题是它无法使用 initState()

目前，我所做的如下

dart1 文件

import 'package:aaa/bbb/some_dialog_file.dart'
    as someDialog;

        GestureDetector(
          onTap: () async{
            var result =
                await someDialog.displayDialogOKCallBack(
                context,
              );
          },
          child: Container(
            width: 60,
            height: 60,
            child: Icon(
              Icons.comment,
              size: 38,
            ),
          ),
        )

dart2 文件

Future<dynamic> displayDialogOKCallBack(BuildContext context) async {

  return await showGeneralDialog(
    barrierLabel: "Label",
    barrierDismissible: true,
    // barrierColor: ,
    transitionDuration: Duration(milliseconds: 400),

    context: context,
    pageBuilder: (context, anim1, anim2) {
      return StatefulBuilder(builder: (context, setState) {

        return Scaffold(            
          body: SafeArea(
            
          ),
        );
      });
    },
    transitionBuilder: (context, anim1, anim2, child) {
      return SlideTransition(
        position:
            Tween(begin: Offset(0, 1), end: Offset(0, -0.02)).animate(anim1),
        child: child,
      );
    },
  );
}

所以我的问题是我想构建非常干净的动画对话框

逻辑上与基础 class 文件分开，它必须有 initState() 和 setState()

我怎样才能做到这一点？谢谢

Answer 1

我在某些类的应用程序中使用了自定义对话框，但遇到了同样的问题。您应该定义一个对话框并将 context 和其他变量传递给它，然后在您想要的任何地方调用它。

您可以像这样定义对话框：

showCustomDialog(BuildContext context, String title, String description) {
  showDialog(
    context: context,
    builder: (BuildContext context) {
     return AlertDialog(
      title: Text(
        title,
        textAlign: TextAlign.right,
      ),
      content: SingleChildScrollView(
        child: Text(
          description,
          style: Theme.of(context).textTheme.bodyText1,
          textAlign: TextAlign.right,
        ),
      ),
      actions: [
        FlatButton(
          child: Text(
            'ok',
            style: Theme.of(context).textTheme.bodyText2.copyWith(
                  color: Theme.of(context).accentColor,
                ),
          ),
          onPressed: () => Navigator.of(context).pop(),
        ),
      ],
      actionsPadding: EdgeInsets.symmetric(
        horizontal: 10,
        vertical: 5,
      ),
    );
  });
}

并像这样在任何地方使用它：

InkWell(
       child: Icon(
                  Icons.error_outline,
                  size: 17,
             ),
       onTap: () =>  showCustomDialog(context,"text1" , "text2") ,
),

希望我的回答对您有所帮助

Answer 2

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: RaisedButton(
        onPressed: () {
          someDialog(context);
        },
        child: Text("click"),
      ),
    );
  }

  Future<dynamic> someDialog(BuildContext context) async {
    return await showGeneralDialog(
        barrierLabel: "Label",
        barrierDismissible: true,
        context: context,
        pageBuilder: (context, anim1, anim2) {
          return Scaffold(
            backgroundColor: Colors.transparent,
            body: SafeArea(
              child: Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                    Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        // List
                        AnotherClassDialog(),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          );
        });
  }
}

class AnotherClassDialog extends StatefulWidget {
  @override
  _AnotherClassDialogState createState() => _AnotherClassDialogState();
}

class _AnotherClassDialogState extends State<AnotherClassDialog> {
  Color color;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    color = Colors.black;
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: [
          RaisedButton(
            onPressed: () {
              setState(() {
                color = Colors.red;
              });
            },
          ),
          Container(
            width: 100,
            height: 100,
            color: color,
          ),
          RaisedButton(
            onPressed: () {
              setState(() {
                color = Colors.green;
              });
            },
          )
        ],
      ),
    );
  }
}

Flutter，如何从另一个调用 Dialog 函数 class

Flutter, how to call Dialog function from another class

flutter

flutter-layout

flutter-animation