BottomSheet QML Type | Fluid Reference Documentation

- Fluid Reference Documentation
- Fluid 1.2.0

# BottomSheet QML Type

A sheet of paper that slides up from the bottom. More...

Import Statement: | import Fluid.Controls 1.1
Inherited By: | BottomSheetGrid

- List of all members, including inherited members

## Properties

- maxHeight : int

## Detailed Description

A sheet of paper that slides up from the bottom edge of the screen and presents a set of clear and simple actions.

     import QtQuick 2.10
     import QtQuick.Controls 2.3
     import QtQuick.Controls.Material 2.3
     import Fluid.Controls 1.0 as FluidControls

     Item {
         Button {
             anchors.centerIn: parent
             text: qsTr("Press Me")
             onClicked: customBottomSheet.open()
         }

         FluidControls.BottomSheet {
             id: customBottomSheet

             Column {
                 width: parent.width

                 Pane {
                     width: parent.width
                     padding: 16

                     Column {
                         spacing: 8

                         FluidControls.TitleLabel {
                             text: "freedom"
                         }

                         FluidControls.BodyLabel {
                             text: "/ˈfriːdəm/"
                             color: Material.secondaryTextColor
                         }
                     }

                     Material.background: Material.color(Material.Yellow, Material.Shade800)
                 }

                 Pane {
                     width: parent.width
                     implicitHeight: 100
                     padding: 16

                     Column {
                         FluidControls.SubheadingLabel {
                             text: "noun"
                             color: Material.secondaryTextColor
                         }

                         FluidControls.BodyLabel {
                             text: "the right to live in the way you want without being controlled by anyone else"
                         }
                     }
                 }
             }
         }
     }

For more information you can read the Material Design guidelines.

## Property Documentation

maxHeight : int

Maximum height of the bottom sheet.

By default it's set to the height of the `ApplicationWindow` minus `AppBar` height.