Docs: Customizing Qt Quick Controls 2

Change-Id: I6fa85e9fa9a2f7c98ec751786271a60c6c050db5
Reviewed-by: J-P Nurmi <jpnurmi@theqtcompany.com>

12 files changed, 44 insertions, 0 deletions

diff --git a/src/imports/controls/BusyIndicator.qml b/src/imports/controls/BusyIndicator.qml
index cf92809f..3c37a27f 100644
--- a/src/imports/controls/BusyIndicator.qml
+++ b/src/imports/controls/BusyIndicator.qml
@@ -47,6 +47,7 @@ AbstractBusyIndicator {
 
     padding: Theme.padding
 
+    //! [indicator]
     indicator: Item {
         id: delegate
         implicitWidth: 48
@@ -77,4 +78,5 @@ AbstractBusyIndicator {
             }
         }
     }
+    //! [indicator]
 }
diff --git a/src/imports/controls/Frame.qml b/src/imports/controls/Frame.qml
index 7580fb06..f721f974 100644
--- a/src/imports/controls/Frame.qml
+++ b/src/imports/controls/Frame.qml
@@ -48,8 +48,11 @@ AbstractFrame {
 
     padding: Theme.padding
 
+    //! [contentItem]
     contentItem: Item { }
+    //! [contentItem]
 
+    //! [frame]
     frame: Rectangle {
         width: parent.width
         height: parent.height
@@ -58,4 +61,5 @@ AbstractFrame {
         radius: control.Theme.roundness
         border.color: control.Theme.frameColor
     }
+    //! [frame]
 }
diff --git a/src/imports/controls/GroupBox.qml b/src/imports/controls/GroupBox.qml
index c52af3ae..d9a8ea6a 100644
--- a/src/imports/controls/GroupBox.qml
+++ b/src/imports/controls/GroupBox.qml
@@ -49,8 +49,11 @@ AbstractGroupBox {
     padding: Theme.padding
     topPadding: Theme.padding + (label && title ? label.implicitHeight + Theme.spacing : 0)
 
+    //! [contentItem]
     contentItem: Item { }
+    //! [contentItem]
 
+    //! [label]
     label: Text {
         x: control.leftPadding
         width: control.availableWidth
@@ -61,7 +64,9 @@ AbstractGroupBox {
         horizontalAlignment: Text.AlignLeft
         verticalAlignment: Text.AlignVCenter
     }
+    //! [label]
 
+    //! [frame]
     frame: Rectangle {
         y: control.topPadding - control.Theme.padding
         width: parent.width
@@ -71,4 +76,5 @@ AbstractGroupBox {
         radius: control.Theme.roundness
         border.color: control.Theme.frameColor
     }
+    //! [frame]
 }
diff --git a/src/imports/controls/PageIndicator.qml b/src/imports/controls/PageIndicator.qml
index 4cc90487..bb6d59e2 100644
--- a/src/imports/controls/PageIndicator.qml
+++ b/src/imports/controls/PageIndicator.qml
@@ -62,6 +62,7 @@ AbstractPageIndicator {
 
     padding: Theme.padding
 
+    //! [contentItem]
     contentItem: Row {
         id: row
 
@@ -72,4 +73,5 @@ AbstractPageIndicator {
             delegate: control.delegate
         }
     }
+    //! [contentItem]
 }
diff --git a/src/imports/controls/ScrollBar.qml b/src/imports/controls/ScrollBar.qml
index 8f928d0c..51d74c7c 100644
--- a/src/imports/controls/ScrollBar.qml
+++ b/src/imports/controls/ScrollBar.qml
@@ -50,6 +50,7 @@ AbstractScrollBar {
 
     padding: 2
 
+    //! [handle]
     handle: Rectangle {
         id: handle
 
@@ -81,4 +82,5 @@ AbstractScrollBar {
             }
         }
     }
+    //! [handle]
 }
diff --git a/src/imports/controls/ScrollIndicator.qml b/src/imports/controls/ScrollIndicator.qml
index 71a50ebd..4ad989f6 100644
--- a/src/imports/controls/ScrollIndicator.qml
+++ b/src/imports/controls/ScrollIndicator.qml
@@ -49,6 +49,7 @@ AbstractScrollIndicator {
 
     padding: 2
 
+    //! [indicator]
     indicator: Rectangle {
         id: indicator
 
@@ -81,4 +82,5 @@ AbstractScrollIndicator {
             }
         ]
     }
+    //! [indicator]
 }
diff --git a/src/imports/controls/StackView.qml b/src/imports/controls/StackView.qml
index 396778b7..91df6420 100644
--- a/src/imports/controls/StackView.qml
+++ b/src/imports/controls/StackView.qml
@@ -40,19 +40,27 @@ import QtQuick.Controls 2.0
 AbstractStackView {
     id: root
 
+    //! [popEnter]
     popEnter: Transition {
         NumberAnimation { property: "x"; from: -root.width; to: 0; duration: 400; easing.type: Easing.OutCubic }
     }
+    //! [popEnter]
 
+    //! [popExit]
     popExit: Transition {
         NumberAnimation { property: "x"; from: 0; to: root.width; duration: 400; easing.type: Easing.OutCubic }
     }
+    //! [popExit]
 
+    //! [pushEnter]
     pushEnter: Transition {
         NumberAnimation { property: "x"; from: root.width; to: 0; duration: 400; easing.type: Easing.OutCubic }
     }
+    //! [pushEnter]
 
+    //! [pushExit]
     pushExit: Transition {
         NumberAnimation { property: "x"; from: 0; to: -root.width; duration: 400; easing.type: Easing.OutCubic }
     }
+    //! [pushExit]
 }
diff --git a/src/imports/controls/TabBar.qml b/src/imports/controls/TabBar.qml
index 3b0f7bfd..02363935 100644
--- a/src/imports/controls/TabBar.qml
+++ b/src/imports/controls/TabBar.qml
@@ -49,6 +49,7 @@ AbstractTabBar {
 
     Accessible.role: Accessible.PageTabList
 
+    //! [contentItem]
     contentItem: ListView {
         id: listView
 
@@ -73,7 +74,9 @@ AbstractTabBar {
             }
         }
     }
+    //! [contentItem]
 
+    //! [background]
     background: Rectangle {
         implicitWidth: 26
         implicitHeight: 26
@@ -89,4 +92,5 @@ AbstractTabBar {
             color: control.Theme.frameColor
         }
     }
+    //! [background]
 }
diff --git a/src/imports/controls/TabButton.qml b/src/imports/controls/TabButton.qml
index 05182a60..2b9658be 100644
--- a/src/imports/controls/TabButton.qml
+++ b/src/imports/controls/TabButton.qml
@@ -52,6 +52,7 @@ AbstractTabButton {
 
     padding: Theme.padding
 
+    //! [label]
     label: Text {
         x: control.leftPadding
         y: control.topPadding
@@ -65,10 +66,13 @@ AbstractTabButton {
         horizontalAlignment: Text.AlignHCenter
         verticalAlignment: Text.AlignVCenter
     }
+    //! [label]
 
+    //! [background]
     background: Rectangle {
         height: parent.height - 1
         implicitHeight: 26
         color: control.Theme.backgroundColor
     }
+    //! [background]
 }
diff --git a/src/imports/controls/TextArea.qml b/src/imports/controls/TextArea.qml
index 1bd14bc0..b9b72559 100644
--- a/src/imports/controls/TextArea.qml
+++ b/src/imports/controls/TextArea.qml
@@ -50,6 +50,7 @@ AbstractTextArea {
     selectionColor: Theme.selectionColor
     selectedTextColor: Theme.selectedTextColor
 
+    //! [placeholder]
     placeholder: Text {
         x: control.leftPadding
         y: control.topPadding
@@ -60,4 +61,5 @@ AbstractTextArea {
         opacity: control.Theme.disabledOpacity
         visible: !control.length
     }
+    //! [placeholder]
 }
diff --git a/src/imports/controls/ToolBar.qml b/src/imports/controls/ToolBar.qml
index f81ff916..0d5a5a16 100644
--- a/src/imports/controls/ToolBar.qml
+++ b/src/imports/controls/ToolBar.qml
@@ -48,10 +48,14 @@ AbstractToolBar {
 
     Accessible.role: Accessible.ToolBar
 
+    //! [contentItem]
     contentItem: Item { }
+    //! [contentItem]
 
+    //! [background]
     background: Rectangle {
         implicitHeight: 26
         color: control.Theme.baseColor
     }
+    //! [background]
 }
diff --git a/src/imports/controls/ToolButton.qml b/src/imports/controls/ToolButton.qml
index 60e1671b..83d3eee2 100644
--- a/src/imports/controls/ToolButton.qml
+++ b/src/imports/controls/ToolButton.qml
@@ -51,6 +51,7 @@ AbstractButton {
 
     padding: Theme.padding
 
+    //! [label]
     label: Text {
         x: control.leftPadding
         y: control.topPadding
@@ -63,7 +64,9 @@ AbstractButton {
         horizontalAlignment: Text.AlignHCenter
         verticalAlignment: Text.AlignVCenter
     }
+    //! [label]
 
+    //! [background]
     background: Rectangle {
         implicitWidth: 26
         implicitHeight: 26
@@ -72,4 +75,5 @@ AbstractButton {
         color: control.Theme.frameColor
         visible: control.pressed
     }
+    //! [background]
 }