Skip to main content

Variable: AdwBottomSheet

const AdwBottomSheet: "AdwBottomSheet"

Defined in: generated/jsx.ts:13731

A bottom sheet with an optional bottom bar.

bottom-sheet

AdwBottomSheet has three child widgets. BottomSheet.content is shown persistently. BottomSheet.sheet is displayed above it when it's open, and BottomSheet.bottom-bar is displayed when it's not.

Bottom sheet and bottom bar are attached to the bottom edge of the widget. They take the full width by default, but can only take a portion of it if BottomSheet.full-width is set to FALSE. In this case, BottomSheet.align determines where along the bottom edge they are placed.

Bottom bar can be hidden using the BottomSheet.reveal-bottom-bar property.

AdwBottomSheet can be useful for applications such as music players, that want to have a persistent bottom bar that expands into a bottom sheet when clicked. It's meant for cases where a bottom sheet is tightly integrated into the UI. For more transient bottom sheets, see Dialog.

To open or close the bottom sheet, use the BottomSheet.open property.

By default, the bottom sheet has an overlaid drag handle. It can be disabled by setting BottomSheet.show-drag-handle to FALSE. Note that the handle also controls whether the sheet can be dragged using a pointer.

Bottom sheets are modal by default, meaning that the content is dimmed and cannot be accessed while the sheet is open. Set BottomSheet.modal to FALSE if this behavior is unwanted.

To disable user interactions for opening or closing the bottom sheet (such as swipes or clicking the bottom bar or close button), set BottomSheet.can-open or BottomSheet.can-close to FALSE.

In some cases, particularly when using a full-width bottom bar, it may be necessary to shift BottomSheet.content upwards. Use the BottomSheet.bottom-bar-height and BottomSheet.sheet-height for that.

AdwBottomSheet is not adaptive, and for larger window sizes applications may want to replace it with another UI, such as a sidebar. This can be done using MultiLayoutView.

Sizing​

Unlike Dialog presented as a bottom sheet, AdwBottomSheet just follows the content's natural size, and it's up to the applications to make sure their content provides one. For example, when using Gtk.ScrolledWindow, make sure to set Gtk.ScrolledWindow.propagate-natural-height to TRUE.

Header Bar Integration​

When placed inside an AdwBottomSheet, HeaderBar will not show the title when BottomSheet.show-drag-handle is TRUE, regardless of HeaderBar.show-title. This only applies to the default title, titles set with HeaderBar.title-widget will still be shown.

AdwBottomSheet as GtkBuildable:​

The AdwBottomSheet implementation of the Gtk.Buildable interface supports setting the sheet widget by specifying “sheet” as the “type” attribute of a <child> element, and the bottom bar by specifying “bottom-bar”. Specifying “content” or omitting the child type results in setting the content child.