diff options
author | J-P Nurmi <jpnurmi@qt.io> | 2017-01-18 16:29:14 +0100 |
---|---|---|
committer | J-P Nurmi <jpnurmi@qt.io> | 2017-01-27 10:40:01 +0000 |
commit | a9aa500a680058d7f2a75f02ad8d72c4b1e49f7c (patch) | |
tree | ff3ed2134ec7d966736a875f0b08ee74e0524b40 /src/imports/controls/doc | |
parent | 0942e5cd6f1e4c8eac45a77c5deece671a6f513b (diff) |
Add ScrollView
[ChangeLog][Controls][ScrollView] Added ScrollView.
Change-Id: I5d68799f0246e04b519bf6a0ec7bc7e5625f50e7
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
Reviewed-by: Qt CI Bot <qt_ci_bot@qt-project.org>
Diffstat (limited to 'src/imports/controls/doc')
11 files changed, 298 insertions, 8 deletions
diff --git a/src/imports/controls/doc/images/qtquickcontrols2-scrollview-custom.png b/src/imports/controls/doc/images/qtquickcontrols2-scrollview-custom.png Binary files differnew file mode 100644 index 00000000..9c2790c9 --- /dev/null +++ b/src/imports/controls/doc/images/qtquickcontrols2-scrollview-custom.png diff --git a/src/imports/controls/doc/images/qtquickcontrols2-scrollview-wireframe.png b/src/imports/controls/doc/images/qtquickcontrols2-scrollview-wireframe.png Binary files differnew file mode 100644 index 00000000..afdc681d --- /dev/null +++ b/src/imports/controls/doc/images/qtquickcontrols2-scrollview-wireframe.png diff --git a/src/imports/controls/doc/images/qtquickcontrols2-scrollview.png b/src/imports/controls/doc/images/qtquickcontrols2-scrollview.png Binary files differnew file mode 100644 index 00000000..2a1807ee --- /dev/null +++ b/src/imports/controls/doc/images/qtquickcontrols2-scrollview.png diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-interactive.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-interactive.qml new file mode 100644 index 00000000..8bb7be29 --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-interactive.qml @@ -0,0 +1,38 @@ +/**************************************************************************** +** +** Copyright (C) 2017 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$ +** +****************************************************************************/ + +import QtQuick 2.9 +import QtQuick.Controls 2.2 + +//! [file] +ScrollView { + // ... + ScrollBar.horizontal.interactive: true + ScrollBar.vertical.interactive: true +} +//! [file] + diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-listview.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-listview.qml new file mode 100644 index 00000000..bce00cde --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-listview.qml @@ -0,0 +1,61 @@ +/**************************************************************************** +** +** Copyright (C) 2017 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$ +** +****************************************************************************/ + +import QtQuick 2.9 +import QtQuick.Controls 2.2 + +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 + } + } +} +//! [file] +} diff --git a/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-policy.qml b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-policy.qml new file mode 100644 index 00000000..ce41950d --- /dev/null +++ b/src/imports/controls/doc/snippets/qtquickcontrols2-scrollview-policy.qml @@ -0,0 +1,38 @@ +/**************************************************************************** +** +** Copyright (C) 2017 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$ +** +****************************************************************************/ + +import QtQuick 2.9 +import QtQuick.Controls 2.2 + +//! [file] +ScrollView { + // ... + ScrollBar.horizontal.policy: ScrollBar.AlwaysOff + ScrollBar.vertical.policy: ScrollBar.AlwaysOn +} +//! [file] + diff --git a/src/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview-custom.qml b/src/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview-custom.qml new file mode 100644 index 00000000..82347a5d --- /dev/null +++ b/src/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview-custom.qml @@ -0,0 +1,81 @@ +/**************************************************************************** +** +** Copyright (C) 2017 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$ +** +****************************************************************************/ + +import QtQuick 2.9 +import QtQuick.Controls 2.2 + +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/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview.qml b/src/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview.qml new file mode 100644 index 00000000..8900cf9e --- /dev/null +++ b/src/imports/controls/doc/snippets/screenshots/qtquickcontrols2-scrollview.qml @@ -0,0 +1,61 @@ +/**************************************************************************** +** +** Copyright (C) 2017 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$ +** +****************************************************************************/ + +import QtQuick 2.9 +import QtQuick.Controls 2.2 + +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 + clip: true + + Label { + text: "ABC" + font.pixelSize: 224 + } +} +//! [file] +} diff --git a/src/imports/controls/doc/src/qtquickcontrols2-containers.qdoc b/src/imports/controls/doc/src/qtquickcontrols2-containers.qdoc index 139958e0..73cfd989 100644 --- a/src/imports/controls/doc/src/qtquickcontrols2-containers.qdoc +++ b/src/imports/controls/doc/src/qtquickcontrols2-containers.qdoc @@ -78,6 +78,12 @@ you to position its contents, for instance by using a \l RowLayout or a \l ColumnLayout. + \section1 ScrollView Control + + \image qtquickcontrols2-scrollview-wireframe.png + + \l ScrollView provides scrolling for user-defined content. + \section1 StackView Control \image qtquickcontrols2-stackview-wireframe.png diff --git a/src/imports/controls/doc/src/qtquickcontrols2-customize.qdoc b/src/imports/controls/doc/src/qtquickcontrols2-customize.qdoc index 6ef019f6..487c5d6f 100644 --- a/src/imports/controls/doc/src/qtquickcontrols2-customize.qdoc +++ b/src/imports/controls/doc/src/qtquickcontrols2-customize.qdoc @@ -636,6 +636,16 @@ \snippet qtquickcontrols2-scrollindicator-custom.qml file + \section2 Customizing ScrollView + + ScrollView consists of a \l {Control::background}{background} item, + and horizontal and vertical scroll bars. + + \image qtquickcontrols2-scrollview-custom.png + + \snippet qtquickcontrols2-scrollview-custom.qml file + + \section2 Customizing Slider Slider consists of two visual items: \l {Control::background}{background}, diff --git a/src/imports/controls/doc/src/qtquickcontrols2-differences.qdoc b/src/imports/controls/doc/src/qtquickcontrols2-differences.qdoc index 3423e423..dd86d2ed 100644 --- a/src/imports/controls/doc/src/qtquickcontrols2-differences.qdoc +++ b/src/imports/controls/doc/src/qtquickcontrols2-differences.qdoc @@ -328,14 +328,9 @@ \li \row \li \l [QML QtQuickControls] {ScrollView} - \li \mdash - \li \l [QML QtQuickControls2] {ScrollBar},\br - \l [QML QtQuickControls2] {ScrollIndicator} \br\sup {(Qt Quick Controls 2)} - \li \list - \li \b {Qt Quick Controls 2}: \c ScrollBar and \c ScrollIndicator offer - similar functionality. They can be attached to any \c Flickable to - build scrollable views. - \endlist + \li \l [QML QtQuickControls2] {ScrollView} + \li + \li \row \li \l [QML QtQuickControls] {Slider} \li \l [QML QtQuickControls2] {Slider} |