Flutter Dialog内容对齐、标题设置及Divider样式优化问题

我来帮你搞定这三个布局问题，咱们逐个梳理解决方案：

1. 规范设置Dialog标题 #

你之前用Padding+Text手动做标题的方式没问题，但可以更贴合Flutter的组件规范，推荐两种处理方式：

• 改用AlertDialog组件（它自带title属性，自动处理标题的排版和间距，省去自己调布局的麻烦）；
• 如果坚持用基础Dialog，可以给标题文本添加居中对齐，同时调整padding让它更美观。

2. 按钮对齐调整 #

你的按钮现在排版混乱，核心原因是Row没有设置主轴对齐规则，而且那个空的Padding（没有child）完全起不到间距作用。可以这样处理：

• 给Row添加mainAxisAlignment: MainAxisAlignment.spaceEvenly，让两个按钮在一行内均匀分布；
• 或者在两个按钮之间插入SizedBox(width: 16)，手动控制按钮间的间距，排版更精准。

3. 调整Divider线条粗细 #

默认Divider的thickness属性是0.0，所以线条非常细。只需要给Divider设置具体的thickness值（比如thickness: 2），就能得到你想要的粗线条效果。

修正后的完整代码 #

import 'package:flutter/material.dart';

Dialog leadDialog = Dialog(
  child: Container(
    color: Colors.white,
    child: Column(
      mainAxisSize: MainAxisSize.min, // 关键优化：让Dialog高度自适应内容，避免过高
      mainAxisAlignment: MainAxisAlignment.start,
      children: <Widget>[
        // 优化后的标题：居中对齐+合适的内边距
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 20),
          child: Text(
            'BUY TICKETS',
            style: TextStyle(color: Colors.black, fontSize: 22.0, fontWeight: FontWeight.bold),
            textAlign: TextAlign.center,
          ),
        ),
        // 设置了粗细的Divider
        Divider(color: Colors.redAccent, thickness: 2),
        // 对齐后的按钮行
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 10),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly, // 按钮均匀分布在一行
            children: <Widget>[
              RaisedButton(
                padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 15.0),
                textColor: Colors.black,
                child: Text('02:00PM'),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
              ),
              RaisedButton(
                padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 15.0),
                textColor: Colors.black,
                child: Text('10:00PM'),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
              )
            ],
          ),
        ),
        Divider(color: Colors.redAccent, thickness: 2),
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 10),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              RaisedButton(
                padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 15.0),
                textColor: Colors.black,
                child: Text('02:00PM'),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
              ),
              RaisedButton(
                color: Colors.grey,
                padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 15.0),
                textColor: Colors.black,
                child: Text('10:00PM'),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
              )
            ],
          ),
        ),
        // 可选：给底部加一点间距，避免按钮贴边
        SizedBox(height: 10),
      ],
    ),
  ),
);

另外补充了一个小细节：给Column加了mainAxisSize: MainAxisSize.min，这样Dialog的高度会自适应内容，不会过度拉伸，体验更友好~

内容的提问来源于stack exchange，提问作者Prianca