diff options
author | Bea Lam <bea.lam@nokia.com> | 2010-06-01 06:27:59 (GMT) |
---|---|---|
committer | Bea Lam <bea.lam@nokia.com> | 2010-06-02 00:07:33 (GMT) |
commit | 9cb0802cede5f9fd91ca303bcec5ae869acae951 (patch) | |
tree | f90d5fed5004dfa7e526783d81f94f04444313e4 | |
parent | 2e904930ede28a59710ef6f898419aba7ede7c06 (diff) | |
download | Qt-9cb0802cede5f9fd91ca303bcec5ae869acae951.zip Qt-9cb0802cede5f9fd91ca303bcec5ae869acae951.tar.gz Qt-9cb0802cede5f9fd91ca303bcec5ae869acae951.tar.bz2 |
Doc fixes and improvements - fix some example code, link to
examples from class docs and improve assorted docs
35 files changed, 488 insertions, 486 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 diff --git a/src/declarative/graphicsitems/qdeclarativeanimatedimage.cpp b/src/declarative/graphicsitems/qdeclarativeanimatedimage.cpp index a05e426..261cc5c 100644 --- a/src/declarative/graphicsitems/qdeclarativeanimatedimage.cpp +++ b/src/declarative/graphicsitems/qdeclarativeanimatedimage.cpp @@ -72,13 +72,22 @@ QT_BEGIN_NAMESPACE \o \image animatedimageitem.gif \o \qml -Item { - width: anim.width; height: anim.height+8 - AnimatedImage { id: anim; source: "pics/games-anim.gif" } - Rectangle { color: "red"; width: 4; height: 8; y: anim.height - x: (anim.width-width)*anim.currentFrame/(anim.frameCount-1) + import Qt 4.7 + + Rectangle { + width: animation.width; height: animation.height + 8 + + AnimatedImage { id: animation; source: "animation.gif" } + + Rectangle { + property int frames: animation.frameCount + + width: 4; height: 8 + x: (animation.width - width) * animation.currentFrame / frames + y: animation.height + color: "red" + } } -} \endqml \endtable */ @@ -96,7 +105,7 @@ QDeclarativeAnimatedImage::~QDeclarativeAnimatedImage() /*! \qmlproperty bool AnimatedImage::paused - This property holds whether the animated image is paused or not + This property holds whether the animated image is paused. Defaults to false, and can be set to true when you want to pause. */ @@ -120,7 +129,7 @@ void QDeclarativeAnimatedImage::setPaused(bool pause) } /*! \qmlproperty bool AnimatedImage::playing - This property holds whether the animated image is playing or not + This property holds whether the animated image is playing. Defaults to true, so as to start playing immediately. */ diff --git a/src/declarative/graphicsitems/qdeclarativeflipable.cpp b/src/declarative/graphicsitems/qdeclarativeflipable.cpp index d926119..8c9d2dd 100644 --- a/src/declarative/graphicsitems/qdeclarativeflipable.cpp +++ b/src/declarative/graphicsitems/qdeclarativeflipable.cpp @@ -74,7 +74,7 @@ public: \inherits Item Flipable is an item that can be visibly "flipped" between its front and - back sides. It is used together with Rotation and State/Transition to + back sides. It is used together with \l Rotation and \l {State}/\l {Transition} to produce a flipping effect. Here is a Flipable that flips whenever it is clicked: @@ -83,10 +83,12 @@ public: \image flipable.gif - The Rotation element is used to specify the angle and axis of the flip, - and the State defines the changes in angle which produce the flipping - effect. Finally, the Transition creates the animation that changes the + The \l Rotation element is used to specify the angle and axis of the flip, + and the \l State defines the changes in angle which produce the flipping + effect. Finally, the \l Transition creates the animation that changes the angle over one second. + + \sa {declarative/ui-components/flipable}{Flipable example} */ /*! diff --git a/src/declarative/graphicsitems/qdeclarativegridview.cpp b/src/declarative/graphicsitems/qdeclarativegridview.cpp index 906f1fc..ffffc2f 100644 --- a/src/declarative/graphicsitems/qdeclarativegridview.cpp +++ b/src/declarative/graphicsitems/qdeclarativegridview.cpp @@ -904,28 +904,43 @@ void QDeclarativeGridViewPrivate::flick(AxisData &data, qreal minExtent, qreal m \inherits Flickable \brief The GridView item provides a grid view of items provided by a model. - The model is typically provided by a QAbstractListModel "C++ model object", - but can also be created directly in QML. + A GridView displays data from models created from built-in QML elements like ListModel + and XmlListModel, or custom model classes defined in C++ that inherit from + QAbstractListModel. - The items are laid out top to bottom (vertically) or left to right (horizontally) - and may be flicked to scroll. + A GridView has a \l model, which defines the data to be displayed, and + a \l delegate, which defines how the data should be displayed. Items in a + GridView are laid out horizontally or vertically. Grid views are inherently flickable + as GridView inherits from \l Flickable. - The below example creates a very simple grid, using a QML model. + For example, if there is a simple list model defined in a file \c ContactModel.qml like this: - \image gridview.png + \snippet doc/src/snippets/declarative/gridview/ContactModel.qml 0 - \snippet doc/src/snippets/declarative/gridview/gridview.qml 3 + Another component can display this model data in a GridView, like this: - The model is defined as a ListModel using QML: - \quotefile doc/src/snippets/declarative/gridview/dummydata/ContactModel.qml + \snippet doc/src/snippets/declarative/gridview/gridview.qml import + \codeline + \snippet doc/src/snippets/declarative/gridview/gridview.qml classdocs simple + \image gridview-simple.png - In this case ListModel is a handy way for us to test our UI. In practice - the model would be implemented in C++, or perhaps via a SQL data source. + Here, the GridView creates a \c ContactModel component for its model, and a \l Column element + (containing \l Image and \ Text elements) for its delegate. The view will create a new delegate + for each item in the model. Notice the delegate is able to access the model's \c name and + \c portrait data directly. + + An improved grid view is shown below. The delegate is visually improved and is moved + into a separate \c contactDelegate component. Also, the currently selected item is highlighted + with a blue \l Rectangle using the \l highlight property, and \c focus is set to \c true + to enable keyboard navigation for the grid view. + + \snippet doc/src/snippets/declarative/gridview/gridview.qml classdocs advanced + \image gridview-highlight.png Delegates are instantiated as needed and may be destroyed at any time. State should \e never be stored in a delegate. - \bold Note that views do not enable \e clip automatically. If the view + \note Views do not enable \e clip automatically. If the view is not clipped by another item or the screen, it will be necessary to set \e {clip: true} in order to have the out of view items clipped nicely. @@ -971,19 +986,7 @@ QDeclarativeGridView::~QDeclarativeGridView() The example below ensures that the animation completes before the item is removed from the grid. - \code - Component { - id: myDelegate - Item { - id: wrapper - 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 } - } - } - } - \endcode + \snippet doc/src/snippets/declarative/gridview/gridview.qml delayRemove */ /*! @@ -1001,10 +1004,10 @@ QDeclarativeGridView::~QDeclarativeGridView() \qmlproperty model GridView::model This property holds the model providing data for the grid. - The model provides a set of data that is used to create the items - for the view. For large or dynamic datasets the model is usually - provided by a C++ model object. The C++ model object must be a \l - {QAbstractItemModel} subclass, a VisualModel, or a simple list. + The model provides the set of data that is used to create the items + in the view. Models can be created directly in QML using \l ListModel, \l XmlListModel + or \l VisualItemModel, or provided by C++ model classes. If a C++ model class is + used, it must be a subclass of \l QAbstractItemModel or a simple list. \sa {qmlmodels}{Data Models} */ @@ -1079,11 +1082,11 @@ void QDeclarativeGridView::setModel(const QVariant &model) that is not needed for the normal display of the delegate in a \l Loader which can load additional elements when needed. - Note that the GridView will layout the items based on the size of the root item + The GridView will layout the items based on the size of the root item in the delegate. - Here is an example delegate: - \snippet doc/src/snippets/declarative/gridview/gridview.qml 0 + \note Delegates are instantiated as needed and may be destroyed at any time. + State should \e never be stored in a delegate. */ QDeclarativeComponent *QDeclarativeGridView::delegate() const { @@ -1157,8 +1160,7 @@ QDeclarativeItem *QDeclarativeGridView::currentItem() /*! \qmlproperty Item GridView::highlightItem - \c highlightItem holds the highlight item, which was created - from the \l highlight component. + This holds the highlight item created from the \l highlight component. The highlightItem is managed by the view unless \l highlightFollowsCurrentItem is set to false. @@ -1189,13 +1191,10 @@ int QDeclarativeGridView::count() const \qmlproperty Component GridView::highlight This property holds the component to use as the highlight. - An instance of the highlight component will be created for each view. - The geometry of the resultant component instance will be managed by the view + An instance of the highlight component is created for each view. + The geometry of the resulting component instance will be managed by the view so as to stay with the current item, unless the highlightFollowsCurrentItem property is false. - The below example demonstrates how to make a simple highlight: - \snippet doc/src/snippets/declarative/gridview/gridview.qml 1 - \sa highlightItem, highlightFollowsCurrentItem */ QDeclarativeComponent *QDeclarativeGridView::highlight() const @@ -1218,21 +1217,14 @@ void QDeclarativeGridView::setHighlight(QDeclarativeComponent *highlight) \qmlproperty bool GridView::highlightFollowsCurrentItem This property sets whether the highlight is managed by the view. - If highlightFollowsCurrentItem is true, the highlight will be moved smoothly - to follow the current item. If highlightFollowsCurrentItem is false, the - highlight will not be moved by the view, and must be implemented - by the highlight component, for example: - - \code - Component { - id: myHighlight - Rectangle { - id: wrapper; color: "lightsteelblue"; radius: 4; width: 320; height: 60 - SpringFollow on y { source: wrapper.GridView.view.currentItem.y; spring: 3; damping: 0.2 } - SpringFollow on x { source: wrapper.GridView.view.currentItem.x; spring: 3; damping: 0.2 } - } - } - \endcode + If this property is true, the highlight is moved smoothly + to follow the current item. Otherwise, the + highlight is not moved by the view, and any movement must be implemented + by the highlight. + + Here is a highlight with its motion defined by a \l {SpringFollow} item: + + \snippet doc/src/snippets/declarative/gridview/gridview.qml highlightFollowsCurrentItem */ bool QDeclarativeGridView::highlightFollowsCurrentItem() const { @@ -1290,32 +1282,30 @@ void QDeclarativeGridView::setHighlightMoveDuration(int duration) \qmlproperty real GridView::preferredHighlightEnd \qmlproperty enumeration GridView::highlightRangeMode - These properties set the preferred range of the highlight (current item) - within the view. + These properties define the preferred range of the highlight (for the current item) + within the view. The \c preferredHighlightBegin value must be less than the + \c preferredHighlightEnd value. - Note that this is the correct way to influence where the - current item ends up when the view scrolls. For example, if you want the - currently selected item to be in the middle of the list, then set the - highlight range to be where the middle item would go. Then, when the view scrolls, - the currently selected item will be the item at that spot. This also applies to - when the currently selected item changes - it will scroll to within the preferred - highlight range. Furthermore, the behaviour of the current item index will occur - whether or not a highlight exists. + These properties affect the position of the current item when the view is scrolled. + For example, if the currently selected item should stay in the middle of the + view when it is scrolled, set the \c preferredHighlightBegin and + \c preferredHighlightEnd values to the top and bottom coordinates of where the middle + item would be. If the \c currentItem is changed programmatically, the view will + automatically scroll so that the current item is in the middle of the view. + Furthermore, the behavior of the current item index will occur whether or not a + highlight exists. - If highlightRangeMode is set to \e GridView.ApplyRange the view will - attempt to maintain the highlight within the range, however - the highlight can move outside of the range at the ends of the list - or due to a mouse interaction. + Valid values for \c highlightRangeMode are: - If highlightRangeMode is set to \e GridView.StrictlyEnforceRange the highlight will never - move outside of the range. This means that the current item will change - if a keyboard or mouse action would cause the highlight to move - outside of the range. - - The default value is \e GridView.NoHighlightRange. - - Note that a valid range requires preferredHighlightEnd to be greater - than or equal to preferredHighlightBegin. + \list + \o GridView.ApplyRange - the view attempts to maintain the highlight within the range. + However, the highlight can move outside of the range at the ends of the view or due + to mouse interaction. + \o GridView.StrictlyEnforceRange - the highlight never moves outside of the range. + The current item changes if a keyboard or mouse action would cause the highlight to move + outside of the range. + \o GridView.NoHighlightRange - this is the default value. + \endlist */ qreal QDeclarativeGridView::preferredHighlightBegin() const { @@ -1370,10 +1360,12 @@ void QDeclarativeGridView::setHighlightRangeMode(HighlightRangeMode mode) \qmlproperty enumeration GridView::flow This property holds the flow of the grid. - Possible values are \c GridView.LeftToRight (default) and \c GridView.TopToBottom. + Possible values: - If \a flow is \c GridView.LeftToRight, the view will scroll vertically. - If \a flow is \c GridView.TopToBottom, the view will scroll horizontally. + \list + \o GridView.LeftToRight (default) - Items are laid out from left to right, and the view scrolls vertically + \o GridView.TopToBottom - Items are laid out from top to bottom, and the view scrolls horizontally + \endlist */ QDeclarativeGridView::Flow QDeclarativeGridView::flow() const { @@ -1405,8 +1397,9 @@ void QDeclarativeGridView::setFlow(Flow flow) \qmlproperty bool GridView::keyNavigationWraps This property holds whether the grid wraps key navigation - If this property is true then key presses to move off of one end of the grid will cause the - selection to jump to the other side. + If this is true, key navigation that would move the current item selection + past one end of the view instead wraps around and moves the selection to + the other end of the view. */ bool QDeclarativeGridView::isWrapEnabled() const { @@ -1463,7 +1456,7 @@ void QDeclarativeGridView::setCacheBuffer(int buffer) \qmlproperty int GridView::cellWidth \qmlproperty int GridView::cellHeight - These properties holds the width and height of each cell in the grid + These properties holds the width and height of each cell in the grid. The default cell size is 100x100. */ @@ -1503,14 +1496,14 @@ void QDeclarativeGridView::setCellHeight(int cellHeight) /*! \qmlproperty enumeration GridView::snapMode - This property determines where the view will settle following a drag or flick. - The allowed values are: + This property determines how the view scrolling will settle following a drag or flick. + The possible values are: \list - \o GridView.NoSnap (default) - the view will stop anywhere within the visible area. - \o GridView.SnapToRow - the view will settle with a row (or column for TopToBottom flow) + \o GridView.NoSnap (default) - the view stops anywhere within the visible area. + \o GridView.SnapToRow - the view settles with a row (or column for \c GridView.TopToBottom flow) aligned with the start of the view. - \o GridView.SnapOneRow - the view will settle no more than one row (or column for TopToBottom flow) + \o GridView.SnapOneRow - the view will settle no more than one row (or column for \c GridView.TopToBottom flow) away from the first visible row at the time the mouse button is released. This mode is particularly useful for moving one page at a time. \endlist @@ -1789,22 +1782,22 @@ void QDeclarativeGridView::moveCurrentIndexRight() \a mode: \list - \o Beginning - position item at the top (or left for TopToBottom flow) of the view. - \o Center- position item in the center of the view. - \o End - position item at bottom (or right for horizontal orientation) of the view. - \o Visible - if any part of the item is visible then take no action, otherwise + \o GridView.Beginning - position item at the top (or left for \c GridView.TopToBottom flow) of the view. + \o GridView.Center - position item in the center of the view. + \o GridView.End - position item at bottom (or right for horizontal orientation) of the view. + \o GridView.Visible - if any part of the item is visible then take no action, otherwise bring the item into view. - \o Contain - ensure the entire item is visible. If the item is larger than - the view the item is positioned at the top (or left for TopToBottom flow) of the view. + \o GridView.Contain - ensure the entire item is visible. If the item is larger than + the view the item is positioned at the top (or left for \c GridView.TopToBottom flow) of the view. \endlist If positioning the view at the index would cause empty space to be displayed at the beginning or end of the view, the view will be positioned at the boundary. - It is not recommended to use contentX or contentY to position the view + It is not recommended to use \l {Flickable::}{contentX} or \l {Flickable::}{contentY} to position the view at a particular index. This is unreliable since removing items from the start of the view does not cause all other items to be repositioned. - The correct way to bring an item into view is with positionViewAtIndex. + The correct way to bring an item into view is with \c positionViewAtIndex. */ void QDeclarativeGridView::positionViewAtIndex(int index, int mode) { diff --git a/src/declarative/graphicsitems/qdeclarativeimage.cpp b/src/declarative/graphicsitems/qdeclarativeimage.cpp index 4593cf8..94240c2 100644 --- a/src/declarative/graphicsitems/qdeclarativeimage.cpp +++ b/src/declarative/graphicsitems/qdeclarativeimage.cpp @@ -275,11 +275,6 @@ qreal QDeclarativeImage::paintedHeight() const \o Image.Error - an error occurred while loading the image \endlist - Note that a change in the status property does not cause anything to happen - (although it reflects what has happened with the image internally). If you wish - to react to the change in status you need to do it yourself, for example in one - of the following ways: - Use this status to provide an update or respond to the status change in some way. For example, you could: diff --git a/src/declarative/graphicsitems/qdeclarativeitem.cpp b/src/declarative/graphicsitems/qdeclarativeitem.cpp index 134bd6d..9949e65 100644 --- a/src/declarative/graphicsitems/qdeclarativeitem.cpp +++ b/src/declarative/graphicsitems/qdeclarativeitem.cpp @@ -97,9 +97,11 @@ QT_BEGIN_NAMESPACE The Translate object provides independent control over position in addition to the Item's x and y properties. - The following example moves the Y axis of the Rectangles while still allowing the Row element + The following example moves the Y axis of the \l Rectangle elements while still allowing the \l Row element to lay the items out as if they had not been transformed: \qml + import Qt 4.7 + Row { Rectangle { width: 100; height: 100 @@ -113,6 +115,8 @@ QT_BEGIN_NAMESPACE } } \endqml + + \image translate.png */ /*! diff --git a/src/declarative/graphicsitems/qdeclarativelayoutitem.cpp b/src/declarative/graphicsitems/qdeclarativelayoutitem.cpp index 4add66d..38d5f59 100644 --- a/src/declarative/graphicsitems/qdeclarativelayoutitem.cpp +++ b/src/declarative/graphicsitems/qdeclarativelayoutitem.cpp @@ -58,7 +58,10 @@ QT_BEGIN_NAMESPACE taking its size hints into account, and you can propagate this to the other elements in your UI via anchors and bindings. This is a QGraphicsLayoutItem subclass, and its properties merely expose the QGraphicsLayoutItem functionality to QML. - See the QGraphicsLayoutItem documentation for further details. + + The \l{declarative/cppextensions/qgraphicslayouts/layoutitem}{LayoutItem example} + demonstrates how a LayoutItem can be used within a \l{Graphics View Framework}{Graphics View} + scene. */ /*! diff --git a/src/declarative/graphicsitems/qdeclarativelistview.cpp b/src/declarative/graphicsitems/qdeclarativelistview.cpp index 01928a1..023d663 100644 --- a/src/declarative/graphicsitems/qdeclarativelistview.cpp +++ b/src/declarative/graphicsitems/qdeclarativelistview.cpp @@ -1325,13 +1325,11 @@ void QDeclarativeListViewPrivate::flick(AxisData &data, qreal minExtent, qreal m Another component can display this model data in a ListView, like this: - \table - \row - \o \snippet doc/src/snippets/declarative/listview/listview.qml import + \snippet doc/src/snippets/declarative/listview/listview.qml import \codeline \snippet doc/src/snippets/declarative/listview/listview.qml classdocs simple - \o \image listview-simple.png - \endtable + + \image listview-simple.png Here, the ListView creates a \c ContactModel component for its model, and a \l Text element for its delegate. The view will create a new \l Text component for each item in the model. Notice @@ -1342,13 +1340,10 @@ void QDeclarativeListViewPrivate::flick(AxisData &data, qreal minExtent, qreal m with a blue \l Rectangle using the \l highlight property, and \c focus is set to \c true to enable keyboard navigation for the list view. - \table - \row - \o \snippet doc/src/snippets/declarative/listview/listview.qml classdocs advanced - \o \image listview-highlight.png - \endtable + \snippet doc/src/snippets/declarative/listview/listview.qml classdocs advanced + \image listview-highlight.png - In a ListView, delegates are instantiated as needed and may be destroyed at any time. + In a GridView, delegates are instantiated as needed and may be destroyed at any time. State should \e never be stored in a delegate. \note Views do not enable \e clip automatically. If the view @@ -1634,7 +1629,7 @@ int QDeclarativeListView::count() const This property holds the component to use as the highlight. An instance of the highlight component is created for each list. - The geometry of the resultant component instance is managed by the list + The geometry of the resulting component instance is managed by the list so as to stay with the current item, unless the highlightFollowsCurrentItem property is false. @@ -1667,7 +1662,7 @@ void QDeclarativeListView::setHighlight(QDeclarativeComponent *highlight) highlight is not moved by the view, and any movement must be implemented by the highlight. - Here is a highlight with its motion defined by the a \l {SpringFollow} item: + Here is a highlight with its motion defined by a \l {SpringFollow} item: \snippet doc/src/snippets/declarative/listview/listview.qml highlightFollowsCurrentItem @@ -2042,8 +2037,8 @@ void QDeclarativeListView::setHighlightResizeDuration(int duration) /*! \qmlproperty enumeration ListView::snapMode - This property determines where the view's scrolling behavior stops following a drag or flick. - The allowed values are: + This property determines how the view scrolling will settle following a drag or flick. + The possible values are: \list \o ListView.NoSnap (default) - the view stops anywhere within the visible area. diff --git a/src/declarative/graphicsitems/qdeclarativeloader.cpp b/src/declarative/graphicsitems/qdeclarativeloader.cpp index 4995baf..898c5a5 100644 --- a/src/declarative/graphicsitems/qdeclarativeloader.cpp +++ b/src/declarative/graphicsitems/qdeclarativeloader.cpp @@ -115,27 +115,37 @@ void QDeclarativeLoaderPrivate::initResize() subtree from a QML URL or Component. Loader instantiates an item from a component. The component to - instantiate may be specified directly by the \c sourceComponent - property, or loaded from a URL via the \c source property. + instantiate may be specified directly by the \l sourceComponent + property, or loaded from a URL via the \l source property. It is also an effective means of delaying the creation of a component until it is required: \code + import Qt 4.7 + Loader { id: pageLoader } + Rectangle { - MouseArea { anchors.fill: parent; onClicked: pageLoader.source = "Page1.qml" } + MouseArea { + anchors.fill: parent + onClicked: pageLoader.source = "Page1.qml" + } } \endcode If the Loader source is changed, any previous items instantiated - will be destroyed. Setting \c source to an empty string, or setting + will be destroyed. Setting \l source to an empty string, or setting sourceComponent to \e undefined will destroy the currently instantiated items, freeing resources and leaving the Loader empty. For example: \code pageLoader.source = "" + \endcode + or + + \code pageLoader.sourceComponent = undefined \endcode @@ -340,19 +350,31 @@ void QDeclarativeLoaderPrivate::_q_sourceLoaded() \o Loader.Error - an error occurred while loading the QML source \endlist - Note that a change in the status property does not cause anything to happen - (although it reflects what has happened to the loader internally). If you wish - to react to the change in status you need to do it yourself, for example in one - of the following ways: - \list - \o Create a state, so that a state change occurs, e.g. State{name: 'loaded'; when: loader.status = Loader.Ready;} - \o Do something inside the onLoaded signal handler, e.g. Loader{id: loader; onLoaded: console.log('Loaded');} - \o Bind to the status variable somewhere, e.g. Text{text: if(loader.status!=Loader.Ready){'Not Loaded';}else{'Loaded';}} - \endlist - \sa progress + Use this status to provide an update or respond to the status change in some way. + For example, you could: + + \e {Trigger a state change:} + \qml + State { name: 'loaded'; when: loader.status = Loader.Ready } + \endqml + + \e {Implement an \c onStatusChanged signal handler:} + \qml + Loader { + id: loader + onStatusChanged: if (loader.status == Loader.Ready) console.log('Loaded') + } + \endqml + + \e {Bind to the status value:} + \qml + Text { text: loader.status != Loader.Ready ? 'Not Loaded' : 'Loaded' } + \endqml Note that if the source is a local file, the status will initially be Ready (or Error). While there will be no onStatusChanged signal in that case, the onLoaded will still be invoked. + + \sa progress */ QDeclarativeLoader::Status QDeclarativeLoader::status() const diff --git a/src/declarative/graphicsitems/qdeclarativemousearea.cpp b/src/declarative/graphicsitems/qdeclarativemousearea.cpp index 1947c00..6fca283 100644 --- a/src/declarative/graphicsitems/qdeclarativemousearea.cpp +++ b/src/declarative/graphicsitems/qdeclarativemousearea.cpp @@ -172,17 +172,21 @@ QDeclarativeMouseAreaPrivate::~QDeclarativeMouseAreaPrivate() A MouseArea is typically used in conjunction with a visible item, where the MouseArea effectively 'proxies' mouse handling for that - item. For example, we can put a MouseArea in a Rectangle that changes - the Rectangle color to red when clicked: - \snippet doc/src/snippets/declarative/mouseregion.qml 0 + item. For example, we can put a MouseArea in a \l Rectangle that changes + the \l Rectangle color to red when clicked: + + \snippet doc/src/snippets/declarative/mousearea.qml import + \codeline + \snippet doc/src/snippets/declarative/mousearea.qml intro Many MouseArea signals pass a \l {MouseEvent}{mouse} parameter that contains additional information about the mouse event, such as the position, button, and any key modifiers. - Below we have the previous - example extended so as to give a different color when you right click. - \snippet doc/src/snippets/declarative/mouseregion.qml 1 + Here is an extension of the previous example that produces a different + color when the area is right clicked: + + \snippet doc/src/snippets/declarative/mousearea.qml intro-extended For basic key handling, see the \l {Keys}{Keys attached property}. @@ -238,7 +242,7 @@ QDeclarativeMouseAreaPrivate::~QDeclarativeMouseAreaPrivate() releasing is also considered a click). The \l {MouseEvent}{mouse} parameter provides information about the click, including the x and y - position of the release of the click, and whether the click wasHeld. + position of the release of the click, and whether the click was held. The \e accepted property of the MouseEvent parameter is ignored in this handler. */ @@ -262,7 +266,7 @@ QDeclarativeMouseAreaPrivate::~QDeclarativeMouseAreaPrivate() This handler is called when there is a release. The \l {MouseEvent}{mouse} parameter provides information about the click, including the x and y - position of the release of the click, and whether the click wasHeld. + position of the release of the click, and whether the click was held. The \e accepted property of the MouseEvent parameter is ignored in this handler. */ @@ -282,7 +286,7 @@ QDeclarativeMouseAreaPrivate::~QDeclarativeMouseAreaPrivate() This handler is called when there is a double-click (a press followed by a release followed by a press). The \l {MouseEvent}{mouse} parameter provides information about the click, including the x and y - position of the release of the click, and whether the click wasHeld. + position of the release of the click, and whether the click was held. The \e accepted property of the MouseEvent parameter is ignored in this handler. */ @@ -328,10 +332,10 @@ QDeclarativeMouseArea::~QDeclarativeMouseArea() while a button is pressed, and will remain valid as long as the button is held even if the mouse is moved outside the area. - If hoverEnabled is true then these properties will be valid: + If hoverEnabled is true then these properties will be valid when: \list - \i when no button is pressed, but the mouse is within the MouseArea (containsMouse is true). - \i if a button is pressed and held, even if it has since moved out of the area. + \i no button is pressed, but the mouse is within the MouseArea (containsMouse is true). + \i a button is pressed and held, even if it has since moved out of the area. \endlist The coordinates are relative to the MouseArea. @@ -378,18 +382,7 @@ void QDeclarativeMouseArea::setEnabled(bool a) \endlist The code below displays "right" when the right mouse buttons is pressed: - \code - Text { - text: mr.pressedButtons & Qt.RightButton ? "right" : "" - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - MouseArea { - id: mr - acceptedButtons: Qt.LeftButton | Qt.RightButton - anchors.fill: parent - } - } - \endcode + \snippet doc/src/snippets/declarative/mousearea.qml mousebuttons \sa acceptedButtons */ @@ -705,7 +698,7 @@ void QDeclarativeMouseArea::setHovered(bool h) MouseArea { acceptedButtons: Qt.LeftButton | Qt.RightButton } \endcode - The default is to accept the Left button. + The default value is \c Qt.LeftButton. */ Qt::MouseButtons QDeclarativeMouseArea::acceptedButtons() const { @@ -765,17 +758,19 @@ QDeclarativeDrag *QDeclarativeMouseArea::drag() \qmlproperty real MouseArea::drag.minimumY \qmlproperty real MouseArea::drag.maximumY - drag provides a convenient way to make an item draggable. + \c drag provides a convenient way to make an item draggable. \list - \i \c target specifies the item to drag. - \i \c active specifies if the target item is being currently dragged. - \i \c axis specifies whether dragging can be done horizontally (Drag.XAxis), vertically (Drag.YAxis), or both (Drag.XandYAxis) - \i the minimum and maximum properties limit how far the target can be dragged along the corresponding axes. + \i \c drag.target specifies the item to drag. + \i \c drag.active specifies if the target item is currently being dragged. + \i \c drag.axis specifies whether dragging can be done horizontally (\c Drag.XAxis), vertically (\c Drag.YAxis), or both (\c Drag.XandYAxis) + \i \c drag.minimum and \c drag.maximum limit how far the target can be dragged along the corresponding axes. \endlist - The following example uses drag to reduce the opacity of an image as it moves to the right: - \snippet doc/src/snippets/declarative/drag.qml 0 + The following example displays an image that can be dragged along the X-axis. The opacity + of the image is reduced when it is dragged to the right. + + \snippet doc/src/snippets/declarative/mousearea.qml drag */ QT_END_NAMESPACE diff --git a/src/declarative/graphicsitems/qdeclarativepath.cpp b/src/declarative/graphicsitems/qdeclarativepath.cpp index 141a938..a904869 100644 --- a/src/declarative/graphicsitems/qdeclarativepath.cpp +++ b/src/declarative/graphicsitems/qdeclarativepath.cpp @@ -628,7 +628,7 @@ void QDeclarativePathLine::addToPath(QPainterPath &path) \qml Path { startX: 0; startY: 0 - PathQuad x: 200; y: 0; controlX: 100; controlY: 150 } + PathQuad { x: 200; y: 0; controlX: 100; controlY: 150 } } \endqml \endtable @@ -713,8 +713,9 @@ void QDeclarativePathQuad::addToPath(QPainterPath &path) Path { startX: 20; startY: 0 PathCubic { - x: 180; y: 0; control1X: -10; control1Y: 90 - control2X: 210; control2Y: 90 + x: 180; y: 0 + control1X: -10; control1Y: 90 + control2X: 210; control2Y: 90 } } \endqml diff --git a/src/declarative/graphicsitems/qdeclarativepathview.cpp b/src/declarative/graphicsitems/qdeclarativepathview.cpp index 448ec06..695af7e 100644 --- a/src/declarative/graphicsitems/qdeclarativepathview.cpp +++ b/src/declarative/graphicsitems/qdeclarativepathview.cpp @@ -310,11 +310,21 @@ void QDeclarativePathViewPrivate::regenerate() \brief The PathView element lays out model-provided items on a path. \inherits Item - The model is typically provided by a QAbstractListModel "C++ model object", but can also be created directly in QML. + A PathView displays data from models created from built-in QML elements like ListModel + and XmlListModel, or custom model classes defined in C++ that inherit from + QAbstractListModel. + A ListView has a \l model, which defines the data to be displayed, and + a \l delegate, which defines how the data should be displayed. The \l delegate is instantiated for each item on the \l path. The items may be flicked to move them along the path. + For example, if there is a simple list model defined in a file \c ContactModel.qml like this: + + \snippet doc/src/snippets/declarative/pathview/ContactModel.qml 0 + + This data can be represented as a PathView, like this: + \snippet doc/src/snippets/declarative/pathview/pathview.qml 0 \image pathview.gif diff --git a/src/declarative/graphicsitems/qdeclarativepositioners.cpp b/src/declarative/graphicsitems/qdeclarativepositioners.cpp index 8796e63..20cc46b 100644 --- a/src/declarative/graphicsitems/qdeclarativepositioners.cpp +++ b/src/declarative/graphicsitems/qdeclarativepositioners.cpp @@ -302,7 +302,7 @@ void QDeclarativeBasePositioner::finishApplyTransitions() /*! \qmlclass Column QDeclarativeColumn \since 4.7 - \brief The Column item lines up its children vertically. + \brief The Column item arranges its children vertically. \inherits Item The Column item positions its child items so that they are vertically @@ -346,7 +346,8 @@ Column { will not change. If you manually change the x or y properties in script, bind the x or y properties, use anchors on a child of a positioner, or have the height of a child depend on the position of a child, then the - positioner may exhibit strange behaviour. + positioner may exhibit strange behaviour. If you need to perform any of these + actions, consider positioning the items without the use of a Column. */ /*! @@ -396,7 +397,7 @@ Column { spacing is the amount in pixels left empty between each adjacent item, and defaults to 0. - The below example places a Grid containing a red, a blue and a + The below example places a \l Grid containing a red, a blue and a green rectangle on a gray background. The area the grid positioner occupies is colored white. The top positioner has the default of no spacing, and the bottom positioner has its spacing set to 2. @@ -468,17 +469,15 @@ void QDeclarativeColumn::reportConflictingAnchors() /*! \qmlclass Row QDeclarativeRow \since 4.7 - \brief The Row item lines up its children horizontally. + \brief The Row item arranges its children horizontally. \inherits Item The Row item positions its child items so that they are - horizontally aligned and not overlapping. Spacing can be added between the - items, and a margin around all items can also be added. It also provides for - transitions to be set when items are added, moved, or removed in the - positioner. Adding and removing apply both to items which are deleted or have - their position in the document changed so as to no longer be children of the - positioner, as well as to items which have their opacity set to or from zero - so as to appear or disappear. + horizontally aligned and not overlapping. + + Use \l spacing to set the spacing between items in a Row, and use the + \l add and \l move properties to set the transitions that should be applied + when items are added to, removed from, or re-positioned within the Row. The below example lays out differently shaped rectangles using a Row. \qml @@ -495,8 +494,8 @@ Row { will not change. If you manually change the x or y properties in script, bind the x or y properties, use anchors on a child of a positioner, or have the width of a child depend on the position of a child, then the - positioner may exhibit strange behaviour. - + positioner may exhibit strange behaviour. If you need to perform any of these + actions, consider positioning the items without the use of a Row. */ /*! \qmlproperty Transition Row::add @@ -504,12 +503,10 @@ Row { The transition will only be applied to the added item(s). Positioner transitions will only affect the position (x,y) of items. - Added can mean that either the object has been created or - reparented, and thus is now a child or the positioner, or that the + An object is considered to be added to the positioner if it has been + created or reparented and thus is now a child or the positioner, or if the object has had its opacity increased from zero, and thus is now visible. - - */ /*! \qmlproperty Transition Row::move @@ -540,7 +537,7 @@ Row { spacing is the amount in pixels left empty between each adjacent item, and defaults to 0. - The below example places a Grid containing a red, a blue and a + The below example places a \l Grid containing a red, a blue and a green rectangle on a gray background. The area the grid positioner occupies is colored white. The top positioner has the default of no spacing, and the bottom positioner has its spacing set to 2. @@ -610,18 +607,20 @@ void QDeclarativeRow::reportConflictingAnchors() \inherits Item The Grid item positions its child items so that they are - aligned in a grid and are not overlapping. Spacing can be added - between the items. It also provides for transitions to be set when items are + aligned in a grid and are not overlapping. + + Spacing can be added + between child items. It also provides for transitions to be set when items are added, moved, or removed in the positioner. Adding and removing apply both to items which are deleted or have their position in the document changed so as to no longer be children of the positioner, as well as to items which have their opacity set to or from zero so as to appear or disappear. - The Grid defaults to using four columns, and as many rows as - are necessary to fit all the child items. The number of rows - and/or the number of columns can be constrained by setting the rows - or columns properties. The grid positioner calculates a grid with + A Grid defaults to four columns, and as many rows as + are necessary to fit all child items. The number of rows + and/or the number of columns can be constrained by setting the \l rows + or \l columns properties. The grid positioner calculates a grid with rectangular cells of sufficient size to hold all items, and then places the items in the cells, going across then down, and positioning each item at the (0,0) corner of the cell. The below @@ -648,7 +647,8 @@ Grid { will not change. If you manually change the x or y properties in script, bind the x or y properties, use anchors on a child of a positioner, or have the width or height of a child depend on the position of a child, then the - positioner may exhibit strange behaviour. + positioner may exhibit strange behaviour. If you need to perform any of these + actions, consider positioning the items without the use of a Grid. */ /*! \qmlproperty Transition Grid::add @@ -658,12 +658,10 @@ Grid { as that is all the positioners affect. To animate other property change you will have to do so based on how you have changed those properties. - Added can mean that either the object has been created or - reparented, and thus is now a child or the positioner, or that the + An object is considered to be added to the positioner if it has been + created or reparented and thus is now a child or the positioner, or if the object has had its opacity increased from zero, and thus is now visible. - - */ /*! \qmlproperty Transition Grid::move @@ -714,18 +712,16 @@ QDeclarativeGrid::QDeclarativeGrid(QDeclarativeItem *parent) : \qmlproperty int Grid::columns This property holds the number of columns in the grid. - When the columns property is set the Grid will always have - that many columns. Note that if you do not have enough items to - fill this many columns some columns will be of zero width. + If the grid does not have enough items to fill the specified + number of columns, some columns will be of zero width. */ /*! \qmlproperty int Grid::rows This property holds the number of rows in the grid. - When the rows property is set the Grid will always have that - many rows. Note that if you do not have enough items to fill this - many rows some rows will be of zero width. + If the grid does not have enough items to fill the specified + number of rows, some rows will be of zero width. */ void QDeclarativeGrid::setColumns(const int columns) @@ -750,12 +746,14 @@ void QDeclarativeGrid::setRows(const int rows) \qmlproperty enumeration Grid::flow This property holds the flow of the layout. - Possible values are \c Grid.LeftToRight (default) and \c Grid.TopToBottom. + Possible values are: - If \a flow is \c Grid.LeftToRight, the items are positioned next to - to each other from left to right, then wrapped to the next line. - If \a flow is \c Grid.TopToBottom, the items are positioned next to each - other from top to bottom, then wrapped to the next column. + \list + \o Grid.LeftToRight (default) - Items are positioned next to + to each other from left to right, then wrapped to the next line. + \o Grid.TopToBottom - Items are positioned next to each + other from top to bottom, then wrapped to the next column. + \endlist */ QDeclarativeGrid::Flow QDeclarativeGrid::flow() const { @@ -893,14 +891,18 @@ void QDeclarativeGrid::reportConflictingAnchors() /*! \qmlclass Flow QDeclarativeFlow \since 4.7 - \brief The Flow item lines up its children side by side, wrapping as necessary. + \brief The Flow item arranges its children side by side, wrapping as necessary. \inherits Item + The Flow item positions its child items so that they are side by side and are + not overlapping. + Note that the positioner assumes that the x and y positions of its children will not change. If you manually change the x or y properties in script, bind the x or y properties, use anchors on a child of a positioner, or have the width or height of a child depend on the position of a child, then the - positioner may exhibit strange behaviour. + positioner may exhibit strange behaviour. If you need to perform any of these + actions, consider positioning the items without the use of a Flow. */ /*! @@ -909,9 +911,10 @@ void QDeclarativeGrid::reportConflictingAnchors() The transition will only be applied to the added item(s). Positioner transitions will only affect the position (x,y) of items. - Added can mean that either the object has been created or reparented, and thus is now a child or the positioner, or that the object has had its opacity increased from zero, and thus is now visible. - - + An object is considered to be added to the positioner if it has been + created or reparented and thus is now a child or the positioner, or if the + object has had its opacity increased from zero, and thus is now + visible. */ /*! \qmlproperty Transition Flow::move @@ -965,14 +968,16 @@ QDeclarativeFlow::QDeclarativeFlow(QDeclarativeItem *parent) \qmlproperty enumeration Flow::flow This property holds the flow of the layout. - Possible values are \c Flow.LeftToRight (default) and \c Flow.TopToBottom. + Possible values are: - If \a flow is \c Flow.LeftToRight, the items are positioned next to + \list + \o Flow.LeftToRight (default) - Items are positioned next to to each other from left to right until the width of the Flow is exceeded, then wrapped to the next line. - If \a flow is \c Flow.TopToBottom, the items are positioned next to each + \o Flow.TopToBottom - Items are positioned next to each other from top to bottom until the height of the Flow is exceeded, then wrapped to the next column. + \endlist */ QDeclarativeFlow::Flow QDeclarativeFlow::flow() const { diff --git a/src/declarative/graphicsitems/qdeclarativerectangle.cpp b/src/declarative/graphicsitems/qdeclarativerectangle.cpp index de3dbcd..2756877 100644 --- a/src/declarative/graphicsitems/qdeclarativerectangle.cpp +++ b/src/declarative/graphicsitems/qdeclarativerectangle.cpp @@ -160,6 +160,8 @@ void QDeclarativeGradient::doUpdate() You can also create rounded rectangles using the \l radius property. \qml + import Qt 4.7 + Rectangle { width: 100 height: 100 @@ -206,7 +208,7 @@ void QDeclarativeRectangle::doUpdate() border smoothness. Also, the border is rendered evenly on either side of the rectangle's boundaries, and the spare pixel is rendered to the right and below the rectangle (as documented for QRect rendering). This can cause unintended effects if - \c border.width is 1 and the rectangle is \l{clip}{clipped} by a parent item: + \c border.width is 1 and the rectangle is \l{Item::clip}{clipped} by a parent item: \table \row diff --git a/src/declarative/graphicsitems/qdeclarativetext.cpp b/src/declarative/graphicsitems/qdeclarativetext.cpp index 55cef8b..a6bf5d4 100644 --- a/src/declarative/graphicsitems/qdeclarativetext.cpp +++ b/src/declarative/graphicsitems/qdeclarativetext.cpp @@ -119,6 +119,8 @@ QSet<QUrl> QTextDocumentWithImageResources::errors; A Text item can display both plain and rich text. For example: \qml + import Qt 4.7 + Text { text: "Hello World!"; font.family: "Helvetica"; font.pointSize: 24; color: "red" } Text { text: "<b>Hello</b> <i>World!</i>" } \endqml diff --git a/src/declarative/graphicsitems/qdeclarativevisualitemmodel.cpp b/src/declarative/graphicsitems/qdeclarativevisualitemmodel.cpp index c6ee46f..2a88a80 100644 --- a/src/declarative/graphicsitems/qdeclarativevisualitemmodel.cpp +++ b/src/declarative/graphicsitems/qdeclarativevisualitemmodel.cpp @@ -119,11 +119,11 @@ public: visual delegate (items). An item can determine its index within the - model via the VisualItemModel.index attached property. + model via the \c VisualItemModel.index attached property. The example below places three colored rectangles in a ListView. \code - Item { + Rectangle { VisualItemModel { id: itemModel Rectangle { height: 30; width: 80; color: "red" } @@ -137,6 +137,8 @@ public: } } \endcode + + \image visualitemmodel.png */ QDeclarativeVisualItemModel::QDeclarativeVisualItemModel(QObject *parent) : QDeclarativeVisualModel(*(new QDeclarativeVisualItemModelPrivate), parent) diff --git a/src/declarative/qml/qdeclarativeworkerscript.cpp b/src/declarative/qml/qdeclarativeworkerscript.cpp index 2ca030e..e0ee84f 100644 --- a/src/declarative/qml/qdeclarativeworkerscript.cpp +++ b/src/declarative/qml/qdeclarativeworkerscript.cpp @@ -521,7 +521,7 @@ void QDeclarativeWorkerScriptEngine::run() that the main GUI thread is not blocked. Messages can be passed between the new thread and the parent thread - using sendMessage() and the onMessage() handler. + using \l sendMessage() and the \l {WorkerScript::onMessage}{onMessage()} handler. Here is an example: @@ -555,7 +555,7 @@ QDeclarativeWorkerScript::~QDeclarativeWorkerScript() /*! \qmlproperty url WorkerScript::source - This holds the url of the javascript file that implements the + This holds the url of the JavaScript file that implements the \tt WorkerScript.onMessage() handler for threaded operations. */ QUrl QDeclarativeWorkerScript::source() const @@ -576,7 +576,7 @@ void QDeclarativeWorkerScript::setSource(const QUrl &source) emit sourceChanged(); } -/* +/*! \qmlmethod WorkerScript::sendMessage(jsobject message) Sends the given \a message to a worker script handler in another diff --git a/src/declarative/util/qdeclarativeanimation.cpp b/src/declarative/util/qdeclarativeanimation.cpp index de1c0cb..0eae136 100644 --- a/src/declarative/util/qdeclarativeanimation.cpp +++ b/src/declarative/util/qdeclarativeanimation.cpp @@ -557,6 +557,8 @@ void QDeclarativeAbstractAnimation::timelineComplete() NumberAnimation { ... duration: 200 } } \endcode + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! \internal @@ -627,6 +629,8 @@ QAbstractAnimation *QDeclarativePauseAnimation::qtAnimation() When used in a transition, ColorAnimation will by default animate all properties of type color that are changing. If a property or properties are explicitly set for the animation, then those will be used instead. + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! \internal @@ -1082,11 +1086,13 @@ void QDeclarativePropertyAction::transition(QDeclarativeStateActions &actions, \inherits PropertyAnimation \brief The NumberAnimation element allows you to animate changes in properties of type qreal. - Animate a set of properties over 200ms, from their values in the start state to + For example, to animate a set of properties over 200ms, from their values in the start state to their values in the end state of the transition: \code NumberAnimation { properties: "x,y,scale"; duration: 200 } \endcode + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! @@ -1156,6 +1162,8 @@ void QDeclarativeNumberAnimation::setTo(qreal t) \since 4.7 \inherits PropertyAnimation \brief The Vector3dAnimation element allows you to animate changes in properties of type QVector3d. + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! @@ -1224,7 +1232,8 @@ void QDeclarativeVector3dAnimation::setTo(QVector3D t) When used in a transition RotationAnimation will rotate all properties named "rotation" or "angle". You can override this by providing - your own properties via \c properties or \c property. + your own properties via \l {PropertyAnimation::properties}{properties} or + \l {PropertyAnimation::property}{property}. In the following example we use RotationAnimation to animate the rotation between states via the shortest path. @@ -1238,6 +1247,8 @@ void QDeclarativeVector3dAnimation::setTo(QVector3D t) RotationAnimation { direction: RotationAnimation.Shortest } } \endqml + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! @@ -1446,7 +1457,7 @@ QDeclarativeListProperty<QDeclarativeAbstractAnimation> QDeclarativeAnimationGro } \endcode - \sa ParallelAnimation + \sa ParallelAnimation, {QML Animation}, {declarative/animation/basics}{Animation basics example} */ QDeclarativeSequentialAnimation::QDeclarativeSequentialAnimation(QObject *parent) : @@ -1508,7 +1519,7 @@ void QDeclarativeSequentialAnimation::transition(QDeclarativeStateActions &actio } \endcode - \sa SequentialAnimation + \sa SequentialAnimation, {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! \internal @@ -1657,6 +1668,8 @@ void QDeclarativePropertyAnimationPrivate::convertVariant(QVariant &variant, int Depending on how the animation is used, the set of properties normally used will be different. For more information see the individual property documentation, as well as the \l{QML Animation} introduction. + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ QDeclarativePropertyAnimation::QDeclarativePropertyAnimation(QObject *parent) @@ -2319,6 +2332,8 @@ void QDeclarativePropertyAnimation::transition(QDeclarativeStateActions &actions When used in a transition, ParentAnimation will by default animate all ParentChanges. + + \sa {QML Animation}, {declarative/animation/basics}{Animation basics example} */ /*! diff --git a/src/declarative/util/qdeclarativefontloader.cpp b/src/declarative/util/qdeclarativefontloader.cpp index c73f827..3c2e239 100644 --- a/src/declarative/util/qdeclarativefontloader.cpp +++ b/src/declarative/util/qdeclarativefontloader.cpp @@ -83,6 +83,8 @@ public: Example: \qml + import Qt 4.7 + FontLoader { id: fixedFont; name: "Courier" } FontLoader { id: webFont; source: "http://www.mysite.com/myfont.ttf" } @@ -183,15 +185,26 @@ void QDeclarativeFontLoader::setName(const QString &name) \o FontLoader.Error - an error occurred while loading the font \endlist - Note that a change in the status property does not cause anything to happen - (although it reflects what has happened to the font loader internally). If you wish - to react to the change in status you need to do it yourself, for example in one - of the following ways: - \list - \o Create a state, so that a state change occurs, e.g. State{name: 'loaded'; when: loader.status = FontLoader.Ready;} - \o Do something inside the onStatusChanged signal handler, e.g. FontLoader{id: loader; onStatusChanged: if(loader.status == FontLoader.Ready) console.log('Loaded');} - \o Bind to the status variable somewhere, e.g. Text{text: if(loader.status!=FontLoader.Ready){'Not Loaded';}else{'Loaded';}} - \endlist + Use this status to provide an update or respond to the status change in some way. + For example, you could: + + \e {Trigger a state change:} + \qml + State { name: 'loaded'; when: loader.status = FontLoader.Ready } + \endqml + + \e {Implement an \c onStatusChanged signal handler:} + \qml + FontLoader { + id: loader + onStatusChanged: if (loader.status == FontLoader.Ready) console.log('Loaded') + } + \endqml + + \e {Bind to the status value:} + \qml + Text { text: loader.status != FontLoader.Ready ? 'Not Loaded' : 'Loaded' } + \endqml */ QDeclarativeFontLoader::Status QDeclarativeFontLoader::status() const { diff --git a/src/declarative/util/qdeclarativepropertychanges.cpp b/src/declarative/util/qdeclarativepropertychanges.cpp index 08f4750..e98afeb 100644 --- a/src/declarative/util/qdeclarativepropertychanges.cpp +++ b/src/declarative/util/qdeclarativepropertychanges.cpp @@ -66,7 +66,7 @@ QT_BEGIN_NAMESPACE PropertyChanges provides a state change that modifies the properties of an item. - Here is a property change that modifies the text and color of a Text element + Here is a property change that modifies the text and color of a \l Text element when it is clicked: \qml diff --git a/src/declarative/util/qdeclarativesmoothedanimation.cpp b/src/declarative/util/qdeclarativesmoothedanimation.cpp index bd48ef0..6b6df4d 100644 --- a/src/declarative/util/qdeclarativesmoothedanimation.cpp +++ b/src/declarative/util/qdeclarativesmoothedanimation.cpp @@ -307,7 +307,7 @@ Rectangle { set to a value such as 0.5 units/second. Animating from 0 to 1.0 with a velocity of 0.5 will take 2000 ms to complete. - \sa SpringFollow + \sa SpringFollow, {QML Animation}, {declarative/animation/basics}{Animation basics example} */ QDeclarativeSmoothedAnimation::QDeclarativeSmoothedAnimation(QObject *parent) diff --git a/src/declarative/util/qdeclarativetimer.cpp b/src/declarative/util/qdeclarativetimer.cpp index 53a9d83..9e18eb5 100644 --- a/src/declarative/util/qdeclarativetimer.cpp +++ b/src/declarative/util/qdeclarativetimer.cpp @@ -80,17 +80,22 @@ public: the text every 500 milliseconds: \qml - Timer { - interval: 500; running: true; repeat: true - onTriggered: time.text = Date().toString() - } - Text { - id: time + import Qt 4.7 + + Item { + Timer { + interval: 500; running: true; repeat: true + onTriggered: time.text = Date().toString() + } + + Text { + id: time + } } \endqml - QDeclarativeTimer is synchronized with the animation timer. Since the animation - timer is usually set to 60fps, the resolution of QDeclarativeTimer will be + The Timer element is synchronized with the animation timer. Since the animation + timer is usually set to 60fps, the resolution of Timer will be at best 16ms. If the Timer is running and one of its properties is changed, the @@ -98,8 +103,6 @@ public: 1000ms has its \e repeat property changed 500ms after starting, the elapsed time will be reset to 0, and the Timer will be triggered 1000ms later. - - \sa {QtDeclarative} */ QDeclarativeTimer::QDeclarativeTimer(QObject *parent) |