如何让Flutter的DraggableScrollableSheet自适应尺寸以显示全部内容？

针对你遇到的底部弹窗在iPhone上内容被截断、无法自适应显示全部内容的问题，提供以下几个可行方案：

方案一：手动处理安全区域，调整最大高度比例 #

默认的useSafeArea: true会让弹窗整体避开安全区域，但iPhone底部安全区域占比高，会压缩内容可用高度。可以关闭弹窗的useSafeArea，在内部给内容单独添加安全区域，并计算扣除安全区域后的最大高度比例：

await showModalBottomSheet(
  useSafeArea: false,
  isScrollControlled: true,
  context: context,
  builder: (context) {
    final screenHeight = MediaQuery.of(context).size.height;
    final safeAreaBottom = MediaQuery.of(context).padding.bottom;
    // 计算扣除底部安全区域后的最大高度比例，确保内容不被安全区域遮挡
    final maxHeightRatio = (screenHeight - safeAreaBottom) / screenHeight * 0.9;
    
    return DraggableScrollableSheet(
      expand: false,
      initialChildSize: 0.75,
      maxChildSize: maxHeightRatio,
      builder: (context, scrollController) {
        return SafeArea(
          bottom: true,
          child: ViewPlaceSheet(
            place: widget.place,
            scrollController: scrollController,
          ),
        );
      },
    );
  },
);

方案二：用滚动组件+自适应高度约束 #

让内容通过SingleChildScrollView处理滚动，同时用IntrinsicHeight和ConstrainedBox确保内容自适应高度，避免留白过多：

await showModalBottomSheet(
  useSafeArea: true,
  isScrollControlled: true,
  context: context,
  builder: (context) => DraggableScrollableSheet(
    expand: false,
    minChildSize: 0.5, // 设置弹窗最小高度，避免过于紧凑
    maxChildSize: 0.9,
    builder: (context, scrollController) {
      return LayoutBuilder(
        builder: (context, constraints) {
          return SingleChildScrollView(
            controller: scrollController,
            child: ConstrainedBox(
              // 确保内容最小高度至少为弹窗初始可用高度，避免留白
              constraints: BoxConstraints(minHeight: constraints.maxHeight),
              child: IntrinsicHeight(
                child: ViewPlaceSheet(
                  place: widget.place,
                  scrollController: null, // 滚动由SingleChildScrollView处理
                ),
              ),
            ),
          );
        },
      );
    },
  ),
);

方案三：动态计算内容高度设置初始尺寸 #

通过GlobalKey获取内容实际高度，结合DraggableScrollableController动态设置弹窗初始尺寸，既保证内容全显示，又限制最大高度：

// 1. 创建全局key用于获取内容高度
final contentKey = GlobalKey();
final scrollController = DraggableScrollableController();

await showModalBottomSheet(
  useSafeArea: true,
  isScrollControlled: true,
  context: context,
  builder: (context) => DraggableScrollableSheet(
    controller: scrollController,
    expand: false,
    maxChildSize: 0.9,
    builder: (context, sheetScrollController) {
      return ViewPlaceSheet(
        key: contentKey,
        place: widget.place,
        scrollController: sheetScrollController,
      );
    },
  ),
);

// 2. 布局完成后计算内容高度，调整弹窗初始尺寸
WidgetsBinding.instance.addPostFrameCallback((_) {
  final renderBox = contentKey.currentContext?.findRenderObject() as RenderBox?;
  if (renderBox == null) return;
  
  final contentHeight = renderBox.size.height;
  final screenHeight = MediaQuery.of(context).size.height;
  // 计算初始比例，限制在0.5到0.9之间
  final initialRatio = (contentHeight / screenHeight).clamp(0.5, 0.9);
  scrollController.jumpTo(initialRatio);
});

注意：使用此方案时，ViewPlaceSheet的根组件需要是能正确计算尺寸的容器（如Container），确保GlobalKey能获取到准确的高度。

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