Flutter：如何获取ModalBottomSheet高度以居中显示子组件

你的问题出在外层ListView的结构上：当无数据时，Center只是ListView的一个子项，它的高度仅为文本自身高度，无法占满整个弹窗的可用空间，所以文本会偏在顶部。

修改方案 #

将外层的ListView替换为Column，通过Expanded让无数据时的Center组件占满弹窗剩余空间，同时保留有数据时的滚动功能：

DraggableScrollableSheet(
  initialChildSize: 0.8,
  minChildSize: 0.4,
  maxChildSize: 1,
  builder: (_, controller) => Container(
    decoration: BoxDecoration(
      color: MyHelper.isDarkMode(context) ? Colors.black : Colors.white,
      borderRadius: const BorderRadius.only(
        topRight: Radius.circular(20),
        topLeft: Radius.circular(20),
      ),
    ),
    padding: const EdgeInsets.all(MySizes.sm),
    child: Column(
      children: [
        const Text('Showing all records'),
        const SizedBox(height: MySizes.sm), // 可选：增加顶部文本与下方内容的间距
        Expanded(
          child: len == 0
              ? const Center(child: Text('No data available'))
              : SingleChildScrollView(
                  controller: controller,
                  child: Padding(
                    padding: const EdgeInsets.symmetric(horizontal: MySizes.sm),
                    child: ListView.separated(
                      shrinkWrap: true,
                      physics: const NeverScrollableScrollPhysics(),
                      itemCount: fetchTransactionByDate(daySummeryModel.dateTime).length,
                      separatorBuilder: (_, __) => const SizedBox(height: MySizes.sm), // 增加卡片间距
                      itemBuilder: (context, index) {
                        final transaction = fetchTransactionByDate(daySummeryModel.dateTime)[index];
                        return RecentTransactionCard(transactionModel: transaction);
                      },
                    ),
                  ),
                ),
        ),
      ],
    ),
  ),
)

关键修改说明 #

1. 替换外层容器：用Column替代原ListView，可以通过Expanded灵活分配空间。
2. 无数据时的布局：Expanded包裹Center，让提示文本占满弹窗除顶部文本外的所有空间，实现居中效果。
3. 有数据时的滚动：用SingleChildScrollView包裹原ListView.separated，并传入DraggableScrollableSheet的controller，保持弹窗的拖拽滚动功能；同时给内部ListView.separated设置shrinkWrap: true和NeverScrollableScrollPhysics()，避免嵌套滚动冲突。

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