Gallery example: Add missing controls

The previous gallery example was missing several controls, which
limited its usefulness for demonstration and testing purposes. This
patch adds the missing controls, ensuring the example now provides a
comprehensive overview.

Pick-to: 6.10
Change-Id: I79115bfffd581ca20af1c2a206a145c5362311bb
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>

examples/quickcontrols/gallery/CMakeLists.txt

@@ -32,6 +32,8 @@ qt_add_qml_module(galleryexample
         "pages/FramePage.qml"
         "pages/GalleryConfig.qml"
         "pages/GroupBoxPage.qml"
+        "pages/MenuBarPage.qml"
+        "pages/MonthGridPage.qml"
         "pages/PageIndicatorPage.qml"
         "pages/ProgressBarPage.qml"
         "pages/RadioButtonPage.qml"
@@ -42,13 +44,17 @@ qt_add_qml_module(galleryexample
         "pages/SearchFieldPage.qml"
         "pages/SliderPage.qml"
         "pages/SpinBoxPage.qml"
+        "pages/SplitViewPage.qml"
         "pages/StackViewPage.qml"
         "pages/SwipeViewPage.qml"
         "pages/SwitchPage.qml"
         "pages/TabBarPage.qml"
+        "pages/TableViewPage.qml"
         "pages/TextAreaPage.qml"
         "pages/TextFieldPage.qml"
+        "pages/ToolBarPage.qml"
         "pages/ToolTipPage.qml"
+        "pages/TreeViewPage.qml"
         "pages/TumblerPage.qml"
     RESOURCES
         "icons/gallery/20x20/back.png"

examples/quickcontrols/gallery/gallery.qml

@@ -143,6 +143,8 @@ ApplicationWindow {
                 ListElement { title: qsTr("Delegates"); source: "qrc:/pages/DelegatePage.qml" }
                 ListElement { title: qsTr("Frame"); source: "qrc:/pages/FramePage.qml" }
                 ListElement { title: qsTr("GroupBox"); source: "qrc:/pages/GroupBoxPage.qml" }
+                ListElement { title: qsTr("MenuBar"); source: "qrc:/pages/MenuBarPage.qml" }
+                ListElement { title: qsTr("MonthGrid"); source: "qrc:/pages/MonthGridPage.qml" }
                 ListElement { title: qsTr("PageIndicator"); source: "qrc:/pages/PageIndicatorPage.qml" }
                 ListElement { title: qsTr("ProgressBar"); source: "qrc:/pages/ProgressBarPage.qml" }
                 ListElement { title: qsTr("RadioButton"); source: "qrc:/pages/RadioButtonPage.qml" }
@@ -152,13 +154,17 @@ ApplicationWindow {
                 ListElement { title: qsTr("SearchField"); source: "qrc:/pages/SearchFieldPage.qml" }
                 ListElement { title: qsTr("Slider"); source: "qrc:/pages/SliderPage.qml" }
                 ListElement { title: qsTr("SpinBox"); source: "qrc:/pages/SpinBoxPage.qml" }
+                ListElement { title: qsTr("SplitView"); source: "qrc:/pages/SplitViewPage.qml" }
                 ListElement { title: qsTr("StackView"); source: "qrc:/pages/StackViewPage.qml" }
                 ListElement { title: qsTr("SwipeView"); source: "qrc:/pages/SwipeViewPage.qml" }
                 ListElement { title: qsTr("Switch"); source: "qrc:/pages/SwitchPage.qml" }
                 ListElement { title: qsTr("TabBar"); source: "qrc:/pages/TabBarPage.qml" }
+                ListElement { title: qsTr("TableView"); source: "qrc:/pages/TableViewPage.qml" }
                 ListElement { title: qsTr("TextArea"); source: "qrc:/pages/TextAreaPage.qml" }
                 ListElement { title: qsTr("TextField"); source: "qrc:/pages/TextFieldPage.qml" }
+                ListElement { title: qsTr("ToolBar"); source: "qrc:/pages/ToolBarPage.qml" }
                 ListElement { title: qsTr("ToolTip"); source: "qrc:/pages/ToolTipPage.qml" }
+                ListElement { title: qsTr("TreeView"); source: "qrc:/pages/TreeViewPage.qml" }
                 ListElement { title: qsTr("Tumbler"); source: "qrc:/pages/TumblerPage.qml" }
             }
 

examples/quickcontrols/gallery/pages/ButtonPage.qml

@@ -12,6 +12,24 @@ ScrollablePage {
         spacing: 40
         width: parent.width
 
+        Row {
+            CheckBox {
+                id: checkedCheckBox
+                text: qsTr("Checked")
+            }
+
+            CheckBox {
+                id: flatCheckBox
+                text: qsTr("Flat")
+            }
+
+            CheckBox {
+                id: pressedCheckBox
+                enabled: !GalleryConfig.disabled
+                text: qsTr("Pressed")
+            }
+        }
+
         Label {
             width: parent.width
             wrapMode: Label.Wrap
@@ -25,17 +43,30 @@ ScrollablePage {
             anchors.horizontalCenter: parent.horizontalCenter
 
             Button {
-                text: qsTr("First")
                 enabled: !GalleryConfig.disabled
+                text: qsTr("Button")
+                checked: checkedCheckBox.checked
+                flat: flatCheckBox.checked
+                down: pressedCheckBox.checked ? true : undefined
                 Layout.fillWidth: true
             }
             Button {
-                id: button
-                text: qsTr("Second")
                 enabled: !GalleryConfig.disabled
+                text: qsTr("Highlighted")
+                checked: checkedCheckBox.checked
+                flat: flatCheckBox.checked
+                down: pressedCheckBox.checked ? true : undefined
                 highlighted: true
                 Layout.fillWidth: true
             }
+            RoundButton {
+                enabled: !GalleryConfig.disabled
+                text: qsTr("RoundButton")
+                checked: checkedCheckBox.checked
+                flat: flatCheckBox.checked
+                down: pressedCheckBox.checked ? true : undefined
+                Layout.fillWidth: true
+            }
         }
     }
 }

examples/quickcontrols/gallery/pages/MenuBarPage.qml

@@ -0,0 +1,42 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+
+Page {
+    id: page
+    enabled: !GalleryConfig.disabled
+
+    header: MenuBar {
+        Menu {
+            title: qsTr("&File")
+            Action { text: qsTr("&New...") }
+            Action { text: qsTr("&Open...") }
+            Action { text: qsTr("&Save") }
+            Action { text: qsTr("Save &As...") }
+            MenuSeparator { }
+            Action { text: qsTr("&Quit") }
+        }
+        Menu {
+            title: qsTr("&Edit")
+            Action { text: qsTr("Cu&t") }
+            Action { text: qsTr("&Copy") }
+            Action { text: qsTr("&Paste") }
+        }
+        Menu {
+            title: qsTr("&Help")
+            Action { text: qsTr("&About") }
+        }
+    }
+
+    Label {
+        anchors.verticalCenter: parent.verticalCenter
+        width: parent.width
+        wrapMode: Label.Wrap
+        horizontalAlignment: Qt.AlignHCenter
+        text: qsTr("MenuBar provides a horizontal bar with drop-down menus, "
+                 + "allowing users to access grouped commands and actions "
+                 + "within an application.")
+    }
+}

examples/quickcontrols/gallery/pages/MonthGridPage.qml

@@ -0,0 +1,102 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+Page {
+    id: page
+    enabled: !GalleryConfig.disabled
+
+    Column {
+        spacing: 40
+        width: parent.width
+
+        Label {
+            width: parent.width
+            wrapMode: Label.Wrap
+            horizontalAlignment: Qt.AlignHCenter
+            text: qsTr("MonthGrid presents a calendar month as a grid of days, "
+                     + "calculated for a specific month, year, and locale.")
+        }
+
+        ColumnLayout {
+            spacing: 20
+            anchors.horizontalCenter: parent.horizontalCenter
+
+            RowLayout {
+                spacing: 10
+                Layout.fillWidth: true
+
+                Button {
+                    implicitWidth: height
+                    enabled: !GalleryConfig.disabled
+                    flat: true
+                    text: qsTr("<")
+                    onClicked: {
+                        const new_month = monthGrid.month - 1
+                        if (new_month < 0) {
+                            monthGrid.month = 11
+                            --monthGrid.year
+                        } else {
+                            monthGrid.month = new_month
+                        }
+                    }
+                }
+                Item {
+                    Layout.fillHeight: true
+                    Layout.fillWidth: true
+                    Label {
+                        anchors.centerIn: parent
+                        text: qsTr("%1 %2").arg(monthGrid.locale.monthName(monthGrid.month))
+                                           .arg(monthGrid.year)
+                    }
+                }
+                Button {
+                    implicitWidth: height
+                    enabled: !GalleryConfig.disabled
+                    flat: true
+                    text: qsTr(">")
+                    onClicked: {
+                        const new_month = monthGrid.month + 1
+                        if (new_month >= 12) {
+                            monthGrid.month = 0
+                            ++monthGrid.year
+                        } else {
+                            monthGrid.month = new_month
+                        }
+                    }
+                }
+            }
+
+            GridLayout {
+                columns: 2
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+
+                DayOfWeekRow {
+                    locale: monthGrid.locale
+                    Layout.fillWidth: true
+                    Layout.column: 1
+                }
+
+                WeekNumberColumn {
+                    locale: monthGrid.locale
+                    year: monthGrid.year
+                    month: monthGrid.month
+                    Layout.fillHeight: true
+                }
+
+                MonthGrid {
+                    id: monthGrid
+                    locale: Qt.locale("en_US")
+                    year: currentDate.getFullYear()
+                    month: currentDate.getMonth()
+                    readonly property date currentDate: new Date()
+                    Layout.fillWidth: true
+                }
+            }
+        }
+    }
+}

examples/quickcontrols/gallery/pages/ScrollBarPage.qml

@@ -19,6 +19,12 @@ Flickable {
             spacing: 40
             width: parent.width
 
+            CheckBox {
+                id: alwaysOnCheckBox
+                width: parent.width
+                text: qsTr("Always on")
+            }
+
             Label {
                 width: parent.width
                 wrapMode: Label.Wrap
@@ -36,5 +42,7 @@ Flickable {
         }
     }
 
-    ScrollBar.vertical: ScrollBar { }
+    ScrollBar.vertical: ScrollBar {
+        policy: alwaysOnCheckBox.checked ? ScrollBar.AlwaysOn : ScrollBar.AsNeeded
+    }
 }

examples/quickcontrols/gallery/pages/SplitViewPage.qml

@@ -0,0 +1,73 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+Page {
+    id: page
+    enabled: !GalleryConfig.disabled
+
+    ColumnLayout {
+        anchors.fill: parent
+        spacing: 40
+
+        CheckBox {
+            id: orientationCheckBox
+            text: qsTr("Vertical")
+        }
+
+        Label {
+            wrapMode: Label.Wrap
+            horizontalAlignment: Qt.AlignHCenter
+            text: qsTr("SplitView provides a container that arranges items horizontally "
+                     + "or vertically, separated by draggable splitters, allowing users "
+                     + "to interactively resize adjacent views within an application.")
+            Layout.fillWidth: true
+        }
+
+        SplitView {
+            orientation: orientationCheckBox.checked ? Qt.Vertical : Qt.Horizontal
+            Layout.fillHeight: true
+            Layout.fillWidth: true
+
+            Rectangle {
+                implicitWidth: 200
+                implicitHeight: 100
+                color: "lightblue"
+                SplitView.maximumWidth: 400
+
+                Label {
+                    text: "View 1"
+                    anchors.centerIn: parent
+                }
+            }
+
+            Rectangle {
+                id: centerItem
+                color: "lightgray"
+                SplitView.minimumWidth: 50
+                SplitView.minimumHeight: 50
+                SplitView.fillWidth: true
+                SplitView.fillHeight: true
+
+                Label {
+                    text: "View 2"
+                    anchors.centerIn: parent
+                }
+            }
+
+            Rectangle {
+                implicitWidth: 200
+                implicitHeight: 100
+                color: "lightgreen"
+
+                Label {
+                    text: "View 3"
+                    anchors.centerIn: parent
+                }
+            }
+        }
+    }
+}

examples/quickcontrols/gallery/pages/TableViewPage.qml

@@ -0,0 +1,90 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Qt.labs.qmlmodels
+
+Page {
+    id: page
+    enabled: !GalleryConfig.disabled
+
+    GridLayout {
+        anchors.fill: parent
+
+        Label {
+            wrapMode: Label.Wrap
+            horizontalAlignment: Qt.AlignHCenter
+            text: qsTr("TableView provides a scrollable grid that displays data from "
+                       + "a model in rows and columns, allowing users to view and interact "
+                       + "with structured information within an application.")
+            Layout.fillWidth: true
+            Layout.columnSpan: 2
+        }
+
+        HorizontalHeaderView {
+            clip: true
+            syncView: tableView
+            model: tableModel.headerModel
+            Layout.column: 1
+            Layout.row: 1
+            Layout.fillWidth: true
+        }
+
+        VerticalHeaderView {
+            clip: true
+            syncView: tableView
+            Layout.column: 0
+            Layout.row: 2
+            Layout.fillHeight: true
+        }
+
+        TableView {
+            id: tableView
+            columnSpacing: 1
+            rowSpacing: 1
+            clip: true
+
+            selectionModel: ItemSelectionModel {}
+            model: tableModel
+
+            Layout.column: 1
+            Layout.row: 2
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            delegate: TableViewDelegate {
+                implicitWidth: 100
+                implicitHeight: 50
+                Component.onCompleted: {
+                    if (contentItem as Label) {
+                        contentItem.horizontalAlignment = Qt.AlignHCenter
+                        contentItem.verticalAlignment = Qt.AlignVCenter
+                    }
+                }
+            }
+        }
+    }
+
+    TableModel {
+        id: tableModel
+        property var headerModel: [qsTr("Name"), qsTr("Color")]
+        TableModelColumn { display: "name" }
+        TableModelColumn { display: "color" }
+        rows: [
+            {
+                "name": qsTr("cat"),
+                "color": qsTr("black")
+            },
+            {
+                "name": qsTr("dog"),
+                "color": qsTr("brown")
+            },
+            {
+                "name": qsTr("bird"),
+                "color": qsTr("white")
+            }
+        ]
+    }
+}

examples/quickcontrols/gallery/pages/ToolBarPage.qml

@@ -0,0 +1,74 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+Page {
+    id: page
+    enabled: !GalleryConfig.disabled
+
+    header: ToolBar {
+        RowLayout {
+            anchors.fill: parent
+
+            Item {
+                Layout.fillHeight: true
+                Layout.preferredWidth: height
+            }
+
+            Label {
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+                text: qsTr("Header")
+
+                Layout.fillHeight: true
+                Layout.fillWidth: true
+            }
+
+            ToolSeparator { }
+
+            ToolButton { text: "\u2699" }
+        }
+    }
+
+    Label {
+        anchors.centerIn: parent
+        width: parent.width - 20
+        wrapMode: Label.Wrap
+        horizontalAlignment: Qt.AlignHCenter
+        text: qsTr("ToolBar provides a horizontal container for application-wide "
+                 + "and context-sensitive controls, such as navigation buttons and "
+                 + "search fields, typically used as a header or footer within an "
+                 + "application window")
+    }
+
+    footer: ToolBar {
+        RowLayout {
+            anchors.fill: parent
+
+            Label {
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+                text: "\u2139"
+
+                Layout.fillHeight: true
+                Layout.preferredWidth: height
+            }
+
+            Label {
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+                text: qsTr("Footer")
+
+                Layout.fillHeight: true
+                Layout.fillWidth: true
+            }
+
+            ToolSeparator { }
+
+            ToolButton { text: "\u2630" }
+        }
+    }
+}

examples/quickcontrols/gallery/pages/TreeViewPage.qml

@@ -0,0 +1,113 @@
+// Copyright (C) 2025 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Qt.labs.qmlmodels
+
+Page {
+    id: page
+
+    GridLayout {
+        anchors.fill: parent
+        anchors.margins: 10
+
+        Label {
+            wrapMode: Label.Wrap
+            horizontalAlignment: Qt.AlignHCenter
+            text: qsTr("TreeView provides a hierarchical view for displaying and "
+                     + "navigating tree-structured data, allowing users to expand and "
+                     + "collapse nodes to explore parent-child relationships within a model")
+
+            Layout.fillWidth: true
+            Layout.columnSpan: 2
+        }
+
+        Item {
+            implicitHeight: 40
+
+            Layout.columnSpan: 2
+            Layout.row: 1
+        }
+
+        HorizontalHeaderView {
+            clip: true
+            enabled: !GalleryConfig.disabled
+            syncView: treeView
+            model: [qsTr("Location")]
+
+            Layout.column: 1
+            Layout.row: 2
+            Layout.fillWidth: true
+        }
+
+        VerticalHeaderView {
+            clip: true
+            enabled: !GalleryConfig.disabled
+            syncView: treeView
+            model: Array.from({length: treeView.rows}, (v, k) => k + 1)
+
+            Layout.column: 0
+            Layout.row: 3
+            Layout.fillHeight: true
+        }
+
+        TreeView {
+            id: treeView
+            clip: true
+            enabled: !GalleryConfig.disabled
+            rowSpacing: 2
+            model: treeModel
+
+            Layout.column: 1
+            Layout.row: 3
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            selectionModel: ItemSelectionModel {}
+            delegate: TreeViewDelegate { }
+
+            columnWidthProvider: (column) => column === 0 ? treeView.width : 0
+
+            Component.onCompleted: expandRecursively()
+        }
+    }
+
+    TreeModel {
+        id: treeModel
+
+        TableModelColumn { display: "location" }
+
+        rows: [
+            {
+                location: qsTr("America"),
+                rows: [
+                    { location: qsTr("Brazil") },
+                    {
+                        location: qsTr("Canada"),
+                        rows: [
+                            { location: qsTr("Calgary") },
+                            { location: qsTr("Vancouver") }
+                        ]
+                    }
+                ]
+            },
+            { location: qsTr("Asia") },
+            {
+                location: qsTr("Europe"),
+                rows: [
+                    {
+                        location: qsTr("Italy"),
+                        rows: [
+                            { location: qsTr("Milan") },
+                            { location: qsTr("Rome") }
+                        ]
+                    },
+                    { location: qsTr("Portugal") }
+                ]
+            }
+
+        ]
+    }
+}