Flutter,如何从另一个类调用Dialog函数

时间:2020-10-24 03:56:57

标签: flutter flutter-layout flutter-animation

从另一个类调用Dialog函数的正确方法是什么。

我已经搜索了一段时间,但似乎没有一个答案。

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

因此,仅一个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,
      );
    },
  );
}

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

在逻辑上与基类文件分开,并且必须具有initState()和setState()

我怎么能做到这一点?谢谢

2 个答案:

答案 0 :(得分:0)

我在某些类的应用中使用了自定义对话框,并且遇到了同样的问题。

您可以这样定义一个对话框:

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") ,
),

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

答案 1 :(得分:0)

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;
              });
            },
          )
        ],
      ),
    );
  }
}