show<T> static method

Future<T?> show<T>({
  1. required BuildContext context,
  2. required WidgetBuilder builder,
  3. String? title,
  4. bool showDragHandle = true,
  5. bool isDismissible = true,
  6. bool enableDrag = true,
  7. Color? backgroundColor,
  8. double borderRadius = 20.0,
  9. double maxHeightFactor = 0.9,
  10. EdgeInsetsGeometry padding = const EdgeInsets.fromLTRB(16, 0, 16, 16),
})

Displays a customizable modal bottom sheet.

  • context (required): The BuildContext to show the sheet from.
  • builder (required): Builds the content widget placed inside the sheet.
  • title: Optional title string. When provided, a title bar with a close button is rendered above the content.
  • showDragHandle: Whether to show the top drag-handle pill. Defaults to true.
  • isDismissible: Whether tapping the barrier closes the sheet. Defaults to true.
  • enableDrag: Whether the sheet can be dragged to dismiss. Defaults to true.
  • backgroundColor: Background color of the sheet surface. Defaults to the theme's colorScheme.surface.
  • borderRadius: Radius applied to the top two corners. Defaults to 20.0.
  • maxHeightFactor: Maximum fraction of screen height the sheet may occupy. Defaults to 0.9.
  • padding: Padding applied around the builder content. Defaults to EdgeInsets.fromLTRB(16, 0, 16, 16).

Implementation

static Future<T?> show<T>({
  required BuildContext context,
  required WidgetBuilder builder,
  String? title,
  bool showDragHandle = true,
  bool isDismissible = true,
  bool enableDrag = true,
  Color? backgroundColor,
  double borderRadius = 20.0,
  double maxHeightFactor = 0.9,
  EdgeInsetsGeometry padding = const EdgeInsets.fromLTRB(16, 0, 16, 16),
}) {
  return showModalBottomSheet<T>(
    context: context,
    isScrollControlled: true,
    isDismissible: isDismissible,
    enableDrag: enableDrag,
    backgroundColor: Colors.transparent,
    builder: (BuildContext sheetContext) {
      final Color surfaceColor = backgroundColor ??
          Theme.of(sheetContext).colorScheme.surface;

      return ConstrainedBox(
        constraints: BoxConstraints(
          maxHeight:
              MediaQuery.of(sheetContext).size.height * maxHeightFactor,
        ),
        child: Container(
          decoration: BoxDecoration(
            color: surfaceColor,
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(borderRadius),
              topRight: Radius.circular(borderRadius),
            ),
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              // Drag handle pill
              if (showDragHandle)
                Padding(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  child: Center(
                    child: Container(
                      width: 40,
                      height: 4,
                      decoration: BoxDecoration(
                        color: Colors.grey.shade300,
                        borderRadius: BorderRadius.circular(2),
                      ),
                    ),
                  ),
                ),

              // Title row
              if (title != null)
                Padding(
                  padding:
                      const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                  child: Row(
                    children: [
                      Expanded(
                        child: Text(
                          title,
                          style: Theme.of(sheetContext)
                              .textTheme
                              .titleMedium
                              ?.copyWith(fontWeight: FontWeight.bold),
                        ),
                      ),
                      IconButton(
                        icon: Icon(
                          Icons.close,
                          size: 20,
                          color: Colors.black.withValues(alpha: 0.5),
                        ),
                        onPressed: () => Navigator.pop(sheetContext),
                        splashRadius: 20,
                        padding: EdgeInsets.zero,
                        constraints: const BoxConstraints(),
                      ),
                    ],
                  ),
                ),

              // Content
              Flexible(
                child: Padding(
                  padding: padding,
                  child: builder(sheetContext),
                ),
              ),
            ],
          ),
        ),
      );
    },
  );
}