aboutsummaryrefslogtreecommitdiffstats
path: root/src/quickcontrols2/doc/snippets
diff options
context:
space:
mode:
Diffstat (limited to 'src/quickcontrols2/doc/snippets')
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-action.qml56
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-busyindicator-custom.qml92
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-button-custom.qml55
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-button-icononly.qml34
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textbesideicon.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textonly.qml34
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-custom.qml65
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-group.qml58
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-checkdelegate-custom.qml74
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-accepted.qml45
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-custom.qml114
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-find.qml40
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-popup.qml37
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-textat.qml40
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-valuerole.qml58
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-delaybutton-custom.qml82
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dial-custom.qml67
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modal.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modeless.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog.qml44
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox-attached.qml42
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox.qml38
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-frame-custom.qml43
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-frame.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-checkable.qml48
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-custom.qml57
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox.qml42
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-headerview-simple.qml119
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate-custom.qml59
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate.qml48
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-label-custom.qml36
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-label.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-accent.qml43
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-background.qml42
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-elevation.qml51
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-foreground.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-theme.qml44
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-material-variant.qml213
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-menu-custom.qml133
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar-custom.qml84
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar.qml67
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator-custom.qml69
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator.qml60
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modal.qml55
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modeless.qml55
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-overview.cmake4
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-custom.qml55
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-interactive.qml58
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-pane-custom.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-pane.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-popup-custom.qml53
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-popup.qml46
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-progressbar-custom.qml56
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-radiobutton-custom.qml65
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-radiodelegate-custom.qml74
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-rangeslider-custom.qml76
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-roundbutton.qml36
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-active.qml46
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-custom.qml53
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-non-attached.qml80
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-policy.qml38
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-active.qml46
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-custom.qml45
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-non-attached.qml84
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-custom.qml81
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-interactive.qml38
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-listview.qml63
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-policy.qml38
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview.qml60
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-selectionrectangle.qml95
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-slider-custom.qml64
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-custom.qml96
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-double.qml56
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-textual.qml56
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-custom.qml57
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-handle-containmentmask.qml64
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-custom.qml53
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-visible.qml76
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-custom.qml72
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-transition.qml37
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate.qml86
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-custom.qml39
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-indicator.qml63
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-switch-custom.qml64
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-switchdelegate-custom.qml73
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-custom.qml49
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-explicit.qml52
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-flickable.qml50
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar.qml64
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbutton.qml43
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-custom.qml42
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-scrollable.qml47
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-custom.qml43
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-disabled.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-focused.qml35
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-normal.qml34
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar-custom.qml59
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar.qml63
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbutton-custom.qml55
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator-custom.qml69
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator.qml68
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-custom.qml48
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-hover.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-pressandhold.qml39
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-slider.qml53
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip.qml51
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-custom.qml81
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-listView.qml46
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-pathView.qml57
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-timePicker.qml86
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-accent.qml43
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-background.qml44
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-foreground.qml41
-rw-r--r--src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-theme.qml44
116 files changed, 6557 insertions, 0 deletions
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-action.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-action.qml
new file mode 100644
index 0000000000..1b65a824b0
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-action.qml
@@ -0,0 +1,56 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ //! [action]
+ Action {
+ id: copyAction
+ text: qsTr("&Copy")
+ icon.name: "edit-copy"
+ shortcut: StandardKey.Copy
+ onTriggered: window.activeFocusItem.copy()
+ }
+ //! [action]
+
+ //! [toolbutton]
+ ToolButton {
+ id: toolButton
+ action: copyAction
+ }
+ //! [toolbutton]
+
+ //! [menuitem]
+ MenuItem {
+ id: menuItem
+ action: copyAction
+ text: qsTr("&Copy selected Text")
+ }
+ //! [menuitem]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-busyindicator-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-busyindicator-custom.qml
new file mode 100644
index 0000000000..8a654deb54
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-busyindicator-custom.qml
@@ -0,0 +1,92 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+BusyIndicator {
+ id: control
+
+ contentItem: Item {
+ implicitWidth: 64
+ implicitHeight: 64
+
+ Item {
+ id: item
+ x: parent.width / 2 - 32
+ y: parent.height / 2 - 32
+ width: 64
+ height: 64
+ opacity: control.running ? 1 : 0
+
+ Behavior on opacity {
+ OpacityAnimator {
+ duration: 250
+ }
+ }
+
+ RotationAnimator {
+ target: item
+ running: control.visible && control.running
+ from: 0
+ to: 360
+ loops: Animation.Infinite
+ duration: 1250
+ }
+
+ Repeater {
+ id: repeater
+ model: 6
+
+ Rectangle {
+ id: delegate
+ x: item.width / 2 - width / 2
+ y: item.height / 2 - height / 2
+ implicitWidth: 10
+ implicitHeight: 10
+ radius: 5
+ color: "#21be2b"
+
+ required property int index
+
+ transform: [
+ Translate {
+ y: -Math.min(item.width, item.height) * 0.5 + 5
+ },
+ Rotation {
+ angle: delegate.index / repeater.count * 360
+ origin.x: 5
+ origin.y: 5
+ }
+ ]
+ }
+ }
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-custom.qml
new file mode 100644
index 0000000000..095657b5a6
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-custom.qml
@@ -0,0 +1,55 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Button {
+ id: control
+ text: qsTr("Button")
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 40
+ opacity: enabled ? 1 : 0.3
+ border.color: control.down ? "#17a81a" : "#21be2b"
+ border.width: 1
+ radius: 2
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-icononly.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-icononly.qml
new file mode 100644
index 0000000000..d74000052b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-icononly.qml
@@ -0,0 +1,34 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Button {
+ icon.source: "qrc:/qt-project.org/imports/QtQuick/Controls/Basic/images/check.png"
+ display: Button.IconOnly
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textbesideicon.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textbesideicon.qml
new file mode 100644
index 0000000000..3e2aa619d0
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textbesideicon.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Button {
+ text: "Button"
+ icon.source: "qrc:/qt-project.org/imports/QtQuick/Controls/Basic/images/check.png"
+ display: Button.TextBesideIcon
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textonly.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textonly.qml
new file mode 100644
index 0000000000..59054f7714
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-button-textonly.qml
@@ -0,0 +1,34 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Button {
+ text: "Button"
+ display: Button.TextOnly
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-custom.qml
new file mode 100644
index 0000000000..93ebe46dca
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-custom.qml
@@ -0,0 +1,65 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+CheckBox {
+ id: control
+ text: qsTr("CheckBox")
+ checked: true
+
+ indicator: Rectangle {
+ implicitWidth: 26
+ implicitHeight: 26
+ x: control.leftPadding
+ y: parent.height / 2 - height / 2
+ radius: 3
+ border.color: control.down ? "#17a81a" : "#21be2b"
+
+ Rectangle {
+ width: 14
+ height: 14
+ x: 6
+ y: 6
+ radius: 2
+ color: control.down ? "#17a81a" : "#21be2b"
+ visible: control.checked
+ }
+ }
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ verticalAlignment: Text.AlignVCenter
+ leftPadding: control.indicator.width + control.spacing
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-group.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-group.qml
new file mode 100644
index 0000000000..c503216586
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkbox-group.qml
@@ -0,0 +1,58 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+Column {
+ ButtonGroup {
+ id: childGroup
+ exclusive: false
+ checkState: parentBox.checkState
+ }
+
+ CheckBox {
+ id: parentBox
+ text: qsTr("Parent")
+ checkState: childGroup.checkState
+ }
+
+ CheckBox {
+ checked: true
+ text: qsTr("Child 1")
+ leftPadding: indicator.width
+ ButtonGroup.group: childGroup
+ }
+
+ CheckBox {
+ text: qsTr("Child 2")
+ leftPadding: indicator.width
+ ButtonGroup.group: childGroup
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkdelegate-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkdelegate-custom.qml
new file mode 100644
index 0000000000..91970f529f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-checkdelegate-custom.qml
@@ -0,0 +1,74 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+CheckDelegate {
+ id: control
+ text: qsTr("CheckDelegate")
+ checked: true
+
+ contentItem: Text {
+ rightPadding: control.indicator.width + control.spacing
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ indicator: Rectangle {
+ implicitWidth: 26
+ implicitHeight: 26
+ x: control.width - width - control.rightPadding
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ radius: 3
+ color: "transparent"
+ border.color: control.down ? "#17a81a" : "#21be2b"
+
+ Rectangle {
+ width: 14
+ height: 14
+ x: 6
+ y: 6
+ radius: 2
+ color: control.down ? "#17a81a" : "#21be2b"
+ visible: control.checked
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 40
+ visible: control.down || control.highlighted
+ color: control.down ? "#bdbebf" : "#eeeeee"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-accepted.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-accepted.qml
new file mode 100644
index 0000000000..b420e3a572
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-accepted.qml
@@ -0,0 +1,45 @@
+/****************************************************************************
+**
+** Copyright (C) 2019 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [combobox]
+ComboBox {
+ editable: true
+ model: ListModel {
+ id: model
+ ListElement { text: "Banana" }
+ ListElement { text: "Apple" }
+ ListElement { text: "Coconut" }
+ }
+ onAccepted: {
+ if (find(editText) === -1)
+ model.append({text: editText})
+ }
+}
+//! [combobox]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-custom.qml
new file mode 100644
index 0000000000..08eeae905e
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-custom.qml
@@ -0,0 +1,114 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ComboBox {
+ id: control
+ model: ["First", "Second", "Third"]
+
+ delegate: ItemDelegate {
+ width: control.width
+ contentItem: Text {
+ text: control.textRole
+ ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole])
+ : modelData
+ color: "#21be2b"
+ font: control.font
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+ }
+ highlighted: control.highlightedIndex === index
+ }
+
+ indicator: Canvas {
+ id: canvas
+ x: control.width - width - control.rightPadding
+ y: control.topPadding + (control.availableHeight - height) / 2
+ width: 12
+ height: 8
+ contextType: "2d"
+
+ Connections {
+ target: control
+ function onPressedChanged() { canvas.requestPaint(); }
+ }
+
+ onPaint: {
+ context.reset();
+ context.moveTo(0, 0);
+ context.lineTo(width, 0);
+ context.lineTo(width / 2, height);
+ context.closePath();
+ context.fillStyle = control.pressed ? "#17a81a" : "#21be2b";
+ context.fill();
+ }
+ }
+
+ contentItem: Text {
+ leftPadding: 0
+ rightPadding: control.indicator.width + control.spacing
+
+ text: control.displayText
+ font: control.font
+ color: control.pressed ? "#17a81a" : "#21be2b"
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 120
+ implicitHeight: 40
+ border.color: control.pressed ? "#17a81a" : "#21be2b"
+ border.width: control.visualFocus ? 2 : 1
+ radius: 2
+ }
+
+ popup: Popup {
+ y: control.height - 1
+ width: control.width
+ implicitHeight: contentItem.implicitHeight
+ padding: 1
+
+ contentItem: ListView {
+ clip: true
+ implicitHeight: contentHeight
+ model: control.popup.visible ? control.delegateModel : null
+ currentIndex: control.highlightedIndex
+
+ ScrollIndicator.vertical: ScrollIndicator { }
+ }
+
+ background: Rectangle {
+ border.color: "#21be2b"
+ radius: 2
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-find.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-find.qml
new file mode 100644
index 0000000000..c14ebbbe1f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-find.qml
@@ -0,0 +1,40 @@
+/****************************************************************************
+**
+** Copyright (C) 2021 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [find]
+ComboBox {
+ model: ListModel {
+ ListElement { text: "Banana" }
+ ListElement { text: "Apple" }
+ ListElement { text: "Coconut" }
+ }
+ Component.onCompleted: currentIndex = find("Coconut")
+}
+//! [find]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-popup.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-popup.qml
new file mode 100644
index 0000000000..4aea1888be
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-popup.qml
@@ -0,0 +1,37 @@
+/****************************************************************************
+**
+** Copyright (C) 2022 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick.Controls
+
+ComboBox {
+//! [closePolicy]
+ popup.closePolicy: Popup.CloseOnEscape
+//! [closePolicy]
+//! [modal]
+ popup.modal: true
+//! [modal]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-textat.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-textat.qml
new file mode 100644
index 0000000000..524886d06b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-textat.qml
@@ -0,0 +1,40 @@
+/****************************************************************************
+**
+** Copyright (C) 2021 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [textat]
+ComboBox {
+ model: ListModel {
+ ListElement { text: "Banana" }
+ ListElement { text: "Apple" }
+ ListElement { text: "Coconut" }
+ }
+ onActivated: (index) => { print(textAt(index)) }
+}
+//! [textat]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-valuerole.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-valuerole.qml
new file mode 100644
index 0000000000..a4c40c0f0b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-combobox-valuerole.qml
@@ -0,0 +1,58 @@
+/****************************************************************************
+**
+** Copyright (C) 2019 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [file]
+ApplicationWindow {
+ width: 640
+ height: 480
+ visible: true
+
+ // Used as an example of a backend - this would usually be
+ // e.g. a C++ type exposed to QML.
+ QtObject {
+ id: backend
+ property int modifier
+ }
+
+ ComboBox {
+ textRole: "text"
+ valueRole: "value"
+ // When an item is selected, update the backend.
+ onActivated: backend.modifier = currentValue
+ // Set the initial currentIndex to the value stored in the backend.
+ Component.onCompleted: currentIndex = indexOfValue(backend.modifier)
+ model: [
+ { value: Qt.NoModifier, text: qsTr("No modifier") },
+ { value: Qt.ShiftModifier, text: qsTr("Shift") },
+ { value: Qt.ControlModifier, text: qsTr("Control") }
+ ]
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-delaybutton-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-delaybutton-custom.qml
new file mode 100644
index 0000000000..0b86f1d002
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-delaybutton-custom.qml
@@ -0,0 +1,82 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+DelayButton {
+ id: control
+ checked: true
+ text: qsTr("Delay\nButton")
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: "white"
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 100
+ opacity: enabled ? 1 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ radius: size / 2
+
+ readonly property real size: Math.min(control.width, control.height)
+ width: size
+ height: size
+ anchors.centerIn: parent
+
+ Canvas {
+ id: canvas
+ anchors.fill: parent
+
+ Connections {
+ target: control
+ function onProgressChanged() { canvas.requestPaint(); }
+ }
+
+ onPaint: {
+ var ctx = getContext("2d")
+ ctx.clearRect(0, 0, width, height)
+ ctx.strokeStyle = "white"
+ ctx.lineWidth = parent.size / 20
+ ctx.beginPath()
+ var startAngle = Math.PI / 5 * 3
+ var endAngle = startAngle + control.progress * Math.PI / 5 * 9
+ ctx.arc(width / 2, height / 2, width / 2 - ctx.lineWidth / 2 - 2, startAngle, endAngle)
+ ctx.stroke()
+ }
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dial-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dial-custom.qml
new file mode 100644
index 0000000000..170e9ccf09
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dial-custom.qml
@@ -0,0 +1,67 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Dial {
+ id: control
+ background: Rectangle {
+ x: control.width / 2 - width / 2
+ y: control.height / 2 - height / 2
+ width: Math.max(64, Math.min(control.width, control.height))
+ height: width
+ color: "transparent"
+ radius: width / 2
+ border.color: control.pressed ? "#17a81a" : "#21be2b"
+ opacity: control.enabled ? 1 : 0.3
+ }
+
+ handle: Rectangle {
+ id: handleItem
+ x: control.background.x + control.background.width / 2 - width / 2
+ y: control.background.y + control.background.height / 2 - height / 2
+ width: 16
+ height: 16
+ color: control.pressed ? "#17a81a" : "#21be2b"
+ radius: 8
+ antialiasing: true
+ opacity: control.enabled ? 1 : 0.3
+ transform: [
+ Translate {
+ y: -Math.min(control.background.width, control.background.height) * 0.4 + handleItem.height / 2
+ },
+ Rotation {
+ angle: control.angle
+ origin.x: handleItem.width / 2
+ origin.y: handleItem.height / 2
+ }
+ ]
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modal.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modal.qml
new file mode 100644
index 0000000000..d60e4e309b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modal.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: dialog.implicitWidth
+ height: dialog.implicitHeight
+//! [1]
+Dialog {
+ id: dialog
+ modal: true
+ standardButtons: Dialog.Ok
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modeless.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modeless.qml
new file mode 100644
index 0000000000..6acb74e59c
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog-modeless.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: dialog.implicitWidth
+ height: dialog.implicitHeight
+//! [1]
+Dialog {
+ id: dialog
+ modal: false
+ standardButtons: Dialog.Ok
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog.qml
new file mode 100644
index 0000000000..13fbb0e843
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialog.qml
@@ -0,0 +1,44 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: dialog.implicitWidth
+ height: dialog.implicitHeight
+//! [1]
+Dialog {
+ id: dialog
+ title: "Title"
+ standardButtons: Dialog.Ok | Dialog.Cancel
+
+ onAccepted: console.log("Ok clicked")
+ onRejected: console.log("Cancel clicked")
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox-attached.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox-attached.qml
new file mode 100644
index 0000000000..45a0b9e920
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox-attached.qml
@@ -0,0 +1,42 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+DialogButtonBox {
+ Button {
+ text: qsTr("Save")
+ DialogButtonBox.buttonRole: DialogButtonBox.AcceptRole
+ }
+ Button {
+ text: qsTr("Close")
+ DialogButtonBox.buttonRole: DialogButtonBox.DestructiveRole
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox.qml
new file mode 100644
index 0000000000..bcfd405b12
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-dialogbuttonbox.qml
@@ -0,0 +1,38 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+DialogButtonBox {
+ standardButtons: DialogButtonBox.Ok | DialogButtonBox.Cancel
+
+ onAccepted: console.log("Ok clicked")
+ onRejected: console.log("Cancel clicked")
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame-custom.qml
new file mode 100644
index 0000000000..798f95da13
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame-custom.qml
@@ -0,0 +1,43 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Frame {
+ background: Rectangle {
+ color: "transparent"
+ border.color: "#21be2b"
+ radius: 2
+ }
+
+ Label {
+ text: qsTr("Content goes here!")
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame.qml
new file mode 100644
index 0000000000..71b9b310d4
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-frame.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+//! [1]
+Frame {
+ ColumnLayout {
+ anchors.fill: parent
+ CheckBox { text: qsTr("E-mail") }
+ CheckBox { text: qsTr("Calendar") }
+ CheckBox { text: qsTr("Contacts") }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-checkable.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-checkable.qml
new file mode 100644
index 0000000000..91689d9fae
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-checkable.qml
@@ -0,0 +1,48 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+//! [1]
+GroupBox {
+ label: CheckBox {
+ id: checkBox
+ checked: true
+ text: qsTr("Synchronize")
+ }
+
+ ColumnLayout {
+ anchors.fill: parent
+ enabled: checkBox.checked
+ CheckBox { text: qsTr("E-mail") }
+ CheckBox { text: qsTr("Calendar") }
+ CheckBox { text: qsTr("Contacts") }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-custom.qml
new file mode 100644
index 0000000000..e3355b2337
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox-custom.qml
@@ -0,0 +1,57 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+GroupBox {
+ id: control
+ title: qsTr("GroupBox")
+
+ background: Rectangle {
+ y: control.topPadding - control.bottomPadding
+ width: parent.width
+ height: parent.height - control.topPadding + control.bottomPadding
+ color: "transparent"
+ border.color: "#21be2b"
+ radius: 2
+ }
+
+ label: Label {
+ x: control.leftPadding
+ width: control.availableWidth
+ text: control.title
+ color: "#21be2b"
+ elide: Text.ElideRight
+ }
+
+ Label {
+ text: qsTr("Content goes here!")
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox.qml
new file mode 100644
index 0000000000..e9f1c7dcc0
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-groupbox.qml
@@ -0,0 +1,42 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+//! [1]
+GroupBox {
+ title: qsTr("Synchronize")
+ ColumnLayout {
+ anchors.fill: parent
+ CheckBox { text: qsTr("E-mail") }
+ CheckBox { text: qsTr("Calendar") }
+ CheckBox { text: qsTr("Contacts") }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-headerview-simple.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-headerview-simple.qml
new file mode 100644
index 0000000000..6878904f3c
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-headerview-simple.qml
@@ -0,0 +1,119 @@
+/****************************************************************************
+**
+** Copyright (C) 2020 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** BSD License Usage
+** Alternatively, you may use this file under the terms of the BSD license
+** as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of The Qt Company Ltd nor the names of its
+** contributors may be used to endorse or promote products derived
+** from this software without specific prior written permission.
+**
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//![file]
+import QtQuick
+import QtQuick.Controls
+import Qt.labs.qmlmodels
+
+ApplicationWindow {
+ visible: true
+ width: 640
+ height: 480
+
+ //! [horizontal]
+ HorizontalHeaderView {
+ id: horizontalHeader
+ syncView: tableView
+ anchors.left: tableView.left
+ }
+ //! [horizontal]
+
+ //! [vertical]
+ VerticalHeaderView {
+ id: verticalHeader
+ syncView: tableView
+ anchors.top: tableView.top
+ }
+ //! [vertical]
+
+ TableView {
+ id: tableView
+ anchors.fill: parent
+ anchors.topMargin: horizontalHeader.height
+ anchors.leftMargin: verticalHeader.width
+ columnSpacing: 1
+ rowSpacing: 1
+ clip: true
+
+ model: TableModel {
+ TableModelColumn { display: "name" }
+ TableModelColumn { display: "color" }
+
+ rows: [
+ {
+ "name": "cat",
+ "color": "black"
+ },
+ {
+ "name": "dog",
+ "color": "brown"
+ },
+ {
+ "name": "bird",
+ "color": "white"
+ }
+ ]
+ }
+
+ delegate: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 50
+ border.width: 1
+
+ Text {
+ text: display
+ anchors.centerIn: parent
+ }
+ }
+ }
+}
+
+//![file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate-custom.qml
new file mode 100644
index 0000000000..fd52b46f32
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate-custom.qml
@@ -0,0 +1,59 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ItemDelegate {
+ id: control
+ text: qsTr("ItemDelegate")
+
+ contentItem: Text {
+ rightPadding: control.spacing
+ text: control.text
+ font: control.font
+ color: control.enabled ? (control.down ? "#17a81a" : "#21be2b") : "#bdbebf"
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 40
+ opacity: enabled ? 1 : 0.3
+ color: control.down ? "#dddedf" : "#eeeeee"
+
+ Rectangle {
+ width: parent.width
+ height: 1
+ color: control.down ? "#17a81a" : "#21be2b"
+ anchors.bottom: parent.bottom
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate.qml
new file mode 100644
index 0000000000..dbc108e7ab
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-itemdelegate.qml
@@ -0,0 +1,48 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+ListView {
+ width: 160
+ height: 240
+
+ model: Qt.fontFamilies()
+
+ delegate: ItemDelegate {
+ text: modelData
+ width: parent.width
+ onClicked: console.log("clicked:", modelData)
+
+ required property string modelData
+ }
+
+ ScrollIndicator.vertical: ScrollIndicator { }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-label-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-label-custom.qml
new file mode 100644
index 0000000000..cc88d00f42
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-label-custom.qml
@@ -0,0 +1,36 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Label {
+ text: qsTr("Label")
+ color: "#21be2b"
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-label.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-label.qml
new file mode 100644
index 0000000000..c492af50d4
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-label.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+Label {
+ text: "Label"
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-accent.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-accent.qml
new file mode 100644
index 0000000000..aa4c62b8e5
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-accent.qml
@@ -0,0 +1,43 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+Pane {
+ padding: 4
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ highlighted: true
+ Material.accent: Material.Orange
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-background.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-background.qml
new file mode 100644
index 0000000000..f64e48d225
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-background.qml
@@ -0,0 +1,42 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+Pane {
+ padding: 4
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ highlighted: true
+ Material.background: Material.Teal
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-elevation.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-elevation.qml
new file mode 100644
index 0000000000..f9e189f17a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-elevation.qml
@@ -0,0 +1,51 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+Pane {
+ contentWidth: 120
+ contentHeight: 120
+ padding: 10
+ bottomPadding: 20
+
+//! [1]
+Pane {
+ width: 120
+ height: 120
+
+ Material.elevation: 6
+
+ Label {
+ text: qsTr("I'm a card!")
+ anchors.centerIn: parent
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-foreground.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-foreground.qml
new file mode 100644
index 0000000000..070576f541
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-foreground.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+Pane {
+ padding: 4
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ Material.foreground: Material.Pink
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-theme.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-theme.qml
new file mode 100644
index 0000000000..586433c369
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-theme.qml
@@ -0,0 +1,44 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+Pane {
+ padding: 10
+
+//! [1]
+Pane {
+ Material.theme: Material.Dark
+
+ Button {
+ text: qsTr("Button")
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-variant.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-variant.qml
new file mode 100644
index 0000000000..df0a617f05
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-material-variant.qml
@@ -0,0 +1,213 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Material
+import QtQuick.Layouts
+
+Pane {
+ id: root
+ implicitWidth: 400
+ implicitHeight: 600
+ padding: 10
+
+ readonly property color measurementColor: "darkorange"
+ readonly property int barLeftMargin: 10
+ readonly property int textTopMargin: 12
+
+ Component {
+ id: measurementComponent
+
+ Rectangle {
+ color: root.measurementColor
+ width: 1
+ height: parent.height
+
+ Rectangle {
+ width: 5
+ height: 1
+ color: root.measurementColor
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+
+ Rectangle {
+ width: 5
+ height: 1
+ color: root.measurementColor
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.bottom: parent.bottom
+ }
+
+ Text {
+ x: 8
+ text: parent.height
+ height: parent.height
+ color: root.measurementColor
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+ }
+
+ ColumnLayout {
+ anchors.fill: parent
+ spacing: 20
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ Button {
+ id: button
+ text: qsTr("Button")
+
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+
+ }
+ Text {
+ text: "Roboto " + button.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ ItemDelegate {
+ id: itemDelegate
+ text: qsTr("ItemDelegate")
+
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+
+ }
+ Text {
+ text: "Roboto " + itemDelegate.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ CheckDelegate {
+ id: checkDelegate
+ text: qsTr("CheckDelegate")
+
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+
+ }
+ Text {
+ text: "Roboto " + checkDelegate.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ RadioDelegate {
+ id: radioDelegate
+ text: qsTr("RadioDelegate")
+
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+
+ }
+ Text {
+ text: "Roboto " + radioDelegate.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ ComboBox {
+ id: comboBox
+ model: [ qsTr("ComboBox") ]
+
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+
+ }
+ Text {
+ text: "Roboto " + comboBox.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ ColumnLayout {
+ spacing: root.textTopMargin
+
+ Item {
+ implicitWidth: groupBox.implicitWidth
+ implicitHeight: groupBox.implicitHeight
+
+ GroupBox {
+ id: groupBox
+ title: qsTr("GroupBox")
+ }
+ Loader {
+ sourceComponent: measurementComponent
+ height: parent.height
+ anchors.left: parent.right
+ anchors.leftMargin: root.barLeftMargin
+ }
+ }
+ Text {
+ text: "Roboto " + groupBox.font.pixelSize
+ color: root.measurementColor
+ }
+ }
+
+ Item {
+ Layout.fillHeight: true
+ }
+ }
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-menu-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menu-custom.qml
new file mode 100644
index 0000000000..3e766e8a7a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menu-custom.qml
@@ -0,0 +1,133 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+ApplicationWindow {
+ id: window
+ width: menu.width
+ height: menu.height
+ visible: true
+
+ Component.onCompleted: menu.popup(menu.itemAt(1))
+
+// Indent it like this so that the indenting in the generated doc is normal.
+Menu {
+ id: menu
+
+ Action { text: qsTr("Tool Bar"); checkable: true }
+ Action { text: qsTr("Side Bar"); checkable: true; checked: true }
+ Action { text: qsTr("Status Bar"); checkable: true; checked: true }
+
+ MenuSeparator {
+ contentItem: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 1
+ color: "#21be2b"
+ }
+ }
+
+ Menu {
+ title: qsTr("Advanced")
+ // ...
+ }
+
+ topPadding: 2
+ bottomPadding: 2
+
+ delegate: MenuItem {
+ id: menuItem
+ implicitWidth: 200
+ implicitHeight: 40
+
+ arrow: Canvas {
+ x: parent.width - width
+ implicitWidth: 40
+ implicitHeight: 40
+ visible: menuItem.subMenu
+ onPaint: {
+ var ctx = getContext("2d")
+ ctx.fillStyle = menuItem.highlighted ? "#ffffff" : "#21be2b"
+ ctx.moveTo(15, 15)
+ ctx.lineTo(width - 15, height / 2)
+ ctx.lineTo(15, height - 15)
+ ctx.closePath()
+ ctx.fill()
+ }
+ }
+
+ indicator: Item {
+ implicitWidth: 40
+ implicitHeight: 40
+ Rectangle {
+ width: 26
+ height: 26
+ anchors.centerIn: parent
+ visible: menuItem.checkable
+ border.color: "#21be2b"
+ radius: 3
+ Rectangle {
+ width: 14
+ height: 14
+ anchors.centerIn: parent
+ visible: menuItem.checked
+ color: "#21be2b"
+ radius: 2
+ }
+ }
+ }
+
+ contentItem: Text {
+ leftPadding: menuItem.indicator.width
+ rightPadding: menuItem.arrow.width
+ text: menuItem.text
+ font: menuItem.font
+ opacity: enabled ? 1.0 : 0.3
+ color: menuItem.highlighted ? "#ffffff" : "#21be2b"
+ horizontalAlignment: Text.AlignLeft
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 40
+ opacity: enabled ? 1 : 0.3
+ color: menuItem.highlighted ? "#21be2b" : "transparent"
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 40
+ color: "#ffffff"
+ border.color: "#21be2b"
+ radius: 2
+ }
+}
+} //! [eof]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar-custom.qml
new file mode 100644
index 0000000000..4b3d641e21
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar-custom.qml
@@ -0,0 +1,84 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+ApplicationWindow {
+ id: window
+ visible: true
+ width: menuBar.implicitWidth
+ height: menuBar.height
+
+ Component.onCompleted: menuBar.itemAt(1).highlighted = true
+
+ header:
+
+// Indent it like this so that the indenting in the generated doc is normal.
+MenuBar {
+ id: menuBar
+
+ Menu { title: qsTr("File") }
+ Menu { title: qsTr("Edit") }
+ Menu { title: qsTr("View") }
+ Menu { title: qsTr("Help") }
+
+ delegate: MenuBarItem {
+ id: menuBarItem
+
+ contentItem: Text {
+ text: menuBarItem.text
+ font: menuBarItem.font
+ opacity: enabled ? 1.0 : 0.3
+ color: menuBarItem.highlighted ? "#ffffff" : "#21be2b"
+ horizontalAlignment: Text.AlignLeft
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 40
+ implicitHeight: 40
+ opacity: enabled ? 1 : 0.3
+ color: menuBarItem.highlighted ? "#21be2b" : "transparent"
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 40
+ implicitHeight: 40
+ color: "#ffffff"
+
+ Rectangle {
+ color: "#21be2b"
+ width: parent.width
+ height: 1
+ anchors.bottom: parent.bottom
+ }
+ }
+}
+} //! [eof]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar.qml
new file mode 100644
index 0000000000..7ae22ae8c2
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menubar.qml
@@ -0,0 +1,67 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [begin]
+ApplicationWindow {
+ id: window
+ width: 320
+ height: 260
+ visible: true
+
+ //! [skipfrom]
+ Component.onCompleted: {
+ menuBar.itemAt(0).triggered()
+ menuBar.itemAt(0).menu.itemAt(2).highlighted = true
+ }
+ //! [skipto]
+
+ menuBar: 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") }
+ }
+ }
+}
+//! [end]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator-custom.qml
new file mode 100644
index 0000000000..fa7fa14a44
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator-custom.qml
@@ -0,0 +1,69 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ id: window
+ width: menu.contentItem.width
+ height: menu.contentItem.height
+ visible: true
+
+// Indent it like this so that the indenting in the generated doc is normal.
+Menu {
+ id: menu
+ contentItem.parent: window
+
+ MenuItem {
+ text: qsTr("New...")
+ }
+ MenuItem {
+ text: qsTr("Open...")
+ }
+ MenuItem {
+ text: qsTr("Save")
+ }
+
+ MenuSeparator {
+ padding: 0
+ topPadding: 12
+ bottomPadding: 12
+ contentItem: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 1
+ color: "#1E000000"
+ }
+ }
+
+ MenuItem {
+ text: qsTr("Exit")
+ }
+}
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator.qml
new file mode 100644
index 0000000000..cd5d544155
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-menuseparator.qml
@@ -0,0 +1,60 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ id: window
+ width: menu.contentItem.width
+ height: menu.contentItem.height
+ visible: true
+
+// Indent it like this so that the indenting in the generated doc is normal.
+Menu {
+ id: menu
+ contentItem.parent: window
+
+ MenuItem {
+ text: qsTr("New...")
+ }
+ MenuItem {
+ text: qsTr("Open...")
+ }
+ MenuItem {
+ text: qsTr("Save")
+ }
+
+ MenuSeparator {}
+
+ MenuItem {
+ text: qsTr("Exit")
+ }
+}
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modal.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modal.qml
new file mode 100644
index 0000000000..9751f05781
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modal.qml
@@ -0,0 +1,55 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Window
+
+Item {
+ id: root
+ width: 200
+ height: 200
+
+ Binding {
+ target: popup
+ property: "visible"
+ value: root.Window.active
+ }
+//! [1]
+Popup {
+ id: popup
+ width: 400
+ height: 400
+ modal: true
+ visible: true
+
+ Overlay.modal: Rectangle {
+ color: "#aacfdbe7"
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modeless.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modeless.qml
new file mode 100644
index 0000000000..a4951d1386
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overlay-modeless.qml
@@ -0,0 +1,55 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Window
+
+Item {
+ id: root
+ width: 200
+ height: 200
+
+ Binding {
+ target: popup
+ property: "visible"
+ value: root.Window.active
+ }
+//! [1]
+Popup {
+ id: popup
+ width: 400
+ height: 400
+ dim: true
+ visible: true
+
+ Overlay.modeless: Rectangle {
+ color: "#aacfdbe7"
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-overview.cmake b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overview.cmake
new file mode 100644
index 0000000000..b643e2c21d
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-overview.cmake
@@ -0,0 +1,4 @@
+#! [0]
+find_package(Qt6 REQUIRED COMPONENTS QuickControls2)
+target_link_libraries(mytarget PRIVATE Qt6::QuickControls2)
+#! [0]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-custom.qml
new file mode 100644
index 0000000000..2ca92cb427
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-custom.qml
@@ -0,0 +1,55 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+PageIndicator {
+ id: control
+ count: 5
+ currentIndex: 2
+
+ delegate: Rectangle {
+ implicitWidth: 8
+ implicitHeight: 8
+
+ radius: width / 2
+ color: "#21be2b"
+
+ opacity: index === control.currentIndex ? 0.95 : pressed ? 0.7 : 0.45
+
+ required property int index
+
+ Behavior on opacity {
+ OpacityAnimator {
+ duration: 100
+ }
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-interactive.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-interactive.qml
new file mode 100644
index 0000000000..8f2221ee4e
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator-interactive.qml
@@ -0,0 +1,58 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick.Controls
+
+Pane {
+//! [1]
+SwipeView {
+ id: view
+ currentIndex: pageIndicator.currentIndex
+ anchors.fill: parent
+
+ Page {
+ title: qsTr("Home")
+ }
+ Page {
+ title: qsTr("Discover")
+ }
+ Page {
+ title: qsTr("Activity")
+ }
+}
+
+PageIndicator {
+ id: pageIndicator
+ interactive: true
+ count: view.count
+ currentIndex: view.currentIndex
+
+ anchors.bottom: parent.bottom
+ anchors.horizontalCenter: parent.horizontalCenter
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator.qml
new file mode 100644
index 0000000000..b3912efe7a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pageindicator.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+PageIndicator {
+ count: 5
+ currentIndex: 2
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane-custom.qml
new file mode 100644
index 0000000000..855423c4c2
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane-custom.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Pane {
+ background: Rectangle {
+ color: "#eeeeee"
+ }
+
+ Label {
+ text: qsTr("Content goes here!")
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane.qml
new file mode 100644
index 0000000000..a8c8672e77
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-pane.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+//! [1]
+Pane {
+ ColumnLayout {
+ anchors.fill: parent
+ CheckBox { text: qsTr("E-mail") }
+ CheckBox { text: qsTr("Calendar") }
+ CheckBox { text: qsTr("Contacts") }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup-custom.qml
new file mode 100644
index 0000000000..ad5481e34d
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup-custom.qml
@@ -0,0 +1,53 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Window
+
+Item {
+ id: root
+ width: 200
+ height: 200
+
+ Binding {
+ target: popup
+ property: "visible"
+ value: root.Window.active
+ }
+//! [1]
+Popup {
+ id: popup
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 200
+ border.color: "#444"
+ }
+ contentItem: Column {}
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup.qml
new file mode 100644
index 0000000000..76ec20cdb2
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-popup.qml
@@ -0,0 +1,46 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+//! [centerIn]
+ApplicationWindow {
+ id: window
+ // ...
+
+ Pane {
+ // ...
+
+ Popup {
+ anchors.centerIn: Overlay.overlay
+ }
+ }
+}
+//! [centerIn]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-progressbar-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-progressbar-custom.qml
new file mode 100644
index 0000000000..d96161577b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-progressbar-custom.qml
@@ -0,0 +1,56 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ProgressBar {
+ id: control
+ value: 0.5
+ padding: 2
+
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 6
+ color: "#e6e6e6"
+ radius: 3
+ }
+
+ contentItem: Item {
+ implicitWidth: 200
+ implicitHeight: 4
+
+ Rectangle {
+ width: control.visualPosition * parent.width
+ height: parent.height
+ radius: 2
+ color: "#17a81a"
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiobutton-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiobutton-custom.qml
new file mode 100644
index 0000000000..b33ce6b6d9
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiobutton-custom.qml
@@ -0,0 +1,65 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+RadioButton {
+ id: control
+ text: qsTr("RadioButton")
+ checked: true
+
+ indicator: Rectangle {
+ implicitWidth: 26
+ implicitHeight: 26
+ x: control.leftPadding
+ y: parent.height / 2 - height / 2
+ radius: 13
+ border.color: control.down ? "#17a81a" : "#21be2b"
+
+ Rectangle {
+ width: 14
+ height: 14
+ x: 6
+ y: 6
+ radius: 7
+ color: control.down ? "#17a81a" : "#21be2b"
+ visible: control.checked
+ }
+ }
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ verticalAlignment: Text.AlignVCenter
+ leftPadding: control.indicator.width + control.spacing
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiodelegate-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiodelegate-custom.qml
new file mode 100644
index 0000000000..ed3dae678a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-radiodelegate-custom.qml
@@ -0,0 +1,74 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+RadioDelegate {
+ id: control
+ text: qsTr("RadioDelegate")
+ checked: true
+
+ contentItem: Text {
+ rightPadding: control.indicator.width + control.spacing
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ indicator: Rectangle {
+ implicitWidth: 26
+ implicitHeight: 26
+ x: control.width - width - control.rightPadding
+ y: parent.height / 2 - height / 2
+ radius: 13
+ color: "transparent"
+ border.color: control.down ? "#17a81a" : "#21be2b"
+
+ Rectangle {
+ width: 14
+ height: 14
+ x: 6
+ y: 6
+ radius: 7
+ color: control.down ? "#17a81a" : "#21be2b"
+ visible: control.checked
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 40
+ visible: control.down || control.highlighted
+ color: control.down ? "#bdbebf" : "#eeeeee"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-rangeslider-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-rangeslider-custom.qml
new file mode 100644
index 0000000000..fcddc40067
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-rangeslider-custom.qml
@@ -0,0 +1,76 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+RangeSlider {
+ id: control
+ first.value: 0.25
+ second.value: 0.75
+
+ background: Rectangle {
+ x: control.leftPadding
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: 200
+ implicitHeight: 4
+ width: control.availableWidth
+ height: implicitHeight
+ radius: 2
+ color: "#bdbebf"
+
+ Rectangle {
+ x: control.first.visualPosition * parent.width
+ width: control.second.visualPosition * parent.width - x
+ height: parent.height
+ color: "#21be2b"
+ radius: 2
+ }
+ }
+
+ first.handle: Rectangle {
+ x: control.leftPadding + control.first.visualPosition * (control.availableWidth - width)
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: 26
+ implicitHeight: 26
+ radius: 13
+ color: control.first.pressed ? "#f0f0f0" : "#f6f6f6"
+ border.color: "#bdbebf"
+ }
+
+ second.handle: Rectangle {
+ x: control.leftPadding + control.second.visualPosition * (control.availableWidth - width)
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: 26
+ implicitHeight: 26
+ radius: 13
+ color: control.second.pressed ? "#f0f0f0" : "#f6f6f6"
+ border.color: "#bdbebf"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-roundbutton.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-roundbutton.qml
new file mode 100644
index 0000000000..201ee24403
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-roundbutton.qml
@@ -0,0 +1,36 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+RoundButton {
+ text: "\u2713" // Unicode Character 'CHECK MARK'
+ onClicked: textArea.readOnly = true
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-active.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-active.qml
new file mode 100644
index 0000000000..bd417955e4
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-active.qml
@@ -0,0 +1,46 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 100
+ height: 100
+
+ //! [1]
+ Flickable {
+ anchors.fill: parent
+
+ contentWidth: parent.width * 2
+ contentHeight: parent.height * 2
+
+ ScrollBar.horizontal: ScrollBar { id: hbar; active: vbar.active }
+ ScrollBar.vertical: ScrollBar { id: vbar; active: hbar.active }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-custom.qml
new file mode 100644
index 0000000000..50db35f97b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-custom.qml
@@ -0,0 +1,53 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ScrollBar {
+ id: control
+ size: 0.3
+ position: 0.2
+ active: true
+ orientation: Qt.Vertical
+
+ contentItem: Rectangle {
+ implicitWidth: 6
+ implicitHeight: 100
+ radius: width / 2
+ color: control.pressed ? "#81e889" : "#c2f4c6"
+ // Hide the ScrollBar when it's not needed.
+ opacity: control.policy === ScrollBar.AlwaysOn || (control.active && control.size < 1.0) ? 0.75 : 0
+
+ // Animate the changes in opacity (default duration is 250 ms).
+ Behavior on opacity {
+ NumberAnimation {}
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-non-attached.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-non-attached.qml
new file mode 100644
index 0000000000..7ca6661557
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-non-attached.qml
@@ -0,0 +1,80 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 200
+
+//! [1]
+Rectangle {
+ id: frame
+ clip: true
+ width: 160
+ height: 160
+ border.color: "black"
+ anchors.centerIn: parent
+
+ Text {
+ id: content
+ text: "ABC"
+ font.pixelSize: 160
+ x: -hbar.position * width
+ y: -vbar.position * height
+ }
+
+ ScrollBar {
+ id: vbar
+ hoverEnabled: true
+ active: hovered || pressed
+ orientation: Qt.Vertical
+ size: frame.height / content.height
+ anchors.top: parent.top
+ anchors.right: parent.right
+ anchors.bottom: parent.bottom
+ }
+
+ ScrollBar {
+ id: hbar
+ hoverEnabled: true
+ active: hovered || pressed
+ orientation: Qt.Horizontal
+ size: frame.width / content.width
+ anchors.left: parent.left
+ anchors.right: parent.right
+ anchors.bottom: parent.bottom
+ }
+}
+//! [1]
+
+Component.onCompleted: {
+ hbar.active = true
+ vbar.active = true
+}
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-policy.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-policy.qml
new file mode 100644
index 0000000000..c608dac44a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollbar-policy.qml
@@ -0,0 +1,38 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+Flickable {
+ contentHeight: 2000
+ ScrollBar.vertical: ScrollBar {
+ policy: ScrollBar.AlwaysOn
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-active.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-active.qml
new file mode 100644
index 0000000000..719b9393f1
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-active.qml
@@ -0,0 +1,46 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 100
+ height: 100
+
+ //! [1]
+ Flickable {
+ anchors.fill: parent
+
+ contentWidth: parent.width * 2
+ contentHeight: parent.height * 2
+
+ ScrollIndicator.horizontal: ScrollIndicator { id: hbar; active: vbar.active }
+ ScrollIndicator.vertical: ScrollIndicator { id: vbar; active: hbar.active }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-custom.qml
new file mode 100644
index 0000000000..b18d391c4d
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-custom.qml
@@ -0,0 +1,45 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ScrollIndicator {
+ id: control
+ size: 0.3
+ position: 0.2
+ active: true
+ orientation: Qt.Vertical
+
+ contentItem: Rectangle {
+ implicitWidth: 2
+ implicitHeight: 100
+ color: "#c2f4c6"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-non-attached.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-non-attached.qml
new file mode 100644
index 0000000000..0d6c4529dd
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollindicator-non-attached.qml
@@ -0,0 +1,84 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 200
+
+//! [1]
+Rectangle {
+ id: frame
+ clip: true
+ width: 160
+ height: 160
+ border.color: "black"
+ anchors.centerIn: parent
+
+ Text {
+ id: content
+ text: "ABC"
+ font.pixelSize: 169
+
+ MouseArea {
+ id: mouseArea
+ drag.target: content
+ drag.minimumX: frame.width - width
+ drag.minimumY: frame.height - height
+ drag.maximumX: 0
+ drag.maximumY: 0
+ anchors.fill: content
+ }
+ }
+
+ ScrollIndicator {
+ id: verticalIndicator
+ active: mouseArea.pressed
+ orientation: Qt.Vertical
+ size: frame.height / content.height
+ position: -content.y / content.height
+ anchors { top: parent.top; right: parent.right; bottom: parent.bottom }
+ }
+
+ ScrollIndicator {
+ id: horizontalIndicator
+ active: mouseArea.pressed
+ orientation: Qt.Horizontal
+ size: frame.width / content.width
+ position: -content.x / content.width
+ anchors { left: parent.left; right: parent.right; bottom: parent.bottom }
+ }
+}
+//! [1]
+
+Component.onCompleted: {
+ horizontalIndicator.active = true;
+ verticalIndicator.active = true;
+}
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-custom.qml
new file mode 100644
index 0000000000..1a80d263b7
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-custom.qml
@@ -0,0 +1,81 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 200
+
+ Binding {
+ target: control.ScrollBar.horizontal
+ property: "active"
+ value: true
+ }
+
+ Binding {
+ target: control.ScrollBar.vertical
+ property: "active"
+ value: true
+ }
+
+//! [file]
+ScrollView {
+ id: control
+
+ width: 200
+ height: 200
+ focus: true
+
+ Label {
+ text: "ABC"
+ font.pixelSize: 224
+ }
+
+ ScrollBar.vertical: ScrollBar {
+ parent: control
+ x: control.mirrored ? 0 : control.width - width
+ y: control.topPadding
+ height: control.availableHeight
+ active: control.ScrollBar.horizontal.active
+ }
+
+ ScrollBar.horizontal: ScrollBar {
+ parent: control
+ x: control.leftPadding
+ y: control.height - height
+ width: control.availableWidth
+ active: control.ScrollBar.vertical.active
+ }
+
+ background: Rectangle {
+ border.color: control.activeFocus ? "#21be2b" : "#bdbebf"
+ }
+}
+//! [file]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-interactive.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-interactive.qml
new file mode 100644
index 0000000000..8386172035
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-interactive.qml
@@ -0,0 +1,38 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [file]
+ScrollView {
+ // ...
+ ScrollBar.horizontal.interactive: true
+ ScrollBar.vertical.interactive: true
+}
+//! [file]
+
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-listview.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-listview.qml
new file mode 100644
index 0000000000..bc1b11bd08
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-listview.qml
@@ -0,0 +1,63 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ id: root
+ width: 200
+ height: 200
+
+ Binding {
+ target: root.children[0].ScrollBar.horizontal
+ property: "active"
+ value: true
+ }
+
+ Binding {
+ target: root.children[0].ScrollBar.vertical
+ property: "active"
+ value: true
+ }
+
+//! [file]
+ScrollView {
+ width: 200
+ height: 200
+
+ ListView {
+ model: 20
+ delegate: ItemDelegate {
+ text: "Item " + index
+
+ required property int index
+ }
+ }
+}
+//! [file]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-policy.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-policy.qml
new file mode 100644
index 0000000000..78098eaaa6
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview-policy.qml
@@ -0,0 +1,38 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [file]
+ScrollView {
+ // ...
+ ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
+ ScrollBar.vertical.policy: ScrollBar.AlwaysOn
+}
+//! [file]
+
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview.qml
new file mode 100644
index 0000000000..c96ae1ed89
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-scrollview.qml
@@ -0,0 +1,60 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Rectangle {
+ id: root
+ width: 200
+ height: 200
+ border.color: "#ddd"
+
+ Binding {
+ target: root.children[0].ScrollBar.horizontal
+ property: "active"
+ value: true
+ }
+
+ Binding {
+ target: root.children[0].ScrollBar.vertical
+ property: "active"
+ value: true
+ }
+
+//! [file]
+ScrollView {
+ width: 200
+ height: 200
+
+ Label {
+ text: "ABC"
+ font.pixelSize: 224
+ }
+}
+//! [file]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-selectionrectangle.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-selectionrectangle.qml
new file mode 100644
index 0000000000..c866832432
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-selectionrectangle.qml
@@ -0,0 +1,95 @@
+/****************************************************************************
+**
+** Copyright (C) 2021 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** BSD License Usage
+** Alternatively, you may use this file under the terms of the BSD license
+** as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of The Qt Company Ltd nor the names of its
+** contributors may be used to endorse or promote products derived
+** from this software without specific prior written permission.
+**
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+
+import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+import QtQml.Models
+import Qt.labs.qmlmodels
+
+Window {
+ width: 480
+ height: 640
+ visible: true
+ visibility: Window.AutomaticVisibility
+
+//![0]
+ TableView {
+ id: tableView
+ anchors.fill: parent
+ clip: true
+
+ model: TableModel {
+ TableModelColumn { display: "name" }
+ rows: [ { "name": "Harry" }, { "name": "Hedwig" } ]
+ }
+
+ selectionModel: ItemSelectionModel {
+ model: tableView.model
+ }
+
+ delegate: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 30
+ color: selected ? "blue" : "lightgray"
+
+ required property bool selected
+
+ Text { text: display }
+ }
+ }
+
+ SelectionRectangle {
+ target: tableView
+ }
+//![0]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-slider-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-slider-custom.qml
new file mode 100644
index 0000000000..c3d7f4b2d1
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-slider-custom.qml
@@ -0,0 +1,64 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Slider {
+ id: control
+ value: 0.5
+
+ background: Rectangle {
+ x: control.leftPadding
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: 200
+ implicitHeight: 4
+ width: control.availableWidth
+ height: implicitHeight
+ radius: 2
+ color: "#bdbebf"
+
+ Rectangle {
+ width: control.visualPosition * parent.width
+ height: parent.height
+ color: "#21be2b"
+ radius: 2
+ }
+ }
+
+ handle: Rectangle {
+ x: control.leftPadding + control.visualPosition * (control.availableWidth - width)
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: 26
+ implicitHeight: 26
+ radius: 13
+ color: control.pressed ? "#f0f0f0" : "#f6f6f6"
+ border.color: "#bdbebf"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-custom.qml
new file mode 100644
index 0000000000..89f6244f70
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-custom.qml
@@ -0,0 +1,96 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+SpinBox {
+ id: control
+ value: 50
+ editable: true
+
+ contentItem: TextInput {
+ z: 2
+ text: control.textFromValue(control.value, control.locale)
+
+ font: control.font
+ color: "#21be2b"
+ selectionColor: "#21be2b"
+ selectedTextColor: "#ffffff"
+ horizontalAlignment: Qt.AlignHCenter
+ verticalAlignment: Qt.AlignVCenter
+
+ readOnly: !control.editable
+ validator: control.validator
+ inputMethodHints: Qt.ImhFormattedNumbersOnly
+ }
+
+ up.indicator: Rectangle {
+ x: control.mirrored ? 0 : parent.width - width
+ height: parent.height
+ implicitWidth: 40
+ implicitHeight: 40
+ color: control.up.pressed ? "#e4e4e4" : "#f6f6f6"
+ border.color: enabled ? "#21be2b" : "#bdbebf"
+
+ Text {
+ text: "+"
+ font.pixelSize: control.font.pixelSize * 2
+ color: "#21be2b"
+ anchors.fill: parent
+ fontSizeMode: Text.Fit
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+
+ down.indicator: Rectangle {
+ x: control.mirrored ? parent.width - width : 0
+ height: parent.height
+ implicitWidth: 40
+ implicitHeight: 40
+ color: control.down.pressed ? "#e4e4e4" : "#f6f6f6"
+ border.color: enabled ? "#21be2b" : "#bdbebf"
+
+ Text {
+ text: "-"
+ font.pixelSize: control.font.pixelSize * 2
+ color: "#21be2b"
+ anchors.fill: parent
+ fontSizeMode: Text.Fit
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 140
+ border.color: "#bdbebf"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-double.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-double.qml
new file mode 100644
index 0000000000..852ee5be6f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-double.qml
@@ -0,0 +1,56 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+SpinBox {
+ id: spinbox
+ from: 0
+ value: 110
+ to: 100 * 100
+ stepSize: 100
+ anchors.centerIn: parent
+
+ property int decimals: 2
+ property real realValue: value / 100
+
+ validator: DoubleValidator {
+ bottom: Math.min(spinbox.from, spinbox.to)
+ top: Math.max(spinbox.from, spinbox.to)
+ }
+
+ textFromValue: function(value, locale) {
+ return Number(value / 100).toLocaleString(locale, 'f', spinbox.decimals)
+ }
+
+ valueFromText: function(text, locale) {
+ return Number.fromLocaleString(locale, text) * 100
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-textual.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-textual.qml
new file mode 100644
index 0000000000..ba3b133c14
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox-textual.qml
@@ -0,0 +1,56 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+SpinBox {
+ id: spinBox
+ from: 0
+ to: items.length - 1
+ value: 1 // "Medium"
+
+ property var items: ["Small", "Medium", "Large"]
+
+ validator: RegularExpressionValidator {
+ regularExpression: new RegExp("(Small|Medium|Large)", "i")
+ }
+
+ textFromValue: function(value) {
+ return items[value];
+ }
+
+ valueFromText: function(text) {
+ for (var i = 0; i < items.length; ++i) {
+ if (items[i].toLowerCase().indexOf(text.toLowerCase()) === 0)
+ return i
+ }
+ return spinBox.value
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox.qml
new file mode 100644
index 0000000000..8772274969
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-spinbox.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+SpinBox {
+ value: 50
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-custom.qml
new file mode 100644
index 0000000000..570c3acd33
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-custom.qml
@@ -0,0 +1,57 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 100
+
+ //! [1]
+ SplitView {
+ id: splitView
+ anchors.fill: parent
+
+ handle: Rectangle {
+ implicitWidth: 4
+ implicitHeight: 4
+ color: SplitHandle.pressed ? "#81e889"
+ : (SplitHandle.hovered ? Qt.lighter("#c2f4c6", 1.1) : "#c2f4c6")
+ }
+
+ Rectangle {
+ implicitWidth: 150
+ color: "#444"
+ }
+ Rectangle {
+ implicitWidth: 50
+ color: "#666"
+ }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-handle-containmentmask.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-handle-containmentmask.qml
new file mode 100644
index 0000000000..da410c02e0
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-splitview-handle-containmentmask.qml
@@ -0,0 +1,64 @@
+/****************************************************************************
+**
+** Copyright (C) 2021 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 100
+
+ //! [1]
+ SplitView {
+ id: splitView
+ anchors.fill: parent
+
+ handle: Rectangle {
+ id: handleDelegate
+ implicitWidth: 4
+ implicitHeight: 4
+ color: SplitHandle.pressed ? "#81e889"
+ : (SplitHandle.hovered ? Qt.lighter("#c2f4c6", 1.1) : "#c2f4c6")
+
+ containmentMask: Item {
+ x: (handleDelegate.width - width) / 2
+ width: 64
+ height: splitView.height
+ }
+ }
+
+ Rectangle {
+ implicitWidth: 150
+ color: "#444"
+ }
+ Rectangle {
+ implicitWidth: 50
+ color: "#666"
+ }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-custom.qml
new file mode 100644
index 0000000000..64cdb3ceb9
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-custom.qml
@@ -0,0 +1,53 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+StackView {
+ id: control
+
+ popEnter: Transition {
+ XAnimator {
+ from: (control.mirrored ? -1 : 1) * -control.width
+ to: 0
+ duration: 400
+ easing.type: Easing.OutCubic
+ }
+ }
+
+ popExit: Transition {
+ XAnimator {
+ from: 0
+ to: (control.mirrored ? -1 : 1) * control.width
+ duration: 400
+ easing.type: Easing.OutCubic
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-visible.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-visible.qml
new file mode 100644
index 0000000000..0e1a0dd495
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-stackview-visible.qml
@@ -0,0 +1,76 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+StackView {
+ id: stackView
+ property real offset: 10
+ width: 100; height: 100
+
+ initialItem: Component {
+ id: page
+ Rectangle {
+ property real pos: StackView.index * stackView.offset
+ property real hue: Math.random()
+ color: Qt.hsla(hue, 0.5, 0.8, 0.6)
+ border.color: Qt.hsla(hue, 0.5, 0.5, 0.9)
+ StackView.visible: true
+ }
+ }
+
+ pushEnter: Transition {
+ id: pushEnter
+ ParallelAnimation {
+ PropertyAction { property: "x"; value: pushEnter.ViewTransition.item.pos }
+ NumberAnimation { properties: "y"; from: pushEnter.ViewTransition.item.pos + stackView.offset; to: pushEnter.ViewTransition.item.pos; duration: 400; easing.type: Easing.OutCubic }
+ NumberAnimation { property: "opacity"; from: 0; to: 1; duration: 400; easing.type: Easing.OutCubic }
+ }
+ }
+ popExit: Transition {
+ id: popExit
+ ParallelAnimation {
+ PropertyAction { property: "x"; value: popExit.ViewTransition.item.pos }
+ NumberAnimation { properties: "y"; from: popExit.ViewTransition.item.pos; to: popExit.ViewTransition.item.pos + stackView.offset; duration: 400; easing.type: Easing.OutCubic }
+ NumberAnimation { property: "opacity"; from: 1; to: 0; duration: 400; easing.type: Easing.OutCubic }
+ }
+ }
+
+ pushExit: Transition {
+ id: pushExit
+ PropertyAction { property: "x"; value: pushExit.ViewTransition.item.pos }
+ PropertyAction { property: "y"; value: pushExit.ViewTransition.item.pos }
+ }
+ popEnter: Transition {
+ id: popEnter
+ PropertyAction { property: "x"; value: popEnter.ViewTransition.item.pos }
+ PropertyAction { property: "y"; value: popEnter.ViewTransition.item.pos }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-custom.qml
new file mode 100644
index 0000000000..c89b96a42f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-custom.qml
@@ -0,0 +1,72 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+SwipeDelegate {
+ id: control
+ text: qsTr("SwipeDelegate")
+
+ Component {
+ id: component
+
+ Rectangle {
+ color: SwipeDelegate.pressed ? "#333" : "#444"
+ width: parent.width
+ height: parent.height
+ clip: true
+
+ Label {
+ text: qsTr("Press me!")
+ color: "#21be2b"
+ anchors.centerIn: parent
+ }
+ }
+ }
+
+ swipe.left: component
+ swipe.right: component
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ color: control.enabled ? (control.down ? "#17a81a" : "#21be2b") : "#bdbebf"
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+
+ Behavior on x {
+ enabled: !control.down
+ NumberAnimation {
+ easing.type: Easing.InOutCubic
+ duration: 400
+ }
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-transition.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-transition.qml
new file mode 100644
index 0000000000..dc0d58a2ca
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate-transition.qml
@@ -0,0 +1,37 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+SwipeDelegate {
+ swipe.transition: Transition {
+ SmoothedAnimation { velocity: 3; easing.type: Easing.InOutCubic }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate.qml
new file mode 100644
index 0000000000..866e711481
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipedelegate.qml
@@ -0,0 +1,86 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+ListView {
+ id: listView
+ anchors.fill: parent
+ model: ListModel {
+ ListElement { sender: "Bob Bobbleton"; title: "How are you going?" }
+ ListElement { sender: "Rug Emporium"; title: "SALE! All rugs MUST go!" }
+ ListElement { sender: "Electric Co."; title: "Electricity bill 15/07/2016 overdue" }
+ ListElement { sender: "Tips"; title: "Five ways this tip will save your life" }
+ }
+ delegate: SwipeDelegate {
+ id: swipeDelegate
+ text: sender + " - " + title
+ width: listView.width
+
+ required property string sender
+ required property string title
+ required property int index
+
+ ListView.onRemove: SequentialAnimation {
+ PropertyAction {
+ target: swipeDelegate
+ property: "ListView.delayRemove"
+ value: true
+ }
+ NumberAnimation {
+ target: swipeDelegate
+ property: "height"
+ to: 0
+ easing.type: Easing.InOutQuad
+ }
+ PropertyAction {
+ target: swipeDelegate
+ property: "ListView.delayRemove"
+ value: false
+ }
+ }
+
+ swipe.right: Label {
+ id: deleteLabel
+ text: qsTr("Delete")
+ color: "white"
+ verticalAlignment: Label.AlignVCenter
+ padding: 12
+ height: parent.height
+ anchors.right: parent.right
+
+ SwipeDelegate.onClicked: listView.model.remove(index)
+
+ background: Rectangle {
+ color: deleteLabel.SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
+ }
+ }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-custom.qml
new file mode 100644
index 0000000000..b8cddb315a
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-custom.qml
@@ -0,0 +1,39 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+SwipeView {
+ id: control
+
+ background: Rectangle {
+ color: "#eeeeee"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-indicator.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-indicator.qml
new file mode 100644
index 0000000000..98b381f14e
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-swipeview-indicator.qml
@@ -0,0 +1,63 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 200
+ height: 320
+
+ //! [1]
+ SwipeView {
+ id: view
+
+ currentIndex: 1
+ anchors.fill: parent
+
+ Item {
+ id: firstPage
+ }
+ Item {
+ id: secondPage
+ }
+ Item {
+ id: thirdPage
+ }
+ }
+
+ PageIndicator {
+ id: indicator
+
+ count: view.count
+ currentIndex: view.currentIndex
+
+ anchors.bottom: view.bottom
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-switch-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-switch-custom.qml
new file mode 100644
index 0000000000..9adccbed2f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-switch-custom.qml
@@ -0,0 +1,64 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Switch {
+ id: control
+ text: qsTr("Switch")
+
+ indicator: Rectangle {
+ implicitWidth: 48
+ implicitHeight: 26
+ x: control.leftPadding
+ y: parent.height / 2 - height / 2
+ radius: 13
+ color: control.checked ? "#17a81a" : "#ffffff"
+ border.color: control.checked ? "#17a81a" : "#cccccc"
+
+ Rectangle {
+ x: control.checked ? parent.width - width : 0
+ width: 26
+ height: 26
+ radius: 13
+ color: control.down ? "#cccccc" : "#ffffff"
+ border.color: control.checked ? (control.down ? "#17a81a" : "#21be2b") : "#999999"
+ }
+ }
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ verticalAlignment: Text.AlignVCenter
+ leftPadding: control.indicator.width + control.spacing
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-switchdelegate-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-switchdelegate-custom.qml
new file mode 100644
index 0000000000..bea35f29ea
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-switchdelegate-custom.qml
@@ -0,0 +1,73 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+SwitchDelegate {
+ id: control
+ text: qsTr("SwitchDelegate")
+ checked: true
+
+ contentItem: Text {
+ rightPadding: control.indicator.width + control.spacing
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ elide: Text.ElideRight
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ indicator: Rectangle {
+ implicitWidth: 48
+ implicitHeight: 26
+ x: control.width - width - control.rightPadding
+ y: parent.height / 2 - height / 2
+ radius: 13
+ color: control.checked ? "#17a81a" : "transparent"
+ border.color: control.checked ? "#17a81a" : "#cccccc"
+
+ Rectangle {
+ x: control.checked ? parent.width - width : 0
+ width: 26
+ height: 26
+ radius: 13
+ color: control.down ? "#cccccc" : "#ffffff"
+ border.color: control.checked ? (control.down ? "#17a81a" : "#21be2b") : "#999999"
+ }
+ }
+
+ background: Rectangle {
+ implicitWidth: 100
+ implicitHeight: 40
+ visible: control.down || control.highlighted
+ color: control.down ? "#bdbebf" : "#eeeeee"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-custom.qml
new file mode 100644
index 0000000000..eba4825632
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-custom.qml
@@ -0,0 +1,49 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+TabBar {
+ id: control
+
+ background: Rectangle {
+ color: "#eeeeee"
+ }
+
+ TabButton {
+ text: qsTr("Home")
+ }
+ TabButton {
+ text: qsTr("Discover")
+ }
+ TabButton {
+ text: qsTr("Activity")
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-explicit.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-explicit.qml
new file mode 100644
index 0000000000..5f5482551f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-explicit.qml
@@ -0,0 +1,52 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 360
+ height: childrenRect.height
+
+//! [1]
+TabBar {
+ width: parent.width
+ TabButton {
+ text: "First"
+ width: implicitWidth
+ }
+ TabButton {
+ text: "Second"
+ width: implicitWidth
+ }
+ TabButton {
+ text: "Third"
+ width: implicitWidth
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-flickable.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-flickable.qml
new file mode 100644
index 0000000000..8e41bbf0ca
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar-flickable.qml
@@ -0,0 +1,50 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 360
+ height: bar.height
+
+//! [1]
+TabBar {
+ id: bar
+ width: parent.width
+
+ Repeater {
+ model: ["First", "Second", "Third", "Fourth", "Fifth"]
+
+ TabButton {
+ text: modelData
+ width: Math.max(100, bar.width / 5)
+ }
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar.qml
new file mode 100644
index 0000000000..7a02f37521
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbar.qml
@@ -0,0 +1,64 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+Column {
+ width: 300
+
+ //! [1]
+ TabBar {
+ id: bar
+ width: parent.width
+ TabButton {
+ text: qsTr("Home")
+ }
+ TabButton {
+ text: qsTr("Discover")
+ }
+ TabButton {
+ text: qsTr("Activity")
+ }
+ }
+
+ StackLayout {
+ width: parent.width
+ currentIndex: bar.currentIndex
+ Item {
+ id: homeTab
+ }
+ Item {
+ id: discoverTab
+ }
+ Item {
+ id: activityTab
+ }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbutton.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbutton.qml
new file mode 100644
index 0000000000..e7240db4dc
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tabbutton.qml
@@ -0,0 +1,43 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+TabBar {
+ TabButton {
+ text: qsTr("Home")
+ }
+ TabButton {
+ text: qsTr("Discover")
+ }
+ TabButton {
+ text: qsTr("Activity")
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-custom.qml
new file mode 100644
index 0000000000..e4f1b397d4
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-custom.qml
@@ -0,0 +1,42 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+TextArea {
+ id: control
+ placeholderText: qsTr("Enter description")
+
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 40
+ border.color: control.enabled ? "#21be2b" : "transparent"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-scrollable.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-scrollable.qml
new file mode 100644
index 0000000000..52d9996e9b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textarea-scrollable.qml
@@ -0,0 +1,47 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ width: 100
+ height: 100
+
+ Binding { target: view.ScrollBar.vertical; property: "active"; value: true }
+
+ //! [1]
+ ScrollView {
+ id: view
+ anchors.fill: parent
+
+ TextArea {
+ text: "TextArea\n...\n...\n...\n...\n...\n...\n"
+ }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-custom.qml
new file mode 100644
index 0000000000..8f1aba233e
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-custom.qml
@@ -0,0 +1,43 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+TextField {
+ id: control
+ placeholderText: qsTr("Enter description")
+
+ background: Rectangle {
+ implicitWidth: 200
+ implicitHeight: 40
+ color: control.enabled ? "transparent" : "#353637"
+ border.color: control.enabled ? "#21be2b" : "transparent"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-disabled.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-disabled.qml
new file mode 100644
index 0000000000..3d92b64760
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-disabled.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+TextField {
+ width: 80
+ text: "Disabled"
+ enabled: false
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-focused.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-focused.qml
new file mode 100644
index 0000000000..f276198857
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-focused.qml
@@ -0,0 +1,35 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+TextField {
+ width: 80
+ text: "Focused"
+ focus: true
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-normal.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-normal.qml
new file mode 100644
index 0000000000..c9208c0e8f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-textfield-normal.qml
@@ -0,0 +1,34 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+TextField {
+ width: 80
+ text: "Normal"
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar-custom.qml
new file mode 100644
index 0000000000..2cb9d0c5c7
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar-custom.qml
@@ -0,0 +1,59 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+//! [file]
+ToolBar {
+ id: control
+
+ background: Rectangle {
+ implicitHeight: 40
+ color: "#eeeeee"
+
+ Rectangle {
+ width: parent.width
+ height: 1
+ anchors.bottom: parent.bottom
+ color: "transparent"
+ border.color: "#21be2b"
+ }
+ }
+
+ RowLayout {
+ anchors.fill: parent
+ ToolButton {
+ text: qsTr("Undo")
+ }
+ ToolButton {
+ text: qsTr("Redo")
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar.qml
new file mode 100644
index 0000000000..52445d93d7
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbar.qml
@@ -0,0 +1,63 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+
+Item {
+ id: root
+ width: children[0].implicitWidth * 2
+ height: children[0].implicitHeight
+ Binding {
+ target: root.children[0]
+ property: "width"
+ value: root.width
+ }
+//! [1]
+ToolBar {
+ RowLayout {
+ anchors.fill: parent
+ ToolButton {
+ text: qsTr("‹")
+ onClicked: stack.pop()
+ }
+ Label {
+ text: "Title"
+ elide: Label.ElideRight
+ horizontalAlignment: Qt.AlignHCenter
+ verticalAlignment: Qt.AlignVCenter
+ Layout.fillWidth: true
+ }
+ ToolButton {
+ text: qsTr("⋮")
+ onClicked: menu.open()
+ }
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbutton-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbutton-custom.qml
new file mode 100644
index 0000000000..8eb27430da
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolbutton-custom.qml
@@ -0,0 +1,55 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+ToolButton {
+ id: control
+ text: qsTr("ToolButton")
+ width: 120
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ opacity: enabled ? 1.0 : 0.3
+ color: control.down ? "#17a81a" : "#21be2b"
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 40
+ implicitHeight: 40
+ color: Qt.darker("#33333333", control.enabled && (control.checked || control.highlighted) ? 1.5 : 1.0)
+ opacity: enabled ? 1 : 0.3
+ visible: control.down || (control.enabled && (control.checked || control.highlighted))
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator-custom.qml
new file mode 100644
index 0000000000..f630256dd9
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator-custom.qml
@@ -0,0 +1,69 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+
+//! [file]
+ToolBar {
+ RowLayout {
+ anchors.fill: parent
+
+ ToolButton {
+ text: qsTr("Action 1")
+ }
+ ToolButton {
+ text: qsTr("Action 2")
+ }
+
+ ToolSeparator {
+ padding: vertical ? 10 : 2
+ topPadding: vertical ? 2 : 10
+ bottomPadding: vertical ? 2 : 10
+
+ contentItem: Rectangle {
+ implicitWidth: parent.vertical ? 1 : 24
+ implicitHeight: parent.vertical ? 24 : 1
+ color: "#c3c3c3"
+ }
+ }
+
+ ToolButton {
+ text: qsTr("Action 3")
+ }
+ ToolButton {
+ text: qsTr("Action 4")
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator.qml
new file mode 100644
index 0000000000..514b97fa68
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-toolseparator.qml
@@ -0,0 +1,68 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+
+//! [1]
+ToolBar {
+ RowLayout {
+ anchors.fill: parent
+
+ ToolButton {
+ text: qsTr("Action 1")
+ }
+ ToolButton {
+ text: qsTr("Action 2")
+ }
+
+ ToolSeparator {}
+
+ ToolButton {
+ text: qsTr("Action 3")
+ }
+ ToolButton {
+ text: qsTr("Action 4")
+ }
+
+ ToolSeparator {}
+
+ ToolButton {
+ text: qsTr("Action 5")
+ }
+ ToolButton {
+ text: qsTr("Action 6")
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+ }
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-custom.qml
new file mode 100644
index 0000000000..7b40c974b6
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-custom.qml
@@ -0,0 +1,48 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Item {
+ToolTip {
+ id: control
+ text: qsTr("A descriptive tool tip of what the button does")
+
+ contentItem: Text {
+ text: control.text
+ font: control.font
+ color: "#21be2b"
+ }
+
+ background: Rectangle {
+ border.color: "#21be2b"
+ }
+}
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-hover.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-hover.qml
new file mode 100644
index 0000000000..6d1ee4c41b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-hover.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ hoverEnabled: true
+
+ ToolTip.delay: 1000
+ ToolTip.timeout: 5000
+ ToolTip.visible: hovered
+ ToolTip.text: qsTr("This tool tip is shown after hovering the button for a second.")
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-pressandhold.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-pressandhold.qml
new file mode 100644
index 0000000000..cea495538b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-pressandhold.qml
@@ -0,0 +1,39 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [1]
+Button {
+ text: qsTr("Button")
+
+ ToolTip.visible: pressed
+ ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval
+ ToolTip.text: qsTr("This tool tip is shown after pressing and holding the button down.")
+}
+//! [1]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-slider.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-slider.qml
new file mode 100644
index 0000000000..5f40822457
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip-slider.qml
@@ -0,0 +1,53 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+
+Item {
+ id: root
+ width: slider.width
+ height: slider.height * 2.0
+
+ Binding { target: slider.anchors; property: "centerIn"; value: root }
+ Binding { target: slider.anchors; property: "verticalCenterOffset"; value: slider.height / 2 }
+ Binding { target: slider; property: "pressed"; value: root.Window.active }
+
+ //! [1]
+ Slider {
+ id: slider
+ value: 0.5
+
+ ToolTip {
+ parent: slider.handle
+ visible: slider.pressed
+ text: slider.value.toFixed(1)
+ }
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip.qml
new file mode 100644
index 0000000000..72eaaba5fa
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tooltip.qml
@@ -0,0 +1,51 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+
+Item {
+ id: root
+ width: 360
+ height: button.height * 2
+
+ property Button button: children[0]
+
+ Binding { target: root.button; property: "down"; value: root.Window.active }
+ Binding { target: root.button.anchors; property: "bottom"; value: root.bottom }
+ Binding { target: root.button.anchors; property: "horizontalCenter"; value: root.horizontalCenter }
+
+ //! [1]
+ Button {
+ text: qsTr("Save")
+
+ ToolTip.visible: down
+ ToolTip.text: qsTr("Save the active project")
+ }
+ //! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-custom.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-custom.qml
new file mode 100644
index 0000000000..ee637d23be
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-custom.qml
@@ -0,0 +1,81 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [file]
+import QtQuick
+import QtQuick.Controls
+
+Tumbler {
+ id: control
+ model: 15
+
+ background: Item {
+ Rectangle {
+ opacity: control.enabled ? 0.2 : 0.1
+ border.color: "#000000"
+ width: parent.width
+ height: 1
+ anchors.top: parent.top
+ }
+
+ Rectangle {
+ opacity: control.enabled ? 0.2 : 0.1
+ border.color: "#000000"
+ width: parent.width
+ height: 1
+ anchors.bottom: parent.bottom
+ }
+ }
+
+ delegate: Text {
+ text: qsTr("Item %1").arg(modelData + 1)
+ font: control.font
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ opacity: 1.0 - Math.abs(Tumbler.displacement) / (control.visibleItemCount / 2)
+
+ required property var modelData
+ required property int index
+ }
+
+ Rectangle {
+ anchors.horizontalCenter: control.horizontalCenter
+ y: control.height * 0.4
+ width: 40
+ height: 1
+ color: "#21be2b"
+ }
+
+ Rectangle {
+ anchors.horizontalCenter: control.horizontalCenter
+ y: control.height * 0.6
+ width: 40
+ height: 1
+ color: "#21be2b"
+ }
+}
+//! [file]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-listView.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-listView.qml
new file mode 100644
index 0000000000..54ce78afd3
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-listView.qml
@@ -0,0 +1,46 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [contentItem]
+Tumbler {
+ id: tumbler
+
+ contentItem: ListView {
+ model: tumbler.model
+ delegate: tumbler.delegate
+
+ snapMode: ListView.SnapToItem
+ highlightRangeMode: ListView.StrictlyEnforceRange
+ preferredHighlightBegin: height / 2 - (height / tumbler.visibleItemCount / 2)
+ preferredHighlightEnd: height / 2 + (height / tumbler.visibleItemCount / 2)
+ clip: true
+ }
+}
+//! [contentItem]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-pathView.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-pathView.qml
new file mode 100644
index 0000000000..408b747920
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-pathView.qml
@@ -0,0 +1,57 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+
+//! [contentItem]
+Tumbler {
+ id: tumbler
+
+ contentItem: PathView {
+ id: pathView
+ model: tumbler.model
+ delegate: tumbler.delegate
+ clip: true
+ pathItemCount: tumbler.visibleItemCount + 1
+ preferredHighlightBegin: 0.5
+ preferredHighlightEnd: 0.5
+ dragMargin: width / 2
+
+ path: Path {
+ startX: pathView.width / 2
+ startY: -pathView.delegateHeight / 2
+ PathLine {
+ x: pathView.width / 2
+ y: pathView.pathItemCount * pathView.delegateHeight - pathView.delegateHeight / 2
+ }
+ }
+
+ property real delegateHeight: tumbler.availableHeight / tumbler.visibleItemCount
+ }
+}
+//! [contentItem]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-timePicker.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-timePicker.qml
new file mode 100644
index 0000000000..d9edb2cb00
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-tumbler-timePicker.qml
@@ -0,0 +1,86 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+//! [tumbler]
+import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+
+Rectangle {
+ width: frame.implicitWidth + 10
+ height: frame.implicitHeight + 10
+
+ function formatText(count, modelData) {
+ var data = count === 12 ? modelData + 1 : modelData;
+ return data.toString().length < 2 ? "0" + data : data;
+ }
+
+ FontMetrics {
+ id: fontMetrics
+ }
+
+ Component {
+ id: delegateComponent
+
+ Label {
+ text: formatText(Tumbler.tumbler.count, modelData)
+ opacity: 1.0 - Math.abs(Tumbler.displacement) / (Tumbler.tumbler.visibleItemCount / 2)
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ font.pixelSize: fontMetrics.font.pixelSize * 1.25
+ }
+ }
+
+ Frame {
+ id: frame
+ padding: 0
+ anchors.centerIn: parent
+
+ Row {
+ id: row
+
+ Tumbler {
+ id: hoursTumbler
+ model: 12
+ delegate: delegateComponent
+ }
+
+ Tumbler {
+ id: minutesTumbler
+ model: 60
+ delegate: delegateComponent
+ }
+
+ Tumbler {
+ id: amPmTumbler
+ model: ["AM", "PM"]
+ delegate: delegateComponent
+ }
+ }
+ }
+}
+//! [tumbler]
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-accent.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-accent.qml
new file mode 100644
index 0000000000..f429359e4f
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-accent.qml
@@ -0,0 +1,43 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import QtQuick.Controls.Universal
+
+Pane {
+ padding: 10
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ highlighted: true
+ Universal.accent: Universal.Orange
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-background.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-background.qml
new file mode 100644
index 0000000000..558618e65e
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-background.qml
@@ -0,0 +1,44 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Universal
+
+Pane {
+ padding: 10
+
+//! [1]
+Pane {
+ Universal.background: Universal.Steel
+
+ Button {
+ text: qsTr("Button")
+ }
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-foreground.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-foreground.qml
new file mode 100644
index 0000000000..39a292d88b
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-foreground.qml
@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Universal
+
+Pane {
+ padding: 10
+
+//! [1]
+Button {
+ text: qsTr("Button")
+ Universal.foreground: Universal.Pink
+}
+//! [1]
+}
diff --git a/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-theme.qml b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-theme.qml
new file mode 100644
index 0000000000..b55bf188bf
--- /dev/null
+++ b/src/quickcontrols2/doc/snippets/qtquickcontrols2-universal-theme.qml
@@ -0,0 +1,44 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the documentation of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:FDL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Controls.Universal
+
+Pane {
+ padding: 10
+
+//! [1]
+Pane {
+ Universal.theme: Universal.Dark
+
+ Button {
+ text: qsTr("Button")
+ }
+}
+//! [1]
+}