Liri Fluid API

BottomSheet QML Type

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

Import Statement: import Fluid.Controls 1.1
Inherited By:

BottomSheetGrid

Properties

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.