showBottomSheet method

PersistentBottomSheetController showBottomSheet(
  1. WidgetBuilder builder,
  2. {Color? backgroundColor,
  3. double? elevation,
  4. ShapeBorder? shape,
  5. Clip? clipBehavior,
  6. BoxConstraints? constraints,
  7. bool? enableDrag,
  8. AnimationController? transitionAnimationController}

Shows a Material Design bottom sheet in the nearest Scaffold. To show a persistent bottom sheet, use the Scaffold.bottomSheet.

Returns a controller that can be used to close and otherwise manipulate the bottom sheet.

To rebuild the bottom sheet (e.g. if it is stateful), call PersistentBottomSheetController.setState on the controller returned by this method.

The new bottom sheet becomes a LocalHistoryEntry for the enclosing ModalRoute and a back button is added to the app bar of the Scaffold that closes the bottom sheet.

The transitionAnimationController controls the bottom sheet's entrance and exit animations. It's up to the owner of the controller to call AnimationController.dispose when the controller is no longer needed.

To create a persistent bottom sheet that is not a LocalHistoryEntry and does not add a back button to the enclosing Scaffold's app bar, use the Scaffold.bottomSheet constructor parameter.

A persistent bottom sheet shows information that supplements the primary content of the app. A persistent bottom sheet remains visible even when the user interacts with other parts of the app.

A closely related widget is a modal bottom sheet, which is an alternative to a menu or a dialog and prevents the user from interacting with the rest of the app. Modal bottom sheets can be created and displayed with the showModalBottomSheet function.

This example demonstrates how to use showBottomSheet to display a bottom sheet when a user taps a button. It also demonstrates how to close a bottom sheet using the Navigator.

To create a local project with this code sample, run:
flutter create --sample=material.ScaffoldState.showBottomSheet.1 mysample

See also:


PersistentBottomSheetController showBottomSheet(
  WidgetBuilder builder, {
  Color? backgroundColor,
  double? elevation,
  ShapeBorder? shape,
  Clip? clipBehavior,
  BoxConstraints? constraints,
  bool? enableDrag,
  AnimationController? transitionAnimationController,
}) {
  assert(() {
    if (widget.bottomSheet != null) {
      throw FlutterError(
        'Scaffold.bottomSheet cannot be specified while a bottom sheet '
        'displayed with showBottomSheet() is still visible.\n'
        'Rebuild the Scaffold with a null bottomSheet before calling showBottomSheet().',
    return true;

  final AnimationController controller = (transitionAnimationController ?? BottomSheet.createAnimationController(this))..forward();
  setState(() {
    _currentBottomSheet = _buildBottomSheet(
      isPersistent: false,
      animationController: controller,
      backgroundColor: backgroundColor,
      elevation: elevation,
      shape: shape,
      clipBehavior: clipBehavior,
      constraints: constraints,
      enableDrag: enableDrag,
      shouldDisposeAnimationController: transitionAnimationController == null,
  return _currentBottomSheet!;