Flutter中如何设置AlertDialog最大高度并自适应内容高度

你的问题出在给Container设置了固定高度，导致不管列表项多少都会占用屏幕一半空间。可以通过以下修改实现「内容少时自动收缩，内容多时限制最大高度为屏幕一半」的效果：

1. 去掉固定高度，改用最大高度限制：移除Container的height属性，用ConstrainedBox来设置最大高度为屏幕高度的一半
2. 让列表自适应内容高度：给ListView添加shrinkWrap: true，让列表根据子项数量自动调整自身高度
3. 简化层级：移除多余的Wrap组件，减少不必要的嵌套

修改后的完整代码：

showDialog(
  context: context,
  builder: (ctx) => StatefulBuilder(builder: (context, setState) {
    final screenHeight = MediaQuery.of(context).size.height;
    return AlertDialog(
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.all(Radius.circular(10.0))
      ),
      content: ConstrainedBox(
        constraints: BoxConstraints(
          maxHeight: screenHeight / 2, // 最大高度为屏幕一半
        ),
        child: Container(
          padding: const EdgeInsets.all(5),
          width: MediaQuery.of(context).size.width,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min, // 让Column自适应内容高度
            children: [
              const Text('Select Country'),
              const SizedBox(height: 10),
              Expanded(
                child: ListView.builder(
                  shrinkWrap: true, // 列表自适应内容高度
                  itemCount: getCountries().length,
                  itemBuilder: (BuildContext context, int index) {
                    final User us = getCountries()[index];
                    return InkWell(
                      onTap: () {
                        Navigator.pop(context);
                        setState(() {
                          countryId = us.id;
                        });
                      },
                      child: Container(
                        margin: const EdgeInsets.only(
                          left: 0, top: 5, right: 0, bottom: 5
                        ),
                        padding: const EdgeInsets.all(10),
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.all(Radius.circular(10))
                        ),
                        child: Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Text(
                              us.name,
                              style: TextStyle(
                                color: AppColor.colorAppGreen,
                                fontSize: 16
                              ),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                ),
              )
            ],
          ),
        ),
      ),
    );
  })
);

关键修改说明： #

• ConstrainedBox的maxHeight限制了内容区域的最大高度，当列表项较多时，内容会在这个高度内滚动
• ListView.builder的shrinkWrap: true让列表不再强制占满父容器，而是根据子项高度计算自身高度
• Column添加了mainAxisSize: MainAxisSize.min，确保Column只占用内容所需的高度，不会无意义拉伸

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