MauiKit Controls
Page.qml
33 * <a href="https://doc.qt.io/qt-6/qml-qtquick-controls-pane.html">This control inherits from QQC2 Pane, to checkout its inherited properties refer to the Qt Docs.</a>
35 * This page has a predefined header and footer bars that by default are set to a MauiKit ToolBar.
40 * Any other item can replace the header and/or footer. And the default toolbars can be populated easily via the aliases:
59 * @image html Page/page_structure.png "A Page with a header and footer - and then the header moved to the bottom under the footer"
61 * @note The Page control supports the Controls attached properties for level, status and showCSD. By default a Page level is set to be Secondary, but if the Page has been set to display the Client Side Decoration buttons via `Controls.showCSD`, then it will be set as Primary. This `level` property is then propagated to the deafult header bar.
65 * Among other features, the page can make use of a reference to a flickable element to allow to have "pull-back toolbar" behaviour, floating toolbars, etc.
69 * Pull-back bars allow to expand the content area by pulling away the header or footer when content is being flicked/scrolled - which is useful on phone screens. To enable this behaviour you need to reference the Flickable element via the `flickable` property.
72 * Then set the header/footer positioning properties to `ListView.PullBackHeader`. This property is automatically set to the default header if a flickable element has been assigned, so you can disable it by setting the property to `ListView.InlineHeader` instead.
78 * As mentioned before, the Page has a header and footer area- the header can be moved to the bottom via the alternate header property: `altHeader`. But you can also stack multiple bars vertically. So you can have two or more header/footer bars.
108 * The header/footer layout is handled by a Column control, which can be accessed via the aliases to tweak the spacing, for example.
112 * @image html Page/headerColumn.png "A Page with a default header bar and two rectangles stacked as part of the header column"
116 * The header and/or footer bars can be set to a floating position - which means they will flow over the page contents at the bottom and top. When this is enable a translucency effect will be applied to hint about the content being covered underneath.
120 * The bars can also be set to auto-hide, when the cursor moves out or shown again when the cursor enters the bar area.
128 * And to finetune the target area which reacts to enter and exit events, use the margins property:
132 * @image html Page/floating_header.png "A Page with a floating header - and a translucent effect"
135 * This component is an alternative to the QQC2 Page control, where the header and footer can not be moved easily - and it adds a few more functionality.
137 * The padding properties will affect the header and footer, so if instead you meant to add internal padding to the page contents, you can use the margins properties.
139 * When used in a StackView or SwipeView, this Page emits two signals for the go forward/back actions, which can be consumed to pop or push pages.
156 * @image html Page/alt_header_dark.png "An ApplicationWindow filled with a Page and with the CSD controls enabled"
158 * <a href="https://invent.kde.org/maui/mauikit/-/blob/qt6-2/examples/Page.qml">You can find a more complete example at this link.</a>
160 * @note This control supports the attached Controls.showCSD property to display the window control buttons when using CSD. This is only supported if used with the MauiKit ToolBar as the header bar - which is the default. If use with another header element, the window control buttons need to be added manually.
176 Maui.Controls.level: control.Maui.Controls.showCSD === true ? Maui.Controls.Primary : Maui.Controls.Secondary
193 readonly property alias pageContent : _content
203 * @brief A flickable element can be referenced in order to support the header and footer positioning options such as Inline, Pullback or floating.
205 * And watch for changes in the Flickable properties, such as contentX and contentY in order to support the formerly mentioned features.
210 * @brief The footer bar can be place static and always visible with the InlineFooter value, or moved along with the flickable contents when using the PullBackFooter value.
222 * @brief The header bar can be place static and always visible with the InlineHeader value, or moved along with the flickable contents when using the PullBackHeader value.
226 * By default this is set to `InlineHeader` unless a Flickable has been attached, in which case it is set to `PullBackHeader`.
232 property int headerPositioning : flickable ? ListView.PullBackHeader : ListView.InlineHeader
248 * This title is shown in the middle of the default header bar if the show title property is set to true.
255 * @brief If a title is set and this is set to true, such title will be displayed in the default header bar in the middle.
292 property alias headerColumn : _headerContent.data
305 property int margins: 0
310 property int leftMargin : margins
315 property int rightMargin: margins
320 property int topMargin: margins
325 property int bottomMargin: margins
346 * @brief Size in pixels for the cursor enter/exit threshold for when the header should autohide.
352 * @brief Size in pixels for the cursor enter/exit threshold for when the footer should autohide.
371 * @brief If the header bar should float over the page contents, if set- then the default footer bar will have a translucent `ShaderEffect` to hint about the content under it.
394 property int topMargin : (!control.altHeader ? (control.floatingHeader ? 0 : _headerContent.implicitHeight) : 0) + control.topMargin
395 property int bottomMargin: ((control.floatingFooter && control.footerPositioning === ListView.InlineFooter ? 0 : _footerContent.implicitHeight) + (control.altHeader ? _headerContent.implicitHeight : 0))
405 when: control.floatingFooter && control.footerPositioning === ListView.InlineFooter && _footerContent.implicitHeight > 0
416 enabled: control.flickable && ((control.header && control.headerPositioning === ListView.PullBackHeader) || (control.footer && control.footerPositioning === ListView.PullBackFooter))
446 if (control.footer && control.footerPositioning === ListView.PullBackFooter && control.footer.visible)
454 if (control.header && control.headerPositioning === ListView.PullBackHeader && control.header.visible && !control.altHeader)
463 if (control.header && oldHHeight !== control.header.height && control.header.visible && !control.altHeader)
476 if (control.header && control.header.visible && control.headerPositioning === ListView.PullBackHeader && !control.altHeader)
480 if (control.header.height >= (control.header.implicitHeight/2) || control.flickable.atYBeginning )
490 if (control.footer && control.footer.visible && control.footerPositioning === ListView.PullBackFooter)
527 Maui.Controls.showCSD: control.Maui.Controls.showCSD && control.Maui.Controls.showCSD === true && !control.altHeader
537 Qt.rect(0, (_headBar.position === ToolBar.Header ? 0 : _content.height - _headBar.background.height), _headBar.background.width, _headBar.background.height)
538 : Qt.rect(0, (_headBar.position === ToolBar.Header ? 0 - (_headerContent.implicitHeight) : _content.height), _headBar.background.width, _headBar.background.height))
597 //text: _footBar.visibleCount + " / " + _footBar.count + " - " + _footBar.height + " / " + footer.height + " - " + _footBar.visible + " / " + footer.visible + " / " + footer.height + " / " + _footerContent.implicitHeight + " / " + _footerContent.implicitHeight
619 sourceRect: _footBar.background ? (control.floatingFooter ? Qt.rect(0, _content.height - _footBar.background.height, _footBar.background.width, _footBar.background.height) : Qt.rect(0, _content.height, _footBar.background.width, _footBar.background.height)) : Qt.rect(0,0,0,0)
An alternative to QQC2 ToolBar, with a custom horizontal layout - divided into three main sections - ...
Definition ToolBar.qml:115
void stop(Ekos::AlignState mode)
enabled
This file is part of the KDE documentation.
Documentation copyright © 1996-2024 The KDE developers.
Generated on Fri Nov 8 2024 11:48:43 by doxygen 1.12.0 written by Dimitri van Heesch, © 1997-2006
Documentation copyright © 1996-2024 The KDE developers.
Generated on Fri Nov 8 2024 11:48:43 by doxygen 1.12.0 written by Dimitri van Heesch, © 1997-2006
KDE's Doxygen guidelines are available online.