diff options
Diffstat (limited to 'doc')
14 files changed, 158 insertions, 227 deletions
diff --git a/doc/src/declarative/pics/gridview-highlight.png b/doc/src/declarative/pics/gridview-highlight.png Binary files differnew file mode 100644 index 0000000..b54af37 --- /dev/null +++ b/doc/src/declarative/pics/gridview-highlight.png diff --git a/doc/src/declarative/pics/gridview-simple.png b/doc/src/declarative/pics/gridview-simple.png Binary files differnew file mode 100644 index 0000000..a102939 --- /dev/null +++ b/doc/src/declarative/pics/gridview-simple.png diff --git a/doc/src/declarative/pics/gridview.png b/doc/src/declarative/pics/gridview.png Binary files differdeleted file mode 100644 index 3726893..0000000 --- a/doc/src/declarative/pics/gridview.png +++ /dev/null diff --git a/doc/src/declarative/pics/translate.png b/doc/src/declarative/pics/translate.png Binary files differnew file mode 100644 index 0000000..baf58b0 --- /dev/null +++ b/doc/src/declarative/pics/translate.png diff --git a/doc/src/declarative/pics/visualitemmodel.png b/doc/src/declarative/pics/visualitemmodel.png Binary files differnew file mode 100644 index 0000000..5e6d132 --- /dev/null +++ b/doc/src/declarative/pics/visualitemmodel.png diff --git a/doc/src/snippets/declarative/drag.qml b/doc/src/snippets/declarative/drag.qml deleted file mode 100644 index 0a69574..0000000 --- a/doc/src/snippets/declarative/drag.qml +++ /dev/null @@ -1,59 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the QtDeclarative module of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:LGPL$ -** No Commercial Usage -** This file contains pre-release code and may not be distributed. -** You may use this file in accordance with the terms and conditions -** contained in the Technology Preview License Agreement accompanying -** this package. -** -** GNU Lesser General Public License Usage -** Alternatively, this file may be used under the terms of the GNU Lesser -** General Public License version 2.1 as published by the Free Software -** Foundation and appearing in the file LICENSE.LGPL included in the -** packaging of this file. Please review the following information to -** ensure the GNU Lesser General Public License version 2.1 requirements -** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. -** -** In addition, as a special exception, Nokia gives you certain additional -** rights. These rights are described in the Nokia Qt LGPL Exception -** version 1.1, included in the file LGPL_EXCEPTION.txt in this package. -** -** If you have questions regarding the use of this file, please contact -** Nokia at qt-info@nokia.com. -** -** -** -** -** -** -** -** -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import Qt 4.7 - -//! [0] -Rectangle { - id: blurtest; width: 600; height: 200; color: "white" - Image { - id: pic; source: "qtlogo-64.png"; anchors.verticalCenter: parent.verticalCenter - opacity: (600.0-pic.x) / 600; - MouseArea { - anchors.fill: parent - drag.target: pic - drag.axis: Drag.XAxis - drag.minimumX: 0 - drag.maximumX: blurtest.width-pic.width - } - } -} -//! [0] diff --git a/doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml b/doc/src/snippets/declarative/gridview/ContactModel.qml index 1e79030..2da4660 100644 --- a/doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml +++ b/doc/src/snippets/declarative/gridview/ContactModel.qml @@ -39,28 +39,26 @@ ** ****************************************************************************/ +//![0] import Qt 4.7 ListModel { - id: contactModel + ListElement { - name: "Bill Smith" - number: "555 3264" + name: "Jim Williams" portrait: "pics/portrait.png" } ListElement { - name: "Jim Williams" - number: "555 5673" + name: "John Brown" portrait: "pics/portrait.png" } ListElement { - name: "John Brown" - number: "555 8426" + name: "Bill Smyth" portrait: "pics/portrait.png" } ListElement { name: "Sam Wise" - number: "555 0473" portrait: "pics/portrait.png" } } +//![0] diff --git a/doc/src/snippets/declarative/gridview/gridview.qml b/doc/src/snippets/declarative/gridview/gridview.qml index 3c205bc..0b3bbf3 100644 --- a/doc/src/snippets/declarative/gridview/gridview.qml +++ b/doc/src/snippets/declarative/gridview/gridview.qml @@ -39,50 +39,98 @@ ** ****************************************************************************/ +//![import] import Qt 4.7 +//![import] -//! [3] Rectangle { - width: 240; height: 180; color: "white" - // ContactModel model is defined in dummydata/ContactModel.qml - // The viewer automatically loads files in dummydata/* to assist - // development without a real data source. - - // Define a delegate component. A component will be - // instantiated for each visible item in the list. -//! [0] + width: childrenRect.width; height: childrenRect.height + +Row { + +//![classdocs simple] +GridView { + width: 300; height: 200 + + model: ContactModel {} + delegate: Column { + Image { source: portrait; anchors.horizontalCenter: parent.horizontalCenter } + Text { text: name; anchors.horizontalCenter: parent.horizontalCenter } + } +} +//![classdocs simple] + + +//![classdocs advanced] +Rectangle { + width: 300; height: 200 + Component { - id: delegate + id: contactDelegate Item { - id: wrapper - width: 80; height: 78 + width: grid.cellWidth; height: grid.cellHeight Column { + anchors.fill: parent Image { source: portrait; anchors.horizontalCenter: parent.horizontalCenter } Text { text: name; anchors.horizontalCenter: parent.horizontalCenter } } } } -//! [0] - // Define a highlight component. Just one of these will be instantiated - // by each ListView and placed behind the current item. -//! [1] - Component { - id: highlight - Rectangle { - color: "lightsteelblue" - radius: 5 - } - } -//! [1] - // The actual grid -//! [2] + GridView { - width: parent.width; height: parent.height - model: ContactModel; delegate: delegate + id: grid + anchors.fill: parent cellWidth: 80; cellHeight: 80 - highlight: highlight + + model: ContactModel {} + delegate: contactDelegate + highlight: Rectangle { color: "lightsteelblue"; radius: 5 } focus: true } -//! [2] } -//! [3] +//![classdocs advanced] + +//![delayRemove] +Component { + id: delegate + Item { + GridView.onRemove: SequentialAnimation { + PropertyAction { target: wrapper; property: "GridView.delayRemove"; value: true } + NumberAnimation { target: wrapper; property: "scale"; to: 0; duration: 250; easing.type: Easing.InOutQuad } + PropertyAction { target: wrapper; property: "GridView.delayRemove"; value: false } + } + } +} +//![delayRemove] + +//![highlightFollowsCurrentItem] +Component { + id: highlight + Rectangle { + width: view.cellWidth; height: view.cellHeight + color: "lightsteelblue"; radius: 5 + SpringFollow on x { to: view.currentItem.x; spring: 3; damping: 0.2 } + SpringFollow on y { to: view.currentItem.y; spring: 3; damping: 0.2 } + } +} + +GridView { + id: view + width: 300; height: 200 + cellWidth: 80; cellHeight: 80 + + model: ContactModel {} + delegate: Column { + Image { source: portrait; anchors.horizontalCenter: parent.horizontalCenter } + Text { text: name; anchors.horizontalCenter: parent.horizontalCenter } + } + + highlight: highlight + highlightFollowsCurrentItem: false + focus: true +} +//![highlightFollowsCurrentItem] + +} + +} diff --git a/doc/src/snippets/declarative/listview/highlight.qml b/doc/src/snippets/declarative/listview/highlight.qml deleted file mode 100644 index af9e95f..0000000 --- a/doc/src/snippets/declarative/listview/highlight.qml +++ /dev/null @@ -1,104 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies). -** All rights reserved. -** Contact: Nokia Corporation (qt-info@nokia.com) -** -** This file is part of the QtDeclarative module of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:LGPL$ -** No Commercial Usage -** This file contains pre-release code and may not be distributed. -** You may use this file in accordance with the terms and conditions -** contained in the Technology Preview License Agreement accompanying -** this package. -** -** GNU Lesser General Public License Usage -** Alternatively, this file may be used under the terms of the GNU Lesser -** General Public License version 2.1 as published by the Free Software -** Foundation and appearing in the file LICENSE.LGPL included in the -** packaging of this file. Please review the following information to -** ensure the GNU Lesser General Public License version 2.1 requirements -** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. -** -** In addition, as a special exception, Nokia gives you certain additional -** rights. These rights are described in the Nokia Qt LGPL Exception -** version 1.1, included in the file LGPL_EXCEPTION.txt in this package. -** -** If you have questions regarding the use of this file, please contact -** Nokia at qt-info@nokia.com. -** -** -** -** -** -** -** -** -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import Qt 4.7 - -Rectangle { - width: 180; height: 200; color: "white" - - // ContactModel model is defined in dummydata/ContactModel.qml - // The viewer automatically loads files in dummydata/* to assist - // development without a real data source. - - // Define a delegate component. A component will be - // instantiated for each visible item in the list. -//! [0] - Component { - id: delegate - Item { - id: wrapper - width: 180; height: 40 - Column { - x: 5; y: 5 - Text { text: '<b>Name:</b> ' + name } - Text { text: '<b>Number:</b> ' + number } - } - // Use the ListView.isCurrentItem attached property to - // indent the item if it is the current item. - states: [ - State { - name: "Current" - when: wrapper.ListView.isCurrentItem - PropertyChanges { target: wrapper; x: 10 } - } - ] - transitions: [ - Transition { NumberAnimation { properties: "x"; duration: 200 } } - ] - } - } -//! [0] - // Specify a highlight with custom movement. Note that autoHighlight - // is set to false in the ListView so that we can control how the - // highlight moves to the current item. -//! [1] - Component { - id: highlight - Rectangle { - width: 180; height: 40 - color: "lightsteelblue"; radius: 5 - SpringFollow on y { - to: list.currentItem.y - spring: 3 - damping: 0.2 - } - } - } - ListView { - id: list - width: parent.height; height: parent.height - model: ContactModel; delegate: delegate - highlight: highlight - highlightFollowsCurrentItem: false - focus: true - } -//! [1] -} diff --git a/doc/src/snippets/declarative/mouseregion.qml b/doc/src/snippets/declarative/mousearea.qml index a162854..c6071c7 100644 --- a/doc/src/snippets/declarative/mouseregion.qml +++ b/doc/src/snippets/declarative/mousearea.qml @@ -39,11 +39,17 @@ ** ****************************************************************************/ +//! [import] import Qt 4.7 +//! [import] + +Rectangle { + width: childrenRect.width + height: childrenRect.height -Rectangle { width: 200; height: 100 Row { -//! [0] + +//! [intro] Rectangle { width: 100; height: 100 color: "green" @@ -53,8 +59,9 @@ Rectangle { onClicked: { parent.color = 'red' } } } -//! [0] -//! [1] +//! [intro] + +//! [intro-extended] Rectangle { width: 100; height: 100 color: "green" @@ -70,6 +77,43 @@ Rectangle { } } } -//! [1] +//! [intro-extended] + +//! [drag] +Rectangle { + id: container + width: 600; height: 200 + + Image { + id: pic + source: "pics/qt.png" + opacity: (600.0 - pic.x) / 600 + + MouseArea { + anchors.fill: parent + drag.target: pic + drag.axis: Drag.XAxis + drag.minimumX: 0 + drag.maximumX: container.width - pic.width + } + } +} +//! [drag] + +//! [mousebuttons] +Text { + text: mouseArea.pressedButtons & Qt.RightButton ? "right" : "" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + + MouseArea { + id: mouseArea + anchors.fill: parent + acceptedButtons: Qt.LeftButton | Qt.RightButton + } +} +//! [mousebuttons] + } + } diff --git a/doc/src/snippets/declarative/pathview/dummydata/MenuModel.qml b/doc/src/snippets/declarative/pathview/ContactModel.qml index a52b60a..1a042a3 100644 --- a/doc/src/snippets/declarative/pathview/dummydata/MenuModel.qml +++ b/doc/src/snippets/declarative/pathview/ContactModel.qml @@ -39,20 +39,21 @@ ** ****************************************************************************/ +//![0] import Qt 4.7 ListModel { - id: menuModel ListElement { name: "Bill Jones" - icon: "pics/qtlogo-64.png" + icon: "pics/qtlogo.png" } ListElement { name: "Jane Doe" - icon: "pics/qtlogo-64.png" + icon: "pics/qtlogo.png" } ListElement { name: "John Smith" - icon: "pics/qtlogo-64.png" + icon: "pics/qtlogo.png" } } +//![0] diff --git a/doc/src/snippets/declarative/pathview/pathattributes.qml b/doc/src/snippets/declarative/pathview/pathattributes.qml index e8d2509..3ba3b95 100644 --- a/doc/src/snippets/declarative/pathview/pathattributes.qml +++ b/doc/src/snippets/declarative/pathview/pathattributes.qml @@ -39,16 +39,16 @@ ** ****************************************************************************/ +//! [0] import Qt 4.7 Rectangle { - width: 240; height: 200; color: 'white' -//! [0] + width: 240; height: 200 + //! [1] Component { id: delegate Item { - id: wrapper width: 80; height: 80 scale: PathView.scale opacity: PathView.opacity @@ -59,9 +59,12 @@ Rectangle { } } //! [1] + //! [2] PathView { - anchors.fill: parent; model: MenuModel; delegate: delegate + anchors.fill: parent + model: ContactModel {} + delegate: delegate path: Path { startX: 120; startY: 100 PathAttribute { name: "scale"; value: 1.0 } @@ -73,5 +76,5 @@ Rectangle { } } //! [2] -//! [0] } +//! [0] diff --git a/doc/src/snippets/declarative/pathview/pathview.qml b/doc/src/snippets/declarative/pathview/pathview.qml index 31b793d..1669847 100644 --- a/doc/src/snippets/declarative/pathview/pathview.qml +++ b/doc/src/snippets/declarative/pathview/pathview.qml @@ -39,27 +39,27 @@ ** ****************************************************************************/ +//! [0] import Qt 4.7 Rectangle { - width: 240; height: 200; color: 'white' -//! [0] + width: 240; height: 200 + //! [1] Component { id: delegate - Item { - id: wrapper - width: 80; height: 80 - Column { - Image { anchors.horizontalCenter: name.horizontalCenter; width: 64; height: 64; source: icon } - Text { text: name; font.pointSize: 16} - } + Column { + Image { anchors.horizontalCenter: name.horizontalCenter; width: 64; height: 64; source: icon } + Text { text: name; font.pointSize: 16 } } } //! [1] + //! [2] PathView { - anchors.fill: parent; model: MenuModel; delegate: delegate + anchors.fill: parent + model: ContactModel {} + delegate: delegate path: Path { startX: 120; startY: 100 PathQuad { x: 120; y: 25; controlX: 260; controlY: 75 } @@ -67,5 +67,5 @@ Rectangle { } } //! [2] -//! [0] } +//! [0] diff --git a/doc/src/snippets/declarative/pathview/pics/qtlogo-64.png b/doc/src/snippets/declarative/pathview/pics/qtlogo.png Binary files differindex 4f68e16..4f68e16 100644 --- a/doc/src/snippets/declarative/pathview/pics/qtlogo-64.png +++ b/doc/src/snippets/declarative/pathview/pics/qtlogo.png |
