如何在Flutter中将对话框底部的两个按钮对齐

Question

这是我要在Flutter中创建的对话框的模型：

这是我到目前为止所拥有的：

我无法将两个带有圆角的按钮放在对话框的底部，使它看起来像在模型中一样。

我能够使这些按钮适合Dialog宽度，而没有堆栈，但是它将位于顶部。

以下是对话框的代码：

SimpleDialog carDialog = SimpleDialog(
      contentPadding: EdgeInsets.all(0),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
      children: <Widget>[
        Container(
          height: 400,
          child: Stack(
            children: <Widget>[
              Positioned(
                bottom: 0,
                child: IntrinsicWidth(
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      Expanded(
                        child: Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                                bottomLeft: Radius.circular(6)),
                            color: Colors.lightBlueAccent,
                          ),
                          height: 45,
                          child: Center(
                            child: Text(
                              allTranslations.text('wait_enroute').toUpperCase(),
                              textAlign: TextAlign.center,
                              style: Fonts.appFont(context,
                                  bold: true, color: Colors.white),
                            ),
                          ),
                        ),
                      ),
                      Expanded(
                        child: Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                                bottomRight: Radius.circular(6)),
                            color: AppColors.action_button,
                          ),
                          height: 45,
                          child: Center(
                            child: Padding(
                              padding:
                                  const EdgeInsets.symmetric(horizontal: 8.0),
                              child: Text(
                                allTranslations.text('new_order').toUpperCase(),
                                textAlign: TextAlign.center,
                                style: Fonts.appFont(context,
                                    bold: true, color: Colors.white),
                              ),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ],
    );

    showDialog(context: context, builder: (context) => carDialog);

Answer 1

您可以尝试用Row代替它

LayoutBuilder(
    builder:(BuildContext context, BoxConstraints constraints){
        return Row(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
                      SizedBox(
                            width : constraints.maxWidth/2
                            child:Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                                bottomLeft: Radius.circular(6)),
                            color: Colors.lightBlueAccent,
                          ),
                          height: 45,
                          child: Center(
                            child: Text(
                              allTranslations.text('wait_enroute').toUpperCase(),
                              textAlign: TextAlign.center,
                              style: Fonts.appFont(context,
                                  bold: true, color: Colors.white),
                            ),
                          ),
                        ),
                        ),
                        SizedBox(
                            width : constraints.maxWidth/2
                            child:Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                                bottomRight: Radius.circular(6)),
                            color: AppColors.action_button,
                          ),
                          height: 45,
                          child: Center(
                            child: Padding(
                              padding:
                                  const EdgeInsets.symmetric(horizontal: 8.0),
                              child: Text(
                                allTranslations.text('new_order').toUpperCase(),
                                textAlign: TextAlign.center,
                                style: Fonts.appFont(context,
                                    bold: true, color: Colors.white),
                              ),
                            ),
                          ),
                        ),
                        ),

                    ],
        );
    }
),

Answer 2

我找到了可行的解决方案。它不需要Stack小部件，所有内容都可以嵌套在Column中，如下所示：

SimpleDialog carDialog = SimpleDialog(
      contentPadding: EdgeInsets.all(0),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
      children: <Widget>[
        Column(
          children: <Widget>[
            SizedBox(
              height: 400,
            ),
            Row(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Expanded(
                  child: InkWell(
                    child: Container(
                      decoration: BoxDecoration(
                        borderRadius:
                            BorderRadius.only(bottomLeft: Radius.circular(6)),
                        color: Colors.lightBlueAccent,
                      ),
                      height: 45,
                      child: Center(
                        child: Text(
                          allTranslations.text('wait_enroute').toUpperCase(),
                          textAlign: TextAlign.center,
                          style: Fonts.appFont(context,
                              bold: true, color: Colors.white),
                        ),
                      ),
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    decoration: BoxDecoration(
                      borderRadius:
                          BorderRadius.only(bottomRight: Radius.circular(6)),
                      color: AppColors.action_button,
                    ),
                    height: 45,
                    child: Center(
                      child: Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 8.0),
                        child: Text(
                          allTranslations.text('new_order').toUpperCase(),
                          textAlign: TextAlign.center,
                          style: Fonts.appFont(context,
                              bold: true, color: Colors.white),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ],
    );

    showDialog(context: context, builder: (context) => carDialog);

结果：