Merge remote-tracking branch 'origin/5.8' into dev

Conflicts:
	src/quickcontrols2/qquickstyle.cpp
	src/quicktemplates2/qquickslider.cpp

Change-Id: Ie12132690680706def6f516334a6ef0ba27336b3

25 files changed, 1029 insertions, 108 deletions

diff --git a/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml b/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml
new file mode 100644
index 00000000..8c8c4722
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/ContactDelegate.ui.qml
@@ -0,0 +1,184 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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 2.7
+import QtQuick.Controls 2.1
+
+AbstractButton {
+    clip: true
+    checkable: true
+    autoExclusive: true
+
+    id: delegate
+
+    height: 50
+    property alias remove: remove
+    property alias edit: edit
+    width: 300
+
+    Column {
+        id: column1
+        height: 400
+        width: parent.width - 20
+        spacing: 4
+
+        Row {
+            id: row1
+            spacing: 10
+
+            Label {
+                text: fullName
+                font.pointSize: 16
+                anchors.verticalCenter: parent.verticalCenter
+                font.bold: true
+            }
+        }
+
+        Grid {
+            id: grid
+            opacity: 0
+
+            x: 60
+            spacing: 10
+            columns: 2
+            Label {
+                text: qsTr("Address:")
+                font.bold: true
+                font.pixelSize: 16
+            }
+
+            Label {
+                text: address
+                font.pixelSize: 16
+                font.bold: true
+            }
+
+            Label {
+                text: qsTr("City:")
+                font.pixelSize: 16
+                font.bold: true
+            }
+
+            Label {
+                text: city
+                font.pixelSize: 16
+                font.bold: true
+            }
+
+            Label {
+                text: qsTr("Number:")
+                font.pixelSize: 16
+                font.bold: true
+            }
+
+            Label {
+                text: number
+                font.pixelSize: 16
+                font.bold: true
+            }
+        }
+
+        Row {
+            id: row
+            spacing: 12
+            anchors.right: parent.right
+
+            Button {
+                id: remove
+                width: 60
+                height: 20
+                text: "Remove"
+            }
+
+            Button {
+                id: edit
+                width: 60
+                height: 20
+                text: "Edit"
+            }
+        }
+
+        MenuSeparator {
+            id: separator
+            opacity: 0
+            padding: 0
+            anchors.right: parent.right
+            anchors.rightMargin: 4
+            anchors.left: parent.left
+            anchors.leftMargin: 4
+        }
+    }
+
+    states: [
+        State {
+            name: "collapsed"
+            when: !delegate.checked
+        },
+        State {
+            name: "expanded"
+            when: delegate.checked
+
+            PropertyChanges {
+                target: delegate
+                height: 160
+            }
+
+            PropertyChanges {
+                target: separator
+                opacity: 1
+            }
+
+            PropertyChanges {
+                target: grid
+                opacity: 1
+            }
+        }
+    ]
+}
diff --git a/examples/quickcontrols2/contactlist/ContactDialog.qml b/examples/quickcontrols2/contactlist/ContactDialog.qml
new file mode 100644
index 00000000..ed781282
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/ContactDialog.qml
@@ -0,0 +1,96 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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 2.7
+import QtQuick.Window 2.2
+import QtQuick.Controls 2.1
+
+Dialog {
+    standardButtons: Dialog.Ok | Dialog.Cancel
+    modal: true
+
+    x: parent.width / 2 - width / 2
+    y: parent.height / 2 - height / 2
+
+    property int lastIndex
+    property QtObject lastModel
+
+    property alias form: form
+
+    function addContact(model) {
+        form.fullName.clear();
+        form.address.clear();
+        form.city.clear();
+        form.number.clear();
+        lastIndex = -1;
+        lastModel = model;
+
+        dialog.open();
+    }
+
+    function editContact(model, index) {
+        form.fullName.text = model.getFullName(index);
+        form.address.text = model.getAddress(index);
+        form.city.text = model.getCity(index);
+        form.number.text = model.getNumber(index);
+        lastIndex = index;
+        lastModel = model;
+
+        dialog.open();
+    }
+
+   contentItem: ContactDialogForm {
+        id: form
+    }
+
+    onAccepted: lastModel.updateContact(lastIndex, form.fullName.text,
+                                        form.address.text, form.city.text,
+                                        form.number.text)
+}
diff --git a/examples/quickcontrols2/contactlist/ContactDialogForm.ui.qml b/examples/quickcontrols2/contactlist/ContactDialogForm.ui.qml
new file mode 100644
index 00000000..e1f31943
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/ContactDialogForm.ui.qml
@@ -0,0 +1,120 @@
+
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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 2.7
+import QtQuick.Layouts 1.0
+import QtQuick.Controls 2.1
+
+GridLayout {
+    id: grid
+    property alias fullName: fullName
+    property alias address: address
+    property alias city: city
+    property alias number: number
+    property int minimumInputSize: 120
+    property string placeholderText: qsTr("<enter>")
+
+    rows: 4
+    columns: 2
+
+    Label {
+        text: qsTr("Full Name:")
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+    }
+
+    TextField {
+        id: fullName
+        Layout.fillWidth: true
+        Layout.minimumWidth: grid.minimumInputSize
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+        placeholderText: grid.placeholderText
+    }
+
+    Label {
+        text: qsTr("Address")
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+    }
+
+    TextField {
+        id: address
+        Layout.fillWidth: true
+        Layout.minimumWidth: grid.minimumInputSize
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+        placeholderText: grid.placeholderText
+    }
+
+    Label {
+        text: qsTr("City")
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+    }
+
+    TextField {
+        id: city
+        Layout.fillWidth: true
+        Layout.minimumWidth: grid.minimumInputSize
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+        placeholderText: grid.placeholderText
+    }
+
+    Label {
+        text: qsTr("Number")
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+    }
+
+    TextField {
+        id: number
+        Layout.fillWidth: true
+        Layout.minimumWidth: grid.minimumInputSize
+        Layout.alignment: Qt.AlignLeft | Qt.AlignBaseline
+        placeholderText: grid.placeholderText
+    }
+}
+
diff --git a/examples/quickcontrols2/contactlist/MainForm.ui.qml b/examples/quickcontrols2/contactlist/MainForm.ui.qml
new file mode 100644
index 00000000..634398bd
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/MainForm.ui.qml
@@ -0,0 +1,113 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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 2.7
+import Backend 1.0
+import QtQuick.Controls 2.1
+
+Page {
+    id: form
+
+    width: 320
+    height: 480
+
+    property alias button: button
+    property alias listView: listView
+
+    property ContactDialog dialog: ContactDialog {
+    }
+
+    ListView {
+        id: listView
+
+        currentIndex: -1
+        boundsBehavior: Flickable.StopAtBounds
+        clip: true
+        focus: true
+        anchors.fill: parent
+        section.criteria: ViewSection.FirstCharacter
+        section.property: "fullName"
+        snapMode: ListView.SnapToItem
+
+        section.delegate: SectionDelegate {
+            width: listView.width
+        }
+
+        delegate: ContactDelegate {
+            id: delegate
+            width: listView.width
+            x: 5
+
+            Connections {
+                target: delegate.edit
+                onClicked: dialog.editContact(listView.model, index)
+            }
+
+            Connections {
+                target: delegate.remove
+                onClicked: listView.model.removeContact(index)
+            }
+        }
+
+        model: AddressModel {
+        }
+
+        ScrollBar.vertical: ScrollBar {
+        }
+    }
+
+    footer: ToolBar {
+        ToolButton {
+            id: button
+            text: "Add Contact"
+            anchors.right: parent.right
+        }
+    }
+}
diff --git a/examples/quickcontrols2/gallery/pages/DrawerPage.qml b/examples/quickcontrols2/contactlist/SectionDelegate.ui.qml
index 9e77223c..3b9f7dc5 100644
--- a/examples/quickcontrols2/gallery/pages/DrawerPage.qml
+++ b/examples/quickcontrols2/contactlist/SectionDelegate.ui.qml
@@ -1,12 +1,22 @@
 /****************************************************************************
 **
-** Copyright (C) 2015 The Qt Company Ltd.
-** Contact: http://www.qt.io/licensing/
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
 **
 ** $QT_BEGIN_LICENSE:BSD$
-** You may use this file under the terms of the BSD license as follows:
+** 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
@@ -38,36 +48,30 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.6
+import QtQuick 2.7
 import QtQuick.Controls 2.1
 
-Pane {
-    id: pane
-
-    Column {
-        spacing: 40
-        width: parent.width
-
-        Label {
-            width: parent.width
-            wrapMode: Label.Wrap
-            horizontalAlignment: Qt.AlignHCenter
-            text: "Drawer provides a swipe-based side panel, similar to those often used "
-                + "in touch interfaces to provide a central location for navigation."
+Rectangle {
+    height: 20
+    width: 120
+    gradient: Gradient {
+        GradientStop {
+            position: 0
+            color: "#dddddd"
         }
 
-        Button {
-            text: "Open"
-            anchors.horizontalCenter: parent.horizontalCenter
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, pane.availableWidth / 3))
-
-            onClicked: drawer.open()
+        GradientStop {
+            position: 1
+            color: "blue"
         }
     }
 
-    Image {
-        source: "../images/arrow.png"
-        anchors.left: parent.left
-        anchors.bottom: parent.bottom
+    Label {
+        x: 12
+        color: "white"
+        text: section
+        style: Text.Raised
+        font.pixelSize: 18
+        font.bold: true
     }
 }
diff --git a/examples/quickcontrols2/contactlist/addressmodel.cpp b/examples/quickcontrols2/contactlist/addressmodel.cpp
new file mode 100644
index 00000000..fb83186e
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/addressmodel.cpp
@@ -0,0 +1,150 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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$
+**
+****************************************************************************/
+
+#include "addressmodel.h"
+
+AddressModel::AddressModel(QObject *parent ) : QAbstractListModel(parent)
+{
+    m_data.append({ "Angel Hogan", "Chapel St. 368 ", "Clearwater" , "0311 1823993" });
+    m_data.append({ "Felicia Patton", "Annadale Lane 2", "Knoxville" , "0368 1244494" });
+    m_data.append({ "Grant Crawford", "Windsor Drive 34", "Riverdale" , "0351 7826892" });
+    m_data.append({ "Gretchen Little", "Sunset Drive 348", "Virginia Beach" , "0343 1234991" });
+    m_data.append({ "Geoffrey Richards", "University Lane 54", "Trussville" , "0423 2144944" });
+    m_data.append({ "Henrietta Chavez", "Via Volto San Luca 3", "Piobesi Torinese" , "0399 2826994" });
+    m_data.append({ "Harvey Chandler", "North Squaw Creek 11", "Madisonville" , "0343 1244492" });
+    m_data.append({ "Miguel Gomez", "Wild Rose Street 13", "Trussville" , "0343 9826996" });
+    m_data.append({ "Norma Rodriguez", " Glen Eagles Street  53", "Buffalo" , "0241 5826596" });
+    m_data.append({ "Shelia Ramirez", "East Miller Ave 68", "Pickerington" , "0346 4844556" });
+    m_data.append({ "Stephanie Moss", "Piazza Trieste e Trento 77", "Roata Chiusani" , "0363 0510490" });
+}
+
+int AddressModel::rowCount(const QModelIndex &) const
+{
+    return m_data.count();
+}
+
+QVariant AddressModel::data(const QModelIndex &index, int role) const
+{
+    if (index.row() < rowCount())
+        switch (role) {
+        case FullNameRole: return m_data.at(index.row()).fullName;
+        case AddressRole: return m_data.at(index.row()).address;
+        case CityRole: return m_data.at(index.row()).city;
+        case NumberRole: return m_data.at(index.row()).number;
+        default: return QVariant();
+
+        }
+    return QVariant();
+}
+
+QHash<int, QByteArray> AddressModel::roleNames() const
+{
+    static QHash<int, QByteArray> roleNames {
+        { FullNameRole, "fullName" },
+        { AddressRole, "address" },
+        { CityRole, "city" },
+        { NumberRole, "number" }
+    };
+    return roleNames;
+}
+
+void AddressModel::updateContact(int row,
+                                 const QString &fullName,
+                                 const QString &address,
+                                 const QString &city,
+                                 const QString &number)
+{
+    if (row >= 0 && row < rowCount()) {
+        m_data.replace(row, { fullName, address, city, number });
+        dataChanged(index(row, 0), index(row, 0), { FullNameRole, AddressRole, CityRole, NumberRole });
+    } else if (row < 0) {
+        beginInsertRows(QModelIndex(), rowCount() - 1, rowCount() - 1);
+        m_data.append({fullName, address, city, number});
+        endInsertRows();
+        dataChanged(index(rowCount() - 1, 0), index(rowCount() - 1, 0), { FullNameRole, AddressRole, CityRole, NumberRole });
+    }
+}
+
+void AddressModel::removeContact(int row)
+{
+    if (row >= 0 && row < rowCount()) {
+        beginRemoveRows(QModelIndex(), row, row);
+        m_data.removeAt(row);
+        endRemoveRows();
+    }
+}
+
+QString AddressModel::getFullName(int row) const
+{
+    if (row >= 0 && row < rowCount())
+        return m_data.at(row).fullName;
+    return QString();
+}
+
+QString AddressModel::getAddress(int row) const
+{
+    if (row >= 0 && row < rowCount())
+        return m_data.at(row).address;
+    return QString();
+}
+
+QString AddressModel::getCity(int row) const
+{
+    if (row >= 0 && row < rowCount())
+        return m_data.at(row).city;
+    return QString();
+}
+
+QString AddressModel::getNumber(int row) const
+{
+    if (row >= 0 && row < rowCount())
+        return m_data.at(row).number;
+    return QString();
+}
diff --git a/examples/quickcontrols2/contactlist/addressmodel.h b/examples/quickcontrols2/contactlist/addressmodel.h
new file mode 100644
index 00000000..04417b95
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/addressmodel.h
@@ -0,0 +1,95 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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$
+**
+****************************************************************************/
+
+#ifndef ADDRESSMODEL_H
+#define ADDRESSMODEL_H
+
+#include <QAbstractListModel>
+
+class AddressModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    enum AdressModelRoles {
+        FullNameRole = Qt::DisplayRole,
+        AddressRole = Qt::UserRole,
+        CityRole,
+        NumberRole
+    };
+
+    Q_ENUM(AdressModelRoles)
+
+    AddressModel(QObject *parent = nullptr);
+
+    int rowCount(const QModelIndex & = QModelIndex()) const;
+    QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const;
+    QHash<int, QByteArray> roleNames() const;
+
+    Q_INVOKABLE QString getFullName(int row) const;
+    Q_INVOKABLE QString getAddress(int row) const;
+    Q_INVOKABLE QString getCity(int row) const;
+    Q_INVOKABLE QString getNumber(int row) const;
+
+    Q_INVOKABLE void updateContact(int row, const QString &fullName, const QString &address, const QString  &city, const QString &number);
+    Q_INVOKABLE void removeContact(int row);
+
+private:
+    struct Data {
+        QString fullName;
+        QString address;
+        QString city;
+        QString number;
+    };
+
+    QList<Data> m_data;
+};
+
+#endif // ADDRESSMODEL_H
diff --git a/examples/quickcontrols2/contactlist/contactlist.pro b/examples/quickcontrols2/contactlist/contactlist.pro
new file mode 100644
index 00000000..8125d020
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/contactlist.pro
@@ -0,0 +1,26 @@
+TEMPLATE = app
+TARGET = contactlist
+
+QT += quick quickcontrols2
+CONFIG += c++11
+
+HEADERS += \
+    addressmodel.h
+
+SOURCES += main.cpp \
+    addressmodel.cpp
+
+RESOURCES += \
+   $$files(*.qml) \
+
+# Additional import path used to resolve QML modules in Qt Creator's code model
+QML_IMPORT_PATH=$$PWD/imports
+
+# Additional import path used to resolve QML modules just for Qt Quick Designer
+QML_DESIGNER_IMPORT_PATH=$$PWD/designer
+
+OTHER_FILES += \
+    designer/Backend/*.qml
+
+target.path = $$[QT_INSTALL_EXAMPLES]/quickcontrols2/contactlist
+INSTALLS += target
diff --git a/examples/quickcontrols2/gallery/pages/MenuPage.qml b/examples/quickcontrols2/contactlist/contactlist.qml
index 49e6da07..7ace67fa 100644
--- a/examples/quickcontrols2/gallery/pages/MenuPage.qml
+++ b/examples/quickcontrols2/contactlist/contactlist.qml
@@ -1,12 +1,22 @@
 /****************************************************************************
 **
-** Copyright (C) 2015 The Qt Company Ltd.
-** Contact: http://www.qt.io/licensing/
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
 **
 ** $QT_BEGIN_LICENSE:BSD$
-** You may use this file under the terms of the BSD license as follows:
+** 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
@@ -38,30 +48,17 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.6
+import QtQuick 2.7
 import QtQuick.Controls 2.1
 
-ScrollablePage {
-    id: page
-
-    Column {
-        spacing: 40
-        width: parent.width
-
-        Label {
-            width: parent.width
-            wrapMode: Label.Wrap
-            horizontalAlignment: Qt.AlignHCenter
-            text: "Menu can be used either as a context menu, or as a popup menu."
-        }
-
-        Button {
-            id: button
-            text: "Open"
-            anchors.horizontalCenter: parent.horizontalCenter
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, page.availableWidth / 3))
+ApplicationWindow {
+    visible: true
+    width: 320
+    height: 480
+    title: qsTr("Contact List")
 
-            onClicked: optionsMenu.open()
-        }
+    MainForm {
+        button.onClicked: dialog.addContact(listView.model)
+        anchors.fill: parent
     }
 }
diff --git a/examples/quickcontrols2/contactlist/designer/Backend/AddressModel.qml b/examples/quickcontrols2/contactlist/designer/Backend/AddressModel.qml
new file mode 100644
index 00000000..b9570934
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/designer/Backend/AddressModel.qml
@@ -0,0 +1,88 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples 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 2.6
+
+ListModel {
+    ListElement {
+       address: "Chapel St. 368"
+       city: "Knoxville"
+       number: "0311 1823993"
+       fullName: "Angel Hogan"
+    }
+
+    ListElement {
+       address: "Annadale Lane 2"
+       city: "Clearwater"
+       number: "0368 1244494"
+       fullName: "Felicia Patton"
+    }
+
+    ListElement {
+       address: "Windsor Drive 34"
+       city: "Riverdale"
+       number: "0368 1244494"
+       fullName: "Grant Crawford"
+    }
+
+    ListElement {
+       address: "Sunset Drive 348"
+       city: "Virginia Beach"
+       number: "0351 7826892"
+       fullName: "Gretchen Little"
+    }
+
+    ListElement {
+       address: "University Lane 54"
+       city: "Trussville"
+       number: "0399 2826994"
+       fullName: "Geoffrey Richards"
+    }
+}
diff --git a/examples/quickcontrols2/contactlist/designer/Backend/qmldir b/examples/quickcontrols2/contactlist/designer/Backend/qmldir
new file mode 100644
index 00000000..45552843
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/designer/Backend/qmldir
@@ -0,0 +1,2 @@
+module Backend
+AddressModel 1.0 AddressModel.qml
diff --git a/examples/quickcontrols2/contactlist/doc/images/qtquickcontrols2-contactlist.png b/examples/quickcontrols2/contactlist/doc/images/qtquickcontrols2-contactlist.png
new file mode 100644
index 00000000..642cf2dc
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/doc/images/qtquickcontrols2-contactlist.png
diff --git a/examples/quickcontrols2/contactlist/doc/src/qtquickcontrols2-contactlist.qdoc b/examples/quickcontrols2/contactlist/doc/src/qtquickcontrols2-contactlist.qdoc
new file mode 100644
index 00000000..93ef569d
--- /dev/null
+++ b/examples/quickcontrols2/contactlist/doc/src/qtquickcontrols2-contactlist.qdoc
@@ -0,0 +1,71 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: http://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 http://www.qt.io/terms-conditions. For further
+** information use the contact form at http://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: http://www.gnu.org/copyleft/fdl.html.
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+/*!
+    \example contactlist
+    \title Qt Quick Controls 2 - Contact List
+    \ingroup qtquickcontrols2-examples
+    \brief A QML app using Qt Quick Controls 2 and a C++ class that implements
+    a simple contact list.
+
+    The \e {Contact List Example} shows how to integrate a C++ backend in a way that
+    is compatible with Qt Quick Designer.
+    For the declarative parts of the UI, .ui.qml files are used that can be edited
+    visually in the Qt Quick Designer.
+
+    \section1 C++ Backend
+
+    \borderedimage image qtquickcontrols2-contactlist.png
+
+    The contact list application allows the user to add, edit, and remove contacts.
+    The actual implementation is done in C++ and exposed as a QAbstractListModel.
+
+    The AdressModel C++ class is registered under a namespace and later
+    imported and instantiated by \e MainForm.ui.qml. For more information about registering C++
+    classes as QML types, see \l {Defining QML Types from C++}.
+
+    \code
+    #include <QtQml/qqml.h>
+    ...
+    qmlRegisterType<AdressModel>("Backend", 1, 0, "AdressModel");
+    ...
+    \endcode
+
+    \section1 Designer Support
+
+    In the designer subdirectory, we create a plugin that replaces the AdressModel
+    in Qt Quick Designer. For this to work we add the following line to \e contactlist.pro.
+
+    \code
+    QML_DESIGNER_IMPORT_PATH=$$PWD/designer
+    \endcode
+
+    Because Qt Quick Designer cannot instantiate the AdressModel C++ class, we define
+    a mockup using a ListModel. This ensures that the ListView using the model shows something
+    in Qt Quick Designer.
+
+    \include examples-run.qdocinc
+*/
diff --git a/examples/quickcontrols2/gallery/pages/PopupPage.qml b/examples/quickcontrols2/contactlist/main.cpp
index ac3b02b7..9c75d7b3 100644
--- a/examples/quickcontrols2/gallery/pages/PopupPage.qml
+++ b/examples/quickcontrols2/contactlist/main.cpp
@@ -1,12 +1,22 @@
 /****************************************************************************
 **
-** Copyright (C) 2015 The Qt Company Ltd.
-** Contact: http://www.qt.io/licensing/
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the examples of the Qt Toolkit.
 **
 ** $QT_BEGIN_LICENSE:BSD$
-** You may use this file under the terms of the BSD license as follows:
+** 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
@@ -38,31 +48,20 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.6
-import QtQuick.Controls 2.1
+#include "addressmodel.h"
 
-ScrollablePage {
-    id: page
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
 
-    Column {
-        spacing: 40
-        width: parent.width
+int main(int argc, char *argv[])
+{
+    QGuiApplication app(argc, argv);
 
-        Label {
-            width: parent.width
-            wrapMode: Label.Wrap
-            horizontalAlignment: Qt.AlignHCenter
-            text: "Popup is used to display modal or modeless content that overlays other "
-                + "application content. In this example, the settings are shown in a popup."
-        }
+    qmlRegisterType<AddressModel>("Backend", 1, 0, "AddressModel");
 
-        Button {
-            id: button
-            text: "Open"
-            anchors.horizontalCenter: parent.horizontalCenter
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, page.availableWidth / 3))
+    QQmlApplicationEngine engine;
+    engine.addImportPath(":/imports");
+    engine.load(QUrl(QStringLiteral("qrc:/contactlist.qml")));
 
-            onClicked: settingsDialog.open()
-        }
-    }
+    return app.exec();
 }
diff --git a/examples/quickcontrols2/gallery/gallery.qml b/examples/quickcontrols2/gallery/gallery.qml
index a07872d5..06e7fc06 100644
--- a/examples/quickcontrols2/gallery/gallery.qml
+++ b/examples/quickcontrols2/gallery/gallery.qml
@@ -159,12 +159,9 @@ ApplicationWindow {
                 ListElement { title: "Dial"; source: "qrc:/pages/DialPage.qml" }
                 ListElement { title: "Dialog"; source: "qrc:/pages/DialogPage.qml" }
                 ListElement { title: "Delegates"; source: "qrc:/pages/DelegatePage.qml" }
-                ListElement { title: "Drawer"; source: "qrc:/pages/DrawerPage.qml" }
                 ListElement { title: "Frame"; source: "qrc:/pages/FramePage.qml" }
                 ListElement { title: "GroupBox"; source: "qrc:/pages/GroupBoxPage.qml" }
-                ListElement { title: "Menu"; source: "qrc:/pages/MenuPage.qml" }
                 ListElement { title: "PageIndicator"; source: "qrc:/pages/PageIndicatorPage.qml" }
-                ListElement { title: "Popup"; source: "qrc:/pages/PopupPage.qml" }
                 ListElement { title: "ProgressBar"; source: "qrc:/pages/ProgressBarPage.qml" }
                 ListElement { title: "RadioButton"; source: "qrc:/pages/RadioButtonPage.qml" }
                 ListElement { title: "RangeSlider"; source: "qrc:/pages/RangeSliderPage.qml" }
diff --git a/examples/quickcontrols2/gallery/pages/BusyIndicatorPage.qml b/examples/quickcontrols2/gallery/pages/BusyIndicatorPage.qml
index d9e5f788..403da14e 100644
--- a/examples/quickcontrols2/gallery/pages/BusyIndicatorPage.qml
+++ b/examples/quickcontrols2/gallery/pages/BusyIndicatorPage.qml
@@ -57,9 +57,6 @@ ScrollablePage {
         }
 
         BusyIndicator {
-            readonly property int size: Math.min(page.availableWidth, page.availableHeight) / 5
-            width: size
-            height: size
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/ButtonPage.qml b/examples/quickcontrols2/gallery/pages/ButtonPage.qml
index 7e945fa1..39776380 100644
--- a/examples/quickcontrols2/gallery/pages/ButtonPage.qml
+++ b/examples/quickcontrols2/gallery/pages/ButtonPage.qml
@@ -39,13 +39,12 @@
 ****************************************************************************/
 
 import QtQuick 2.6
+import QtQuick.Layouts 1.0
 import QtQuick.Controls 2.1
 
 ScrollablePage {
     id: page
 
-    readonly property int itemWidth: Math.max(button.implicitWidth, Math.min(button.implicitWidth * 2, page.availableWidth / 3))
-
     Column {
         spacing: 40
         width: parent.width
@@ -58,24 +57,24 @@ ScrollablePage {
                 + "Buttons are normally used to perform an action, or to answer a question."
         }
 
-        Column {
+        ColumnLayout {
             spacing: 20
             anchors.horizontalCenter: parent.horizontalCenter
 
             Button {
                 text: "First"
-                width: itemWidth
+                Layout.fillWidth: true
             }
             Button {
                 id: button
                 text: "Second"
-                width: itemWidth
                 highlighted: true
+                Layout.fillWidth: true
             }
             Button {
                 text: "Third"
                 enabled: false
-                width: itemWidth
+                Layout.fillWidth: true
             }
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/ComboBoxPage.qml b/examples/quickcontrols2/gallery/pages/ComboBoxPage.qml
index c800ba73..a52fcb67 100644
--- a/examples/quickcontrols2/gallery/pages/ComboBoxPage.qml
+++ b/examples/quickcontrols2/gallery/pages/ComboBoxPage.qml
@@ -58,7 +58,6 @@ ScrollablePage {
 
         ComboBox {
             model: ["First", "Second", "Third"]
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, page.availableWidth / 3))
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/ProgressBarPage.qml b/examples/quickcontrols2/gallery/pages/ProgressBarPage.qml
index 1548192f..a2646fd0 100644
--- a/examples/quickcontrols2/gallery/pages/ProgressBarPage.qml
+++ b/examples/quickcontrols2/gallery/pages/ProgressBarPage.qml
@@ -44,8 +44,6 @@ import QtQuick.Controls 2.1
 ScrollablePage {
     id: page
 
-    readonly property int itemWidth: Math.max(bar.implicitWidth, page.availableWidth / 3)
-
     Column {
         spacing: 40
         width: parent.width
@@ -61,13 +59,11 @@ ScrollablePage {
         ProgressBar {
             id: bar
             value: 0.5
-            width: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
 
         ProgressBar {
             indeterminate: true
-            width: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/RangeSliderPage.qml b/examples/quickcontrols2/gallery/pages/RangeSliderPage.qml
index 6a74e348..629a788b 100644
--- a/examples/quickcontrols2/gallery/pages/RangeSliderPage.qml
+++ b/examples/quickcontrols2/gallery/pages/RangeSliderPage.qml
@@ -44,8 +44,6 @@ import QtQuick.Controls 2.1
 ScrollablePage {
     id: page
 
-    readonly property int itemWidth: Math.max(slider.implicitWidth, Math.min(slider.implicitWidth * 2, page.availableWidth / 3))
-
     Column {
         spacing: 40
         width: parent.width
@@ -61,7 +59,6 @@ ScrollablePage {
             id: slider
             first.value: 0.25
             second.value: 0.75
-            width: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
 
@@ -69,7 +66,6 @@ ScrollablePage {
             orientation: Qt.Vertical
             first.value: 0.25
             second.value: 0.75
-            height: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/SliderPage.qml b/examples/quickcontrols2/gallery/pages/SliderPage.qml
index 03cb7696..83ae32ef 100644
--- a/examples/quickcontrols2/gallery/pages/SliderPage.qml
+++ b/examples/quickcontrols2/gallery/pages/SliderPage.qml
@@ -44,8 +44,6 @@ import QtQuick.Controls 2.1
 ScrollablePage {
     id: page
 
-    readonly property int itemWidth: Math.max(slider.implicitWidth, Math.min(slider.implicitWidth * 2, page.availableWidth / 3))
-
     Column {
         spacing: 40
         width: parent.width
@@ -60,14 +58,12 @@ ScrollablePage {
         Slider {
             id: slider
             value: 0.5
-            width: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
 
         Slider {
             orientation: Qt.Vertical
             value: 0.5
-            height: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/SpinBoxPage.qml b/examples/quickcontrols2/gallery/pages/SpinBoxPage.qml
index c75982c2..93adc01a 100644
--- a/examples/quickcontrols2/gallery/pages/SpinBoxPage.qml
+++ b/examples/quickcontrols2/gallery/pages/SpinBoxPage.qml
@@ -44,8 +44,6 @@ import QtQuick.Controls 2.1
 ScrollablePage {
     id: page
 
-    readonly property int itemWidth: Math.max(box.implicitWidth, Math.min(box.implicitWidth * 2, pane.availableWidth / 3))
-
     Column {
         spacing: 40
         width: parent.width
@@ -61,7 +59,6 @@ ScrollablePage {
         SpinBox {
             id: box
             value: 50
-            width: itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
             editable: true
         }
diff --git a/examples/quickcontrols2/gallery/pages/TextFieldPage.qml b/examples/quickcontrols2/gallery/pages/TextFieldPage.qml
index 9917da33..1b22fd08 100644
--- a/examples/quickcontrols2/gallery/pages/TextFieldPage.qml
+++ b/examples/quickcontrols2/gallery/pages/TextFieldPage.qml
@@ -58,7 +58,6 @@ ScrollablePage {
         TextField {
             id: field
             placeholderText: "TextField"
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, pane.availableWidth / 3))
             anchors.horizontalCenter: parent.horizontalCenter
         }
     }
diff --git a/examples/quickcontrols2/gallery/pages/ToolTipPage.qml b/examples/quickcontrols2/gallery/pages/ToolTipPage.qml
index 98ecd92e..d9bc969d 100644
--- a/examples/quickcontrols2/gallery/pages/ToolTipPage.qml
+++ b/examples/quickcontrols2/gallery/pages/ToolTipPage.qml
@@ -58,7 +58,6 @@ ScrollablePage {
         Button {
             text: "Tip"
             anchors.horizontalCenter: parent.horizontalCenter
-            width: Math.max(implicitWidth, Math.min(implicitWidth * 2, pane.availableWidth / 3))
 
             ToolTip.timeout: 5000
             ToolTip.visible: pressed
diff --git a/examples/quickcontrols2/quickcontrols2.pro b/examples/quickcontrols2/quickcontrols2.pro
index 6d732b17..458d10db 100644
--- a/examples/quickcontrols2/quickcontrols2.pro
+++ b/examples/quickcontrols2/quickcontrols2.pro
@@ -2,4 +2,5 @@ TEMPLATE = subdirs
 SUBDIRS += \
     gallery \
     chattutorial \
-    texteditor
+    texteditor \
+    contactlist