首页 > 解决方案 > Flutter Simple Dialog 内容离开屏幕

问题描述

我有一个对话框我正在尝试将内容包装在对话框中但是我遇到了一些问题

1)使用wrap不保证内容在alert对话框中

2)内容对齐不居中。

我已经尝试了所有可能的对齐方式,但它不起作用。在使用列拉伸时,我认为使用 wrap 的小部件可能会起作用。但事实并非如此。有什么解决办法吗?

带包装

带柱

带柱

使用包装中的彩色容器来检查问题,并使用具有定义的显示宽度 * 0.25 的大小框,以便文本不会离开屏幕

带包装容器

代码

 showDialog(
      barrierDismissible: false,
      barrierColor: Colors.black26,
      context: context,
      builder: (context) {
        return StatefulBuilder(
          builder: (context, setState) {
            return AlertDialog(
              contentPadding: EdgeInsets.all(20),
              content: Wrap(
                direction: Axis.vertical,
                alignment: WrapAlignment.spaceAround,
                runAlignment: WrapAlignment.center,
                crossAxisAlignment: WrapCrossAlignment.center,
                runSpacing: 10,
                children: [
                  Lottie.asset(
                      Constants.location_anim,
                      height: displaySize.height * 0.25,
                      repeat: true,
                      reverse: true,
                      animate: true
                  ),
                  Text(locationMsgTextView,softWrap: true,),
                  getLocationDeniedWidget(context,state),
                ],
              ),
              elevation: 3,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20)),
            );
          },
        );
      });

标签: flutterflutter-layoutflutter-widgetflutter-dialog

解决方案


推荐阅读