summaryrefslogtreecommitdiffstats
path: root/src/declarative
diff options
context:
space:
mode:
Diffstat (limited to 'src/declarative')
-rw-r--r--src/declarative/graphicsitems/qdeclarativeborderimage.cpp17
-rw-r--r--src/declarative/graphicsitems/qdeclarativeflickable.cpp4
-rw-r--r--src/declarative/graphicsitems/qdeclarativegridview.cpp8
-rw-r--r--src/declarative/graphicsitems/qdeclarativeitem.cpp112
-rw-r--r--src/declarative/graphicsitems/qdeclarativemousearea.cpp4
-rw-r--r--src/declarative/graphicsitems/qdeclarativepath.cpp6
-rw-r--r--src/declarative/graphicsitems/qdeclarativepathview.cpp14
-rw-r--r--src/declarative/graphicsitems/qdeclarativepositioners.cpp10
-rw-r--r--src/declarative/graphicsitems/qdeclarativerectangle.cpp25
-rw-r--r--src/declarative/graphicsitems/qdeclarativetext.cpp35
-rw-r--r--src/declarative/graphicsitems/qdeclarativetextedit.cpp10
-rw-r--r--src/declarative/graphicsitems/qdeclarativetextinput.cpp4
-rw-r--r--src/declarative/qml/qdeclarativedom.cpp8
-rw-r--r--src/declarative/qml/qdeclarativeengine.cpp18
-rw-r--r--src/declarative/qml/qdeclarativeworkerscript.cpp7
-rw-r--r--src/declarative/util/qdeclarativeanimation.cpp60
-rw-r--r--src/declarative/util/qdeclarativeconnections.cpp12
-rw-r--r--src/declarative/util/qdeclarativefontloader.cpp14
-rw-r--r--src/declarative/util/qdeclarativelistmodel.cpp8
-rw-r--r--src/declarative/util/qdeclarativestate.cpp19
-rw-r--r--src/declarative/util/qdeclarativestategroup.cpp48
-rw-r--r--src/declarative/util/qdeclarativestateoperations.cpp22
-rw-r--r--src/declarative/util/qdeclarativetransition.cpp34
-rw-r--r--src/declarative/util/qdeclarativexmllistmodel.cpp15
24 files changed, 277 insertions, 237 deletions
diff --git a/src/declarative/graphicsitems/qdeclarativeborderimage.cpp b/src/declarative/graphicsitems/qdeclarativeborderimage.cpp
index 3832813..c03c624 100644
--- a/src/declarative/graphicsitems/qdeclarativeborderimage.cpp
+++ b/src/declarative/graphicsitems/qdeclarativeborderimage.cpp
@@ -225,11 +225,13 @@ QDeclarativeBorderImage::~QDeclarativeBorderImage()
image \c picture.png:
\qml
- border.left: 10
- border.top: 10
- border.bottom: 10
- border.right: 10
- source: picture.png
+ BorderImage {
+ border.left: 10
+ border.top: 10
+ border.bottom: 10
+ border.right: 10
+ source: "picture.png"
+ }
\endqml
The URL may be absolute, or relative to the URL of the component.
@@ -363,7 +365,10 @@ void QDeclarativeBorderImage::load()
the bottom of the image:
\qml
- border.bottom: 10
+ BorderImage {
+ border.bottom: 10
+ // ...
+ }
\endqml
The border lines can also be specified using a
diff --git a/src/declarative/graphicsitems/qdeclarativeflickable.cpp b/src/declarative/graphicsitems/qdeclarativeflickable.cpp
index 87578b4..a12a5ed 100644
--- a/src/declarative/graphicsitems/qdeclarativeflickable.cpp
+++ b/src/declarative/graphicsitems/qdeclarativeflickable.cpp
@@ -373,9 +373,9 @@ void QDeclarativeFlickablePrivate::updateBeginningEnd()
\section1 Example Usage
- \beginfloatright
+ \div {float-right}
\inlineimage flickable.gif
- \endfloat
+ \enddiv
The following example shows a small view onto a large image in which the
user can drag or flick the image in order to view different parts of it.
diff --git a/src/declarative/graphicsitems/qdeclarativegridview.cpp b/src/declarative/graphicsitems/qdeclarativegridview.cpp
index 9aade98..8baaa50 100644
--- a/src/declarative/graphicsitems/qdeclarativegridview.cpp
+++ b/src/declarative/graphicsitems/qdeclarativegridview.cpp
@@ -1096,9 +1096,9 @@ void QDeclarativeGridViewPrivate::flick(AxisData &data, qreal minExtent, qreal m
\snippet doc/src/snippets/declarative/gridview/ContactModel.qml 0
- \beginfloatright
+ \div {float-right}
\inlineimage gridview-simple.png
- \endfloat
+ \enddiv
This model can be referenced as \c ContactModel in other QML files. See \l{QML Modules}
for more information about creating reusable components like this.
@@ -1112,9 +1112,9 @@ void QDeclarativeGridViewPrivate::flick(AxisData &data, qreal minExtent, qreal m
\codeline
\snippet doc/src/snippets/declarative/gridview/gridview.qml classdocs simple
- \beginfloatright
+ \div {float-right}
\inlineimage gridview-highlight.png
- \endfloat
+ \enddiv
The view will create a new delegate for each item in the model. Note that the delegate
is able to access the model's \c name and \c portrait data directly.
diff --git a/src/declarative/graphicsitems/qdeclarativeitem.cpp b/src/declarative/graphicsitems/qdeclarativeitem.cpp
index ac5d55c..ffef61b 100644
--- a/src/declarative/graphicsitems/qdeclarativeitem.cpp
+++ b/src/declarative/graphicsitems/qdeclarativeitem.cpp
@@ -829,10 +829,18 @@ void QDeclarativeKeyNavigationAttached::setFocusNavigation(QDeclarativeItem *cur
This example forwards key events to two lists:
\qml
- ListView { id: list1 ... }
- ListView { id: list2 ... }
- Keys.forwardTo: [list1, list2]
- focus: true
+ Item {
+ ListView {
+ id: list1
+ // ...
+ }
+ ListView {
+ id: list2
+ // ...
+ }
+ Keys.forwardTo: [list1, list2]
+ focus: true
+ }
\endqml
*/
@@ -2161,13 +2169,18 @@ QDeclarativeAnchorLine QDeclarativeItemPrivate::baseline() const
\o \image declarative-anchors_example.png
\o Text anchored to Image, horizontally centered and vertically below, with a margin.
\qml
- Image { id: pic; ... }
- Text {
- id: label
- anchors.horizontalCenter: pic.horizontalCenter
- anchors.top: pic.bottom
- anchors.topMargin: 5
- ...
+ Item {
+ Image {
+ id: pic
+ // ...
+ }
+ Text {
+ id: label
+ anchors.horizontalCenter: pic.horizontalCenter
+ anchors.top: pic.bottom
+ anchors.topMargin: 5
+ // ...
+ }
}
\endqml
\row
@@ -2177,13 +2190,18 @@ QDeclarativeAnchorLine QDeclarativeItemPrivate::baseline() const
property of both defaults to 0.
\qml
- Image { id: pic; ... }
- Text {
- id: label
- anchors.left: pic.right
- anchors.leftMargin: 5
- ...
- }
+ Item {
+ Image {
+ id: pic
+ // ...
+ }
+ Text {
+ id: label
+ anchors.left: pic.right
+ anchors.leftMargin: 5
+ // ...
+ }
+ }
\endqml
\endtable
@@ -2505,11 +2523,15 @@ QDeclarativeListProperty<QObject> QDeclarativeItemPrivate::resources()
\qml
Item {
- states: [
- State { ... },
- State { ... }
- ...
- ]
+ states: [
+ State {
+ // ...
+ },
+ State {
+ // ...
+ }
+ // ...
+ ]
}
\endqml
@@ -2527,11 +2549,15 @@ QDeclarativeListProperty<QDeclarativeState> QDeclarativeItemPrivate::states()
\qml
Item {
- transitions: [
- Transition { ... },
- Transition { ... }
- ...
- ]
+ transitions: [
+ Transition {
+ // ...
+ },
+ Transition {
+ // ...
+ }
+ // ...
+ ]
}
\endqml
@@ -2556,11 +2582,15 @@ QDeclarativeListProperty<QDeclarativeTransition> QDeclarativeItemPrivate::transi
\qml
Item {
- filter: [
- Blur { ... },
- Reflection { ... }
- ...
- ]
+ filter: [
+ Blur {
+ // ...
+ },
+ Reflection {
+ // ...
+ }
+ // ...
+ ]
}
\endqml
*/
@@ -2595,14 +2625,14 @@ QDeclarativeListProperty<QDeclarativeTransition> QDeclarativeItemPrivate::transi
This property is often used in scripts to change between states. For
example:
- \qml
- function toggle() {
- if (button.state == 'On')
- button.state = 'Off';
- else
- button.state = 'On';
- }
- \endqml
+ \js
+ function toggle() {
+ if (button.state == 'On')
+ button.state = 'Off';
+ else
+ button.state = 'On';
+ }
+ \endjs
If the item is in its base state (i.e. no explicit state has been
set), \c state will be a blank string. Likewise, you can return an
diff --git a/src/declarative/graphicsitems/qdeclarativemousearea.cpp b/src/declarative/graphicsitems/qdeclarativemousearea.cpp
index 273fc53..ffbae3f 100644
--- a/src/declarative/graphicsitems/qdeclarativemousearea.cpp
+++ b/src/declarative/graphicsitems/qdeclarativemousearea.cpp
@@ -216,9 +216,9 @@ QDeclarativeMouseAreaPrivate::~QDeclarativeMouseAreaPrivate()
\section1 Example Usage
- \beginfloatright
+ \div {float-right}
\inlineimage qml-mousearea-snippet.png
- \endfloat
+ \enddiv
The following example uses a MouseArea in a \l Rectangle that changes
the \l Rectangle color to red when clicked:
diff --git a/src/declarative/graphicsitems/qdeclarativepath.cpp b/src/declarative/graphicsitems/qdeclarativepath.cpp
index bc395d2..48e3f66 100644
--- a/src/declarative/graphicsitems/qdeclarativepath.cpp
+++ b/src/declarative/graphicsitems/qdeclarativepath.cpp
@@ -845,7 +845,7 @@ void QDeclarativePathCubic::addToPath(QPainterPath &path)
\o
\qml
PathView {
- ...
+ // ...
Path {
startX: 20; startY: 0
PathQuad { x: 50; y: 80; controlX: 0; controlY: 80 }
@@ -859,7 +859,7 @@ void QDeclarativePathCubic::addToPath(QPainterPath &path)
\o
\qml
PathView {
- ...
+ // ...
Path {
startX: 20; startY: 0
PathQuad { x: 50; y: 80; controlX: 0; controlY: 80 }
@@ -892,7 +892,7 @@ void QDeclarativePathCubic::addToPath(QPainterPath &path)
\qml
PathView {
- ...
+ // ...
Path {
startX: 0; startY: 0
PathLine { x:100; y: 0; }
diff --git a/src/declarative/graphicsitems/qdeclarativepathview.cpp b/src/declarative/graphicsitems/qdeclarativepathview.cpp
index 64656af..306575e 100644
--- a/src/declarative/graphicsitems/qdeclarativepathview.cpp
+++ b/src/declarative/graphicsitems/qdeclarativepathview.cpp
@@ -379,14 +379,14 @@ void QDeclarativePathViewPrivate::regenerate()
\l decrementCurrentIndex() or \l incrementCurrentIndex(), for example to navigate
using the left and right arrow keys:
- \code
+ \qml
PathView {
- ...
+ // ...
focus: true
Keys.onLeftPressed: decrementCurrentIndex()
Keys.onRightPressed: incrementCurrentIndex()
}
- \endcode
+ \endqml
The path view itself is a focus scope (see \l{qmlfocus#Acquiring Focus and Focus Scopes}{the focus documentation page} for more details).
@@ -444,7 +444,7 @@ QDeclarativePathView::~QDeclarativePathView()
Component {
Rectangle {
visible: PathView.onPath
- ...
+ // ...
}
}
\endqml
@@ -706,14 +706,14 @@ void QDeclarativePathViewPrivate::setAdjustedOffset(qreal o)
of the \l{PathView::onPath}{PathView.onPath} attached property to ensure that
the highlight is hidden when flicked away from the path.
- \code
+ \qml
Component {
Rectangle {
visible: PathView.onPath
- ...
+ // ...
}
}
- \endcode
+ \endqml
\sa highlightItem, highlightRangeMode
*/
diff --git a/src/declarative/graphicsitems/qdeclarativepositioners.cpp b/src/declarative/graphicsitems/qdeclarativepositioners.cpp
index 4560d32..27a1301 100644
--- a/src/declarative/graphicsitems/qdeclarativepositioners.cpp
+++ b/src/declarative/graphicsitems/qdeclarativepositioners.cpp
@@ -364,9 +364,13 @@ void QDeclarativeBasePositioner::finishApplyTransitions()
\qml
Column {
spacing: 2
- add: ...
- move: ...
- ...
+ add: Transition {
+ // Define an animation for adding a new item...
+ }
+ move: Transition {
+ // Define an animation for moving items within the column...
+ }
+ // ...
}
\endqml
diff --git a/src/declarative/graphicsitems/qdeclarativerectangle.cpp b/src/declarative/graphicsitems/qdeclarativerectangle.cpp
index 94db2f1..d962919 100644
--- a/src/declarative/graphicsitems/qdeclarativerectangle.cpp
+++ b/src/declarative/graphicsitems/qdeclarativerectangle.cpp
@@ -60,7 +60,10 @@ QT_BEGIN_NAMESPACE
Example:
\qml
- Rectangle { border.width: 2; border.color: "red" ... }
+ Rectangle {
+ border.width: 2
+ border.color: "red"
+ }
\endqml
*/
@@ -131,9 +134,9 @@ void QDeclarativeGradientStop::updateGradient()
\section1 Example Usage
- \beginfloatright
+ \div {float-right}
\inlineimage qml-gradient.png
- \endfloat
+ \enddiv
The following example declares a \l Rectangle item with a gradient starting
with red, blending to yellow at one third of the height of the rectangle,
@@ -217,9 +220,9 @@ void QDeclarativeGradient::doUpdate()
\section1 Example Usage
- \beginfloatright
+ \div {float-right}
\inlineimage declarative-rect.png
- \endfloat
+ \enddiv
The following example shows the effects of some of the common properties on a
Rectangle item, which in this case is used to create a square:
@@ -269,9 +272,9 @@ void QDeclarativeRectangle::doUpdate()
rectangle (as documented for QRect rendering). This can cause unintended effects if
\c border.width is 1 and the rectangle is \l{Item::clip}{clipped} by a parent item:
- \beginfloatright
+ \div {float-right}
\inlineimage rect-border-width.png
- \endfloat
+ \enddiv
\snippet doc/src/snippets/declarative/rectangle/rect-border-width.qml 0
@@ -293,9 +296,9 @@ QDeclarativePen *QDeclarativeRectangle::border()
This property allows for the construction of simple vertical gradients.
Other gradients may by formed by adding rotation to the rectangle.
- \beginfloatleft
+ \div {float-left}
\inlineimage declarative-rect_gradient.png
- \endfloat
+ \enddiv
\snippet doc/src/snippets/declarative/rectangle/rectangle-gradient.qml rectangles
\clearfloat
@@ -361,9 +364,9 @@ void QDeclarativeRectangle::setRadius(qreal radius)
The default color is white.
- \beginfloatright
+ \div {float-right}
\inlineimage rect-color.png
- \endfloat
+ \enddiv
The following example shows rectangles with colors specified
using hexadecimal and named color notation:
diff --git a/src/declarative/graphicsitems/qdeclarativetext.cpp b/src/declarative/graphicsitems/qdeclarativetext.cpp
index 54b4c3a..8f1d531 100644
--- a/src/declarative/graphicsitems/qdeclarativetext.cpp
+++ b/src/declarative/graphicsitems/qdeclarativetext.cpp
@@ -716,11 +716,24 @@ QPixmap QDeclarativeTextPrivate::drawOutline(const QPixmap &source, const QPixma
\brief The Text item allows you to add formatted text to a scene.
\inherits Item
- A Text item can display both plain and rich text. For example:
+ Text items can display both plain and rich text. For example, red text with
+ a specific font and size can be defined like this:
\qml
- Text { text: "Hello World!"; font.family: "Helvetica"; font.pointSize: 24; color: "red" }
- Text { text: "<b>Hello</b> <i>World!</i>" }
+ Text {
+ text: "Hello World!"
+ font.family: "Helvetica"
+ font.pointSize: 24
+ color: "red"
+ }
+ \endqml
+
+ Rich text is defined using HTML-style markup:
+
+ \qml
+ Text {
+ text: "<b>Hello</b> <i>World!</i>"
+ }
\endqml
\image declarative-text.png
@@ -956,12 +969,20 @@ void QDeclarativeText::setText(const QString &n)
The text color.
+ An example of green text defined using hexadecimal notation:
\qml
- //green text using hexadecimal notation
- Text { color: "#00FF00"; ... }
+ Text {
+ color: "#00FF00"
+ text: "green text"
+ }
+ \endqml
- //steelblue text using SVG color name
- Text { color: "steelblue"; ... }
+ An example of steel blue text defined using an SVG color name:
+ \qml
+ Text {
+ color: "steelblue"
+ text: "blue text"
+ }
\endqml
*/
QColor QDeclarativeText::color() const
diff --git a/src/declarative/graphicsitems/qdeclarativetextedit.cpp b/src/declarative/graphicsitems/qdeclarativetextedit.cpp
index 17354eb..39f1465 100644
--- a/src/declarative/graphicsitems/qdeclarativetextedit.cpp
+++ b/src/declarative/graphicsitems/qdeclarativetextedit.cpp
@@ -372,11 +372,13 @@ void QDeclarativeTextEdit::setFont(const QFont &font)
The text color.
\qml
-// green text using hexadecimal notation
-TextEdit { color: "#00FF00"; ... }
+ // green text using hexadecimal notation
+ TextEdit { color: "#00FF00" }
+ \endqml
-// steelblue text using SVG color name
-TextEdit { color: "steelblue"; ... }
+ \qml
+ // steelblue text using SVG color name
+ TextEdit { color: "steelblue" }
\endqml
*/
QColor QDeclarativeTextEdit::color() const
diff --git a/src/declarative/graphicsitems/qdeclarativetextinput.cpp b/src/declarative/graphicsitems/qdeclarativetextinput.cpp
index 57e60ac..6f7d3ff 100644
--- a/src/declarative/graphicsitems/qdeclarativetextinput.cpp
+++ b/src/declarative/graphicsitems/qdeclarativetextinput.cpp
@@ -550,10 +550,10 @@ void QDeclarativeTextInput::select(int start, int end)
It is equivalent to the following snippet, but is faster and easier
to use.
- \qml
+ \js
myTextInput.text.toString().substring(myTextInput.selectionStart,
myTextInput.selectionEnd);
- \endqml
+ \endjs
*/
QString QDeclarativeTextInput::selectedText() const
{
diff --git a/src/declarative/qml/qdeclarativedom.cpp b/src/declarative/qml/qdeclarativedom.cpp
index 89aa79a..f1296aa 100644
--- a/src/declarative/qml/qdeclarativedom.cpp
+++ b/src/declarative/qml/qdeclarativedom.cpp
@@ -334,10 +334,10 @@ QList<QByteArray> QDeclarativeDomProperty::propertyNameParts() const
Return true if this property is used as a default property in the QML
document.
- \qml
+ \code
<Text text="hello"/>
<Text>hello</Text>
- \endqml
+ \endcode
The above two examples return the same DOM tree, except that the second has
the default property flag set on the text property. Observe that whether
@@ -509,10 +509,10 @@ QByteArray QDeclarativeDomDynamicProperty::propertyTypeName() const
Return true if this property is used as a default property in the QML
document.
- \qml
+ \code
<Text text="hello"/>
<Text>hello</Text>
- \endqml
+ \endcode
The above two examples return the same DOM tree, except that the second has
the default property flag set on the text property. Observe that whether
diff --git a/src/declarative/qml/qdeclarativeengine.cpp b/src/declarative/qml/qdeclarativeengine.cpp
index 890f500..d0bfb60 100644
--- a/src/declarative/qml/qdeclarativeengine.cpp
+++ b/src/declarative/qml/qdeclarativeengine.cpp
@@ -1981,14 +1981,24 @@ QScriptValue QDeclarativeEnginePrivate::quit(QScriptContext * /*ctxt*/, QScriptE
}
/*!
-\qmlmethod color Qt::tint(color baseColor, color tintColor)
+ \qmlmethod color Qt::tint(color baseColor, color tintColor)
This function allows tinting one color with another.
- The tint color should usually be mostly transparent, or you will not be able to see the underlying color. The below example provides a slight red tint by having the tint color be pure red which is only 1/16th opaque.
+ The tint color should usually be mostly transparent, or you will not be
+ able to see the underlying color. The below example provides a slight red
+ tint by having the tint color be pure red which is only 1/16th opaque.
\qml
- Rectangle { x: 0; width: 80; height: 80; color: "lightsteelblue" }
- Rectangle { x: 100; width: 80; height: 80; color: Qt.tint("lightsteelblue", "#10FF0000") }
+ Item {
+ Rectangle {
+ x: 0; width: 80; height: 80
+ color: "lightsteelblue"
+ }
+ Rectangle {
+ x: 100; width: 80; height: 80
+ color: Qt.tint("lightsteelblue", "#10FF0000")
+ }
+ }
\endqml
\image declarative-rect_tint.png
diff --git a/src/declarative/qml/qdeclarativeworkerscript.cpp b/src/declarative/qml/qdeclarativeworkerscript.cpp
index ac13c68..6283f92 100644
--- a/src/declarative/qml/qdeclarativeworkerscript.cpp
+++ b/src/declarative/qml/qdeclarativeworkerscript.cpp
@@ -544,12 +544,7 @@ void QDeclarativeWorkerScriptEngine::run()
The above worker script specifies a JavaScript file, "script.js", that handles
the operations to be performed in the new thread. Here is \c script.js:
- \qml
- WorkerScript.onMessage = function(message) {
- // ... long-running operations and calculations are done here
- WorkerScript.sendMessage({ 'reply': 'Mouse is at ' + message.x + ',' + message.y })
- }
- \endqml
+ \quotefile doc/src/snippets/declarative/script.js
When the user clicks anywhere within the rectangle, \c sendMessage() is
called, triggering the \tt WorkerScript.onMessage() handler in
diff --git a/src/declarative/util/qdeclarativeanimation.cpp b/src/declarative/util/qdeclarativeanimation.cpp
index f22b9dd..bd3234f 100644
--- a/src/declarative/util/qdeclarativeanimation.cpp
+++ b/src/declarative/util/qdeclarativeanimation.cpp
@@ -672,7 +672,9 @@ QDeclarativeColorAnimation::~QDeclarativeColorAnimation()
\qml
Item {
- states: [ ... ]
+ states: [
+ // States are defined here...
+ ]
transition: Transition {
NumberAnimation { from: "#c0c0c0"; duration: 2000 }
@@ -725,40 +727,29 @@ void QDeclarativeColorAnimation::setTo(const QColor &t)
/*!
\qmlclass ScriptAction QDeclarativeScriptAction
- \ingroup qml-animation-transition
+ \ingroup qml-animation-transition
\since 4.7
\inherits Animation
\brief The ScriptAction element allows scripts to be run during an animation.
- ScriptAction can be used to run script at a specific point in an animation.
+ ScriptAction can be used to run a script at a specific point in an animation.
\qml
SequentialAnimation {
- NumberAnimation { ... }
+ NumberAnimation {
+ // ...
+ }
ScriptAction { script: doSomething(); }
- NumberAnimation { ... }
+ NumberAnimation {
+ // ...
+ }
}
\endqml
When used as part of a Transition, you can also target a specific
StateChangeScript to run using the \c scriptName property.
- \qml
- State {
- StateChangeScript {
- name: "myScript"
- script: doStateStuff();
- }
- }
- ...
- Transition {
- SequentialAnimation {
- NumberAnimation { ... }
- ScriptAction { scriptName: "myScript" }
- NumberAnimation { ... }
- }
- }
- \endqml
+ \snippet doc/src/snippets/declarative/states/statechangescript.qml state and transition
\sa StateChangeScript
*/
@@ -870,7 +861,7 @@ QAbstractAnimation *QDeclarativeScriptAction::qtAnimation()
/*!
\qmlclass PropertyAction QDeclarativePropertyAction
- \ingroup qml-animation-transition
+ \ingroup qml-animation-transition
\since 4.7
\inherits Animation
\brief The PropertyAction element allows immediate property changes during animation.
@@ -896,21 +887,14 @@ QAbstractAnimation *QDeclarativeScriptAction::qtAnimation()
However, with this code, the \c transformOrigin is not set until \e after
the animation, as a \l State is taken to define the values at the \e end of
a transition. The animation would rotate at the default \c transformOrigin,
- then jump to \c Item.BottomRight. To fix this, insert a PropertyChanges
+ then jump to \c Item.BottomRight. To fix this, insert a PropertyAction
before the RotationAnimation begins:
- \qml
- transitions: Transition {
- SequentialAnimation {
- PropertyAction { target: rect; property: "transformOrigin" }
- RotationAnimation { ... }
- }
- }
- \endqml
+ \snippet doc/src/snippets/declarative/propertyaction-sequential.qml sequential
This immediately sets the \c transformOrigin property to the value defined
in the end state of the \l Transition (i.e. the value defined in the
- PropertyChanges object) so that the rotation animation begins with the
+ PropertyAction object) so that the rotation animation begins with the
correct transform origin.
\sa {QML Animation}, QtDeclarative
@@ -1195,7 +1179,9 @@ void QDeclarativeNumberAnimation::init()
\qml
Item {
- states: [ ... ]
+ states: [
+ // ...
+ ]
transition: Transition {
NumberAnimation { properties: "x"; from: 100; duration: 200 }
@@ -1421,7 +1407,9 @@ QDeclarativeRotationAnimation::~QDeclarativeRotationAnimation()
\qml
Item {
- states: [ ... ]
+ states: [
+ // ...
+ ]
transition: Transition {
RotationAnimation { properties: "angle"; from: 100; duration: 2000 }
@@ -2253,7 +2241,7 @@ void QDeclarativePropertyAnimation::setProperties(const QString &prop)
width: 100; height: 100
color: Qt.rgba(0,0,1)
//need to explicitly specify target and property
- NumberAnimation { id: theAnim; target: theRect; property: "x" to: 500 }
+ NumberAnimation { id: theAnim; target: theRect; property: "x"; to: 500 }
MouseArea {
anchors.fill: parent
onClicked: theAnim.start()
@@ -2555,7 +2543,7 @@ void QDeclarativeParentAnimation::setNewParent(QDeclarativeItem *newParent)
ParentAnimation {
target: myItem
via: topLevelItem
- ...
+ // ...
}
\endqml
*/
diff --git a/src/declarative/util/qdeclarativeconnections.cpp b/src/declarative/util/qdeclarativeconnections.cpp
index 6d3ddeb..5a66aab 100644
--- a/src/declarative/util/qdeclarativeconnections.cpp
+++ b/src/declarative/util/qdeclarativeconnections.cpp
@@ -72,8 +72,8 @@ public:
/*!
\qmlclass Connections QDeclarativeConnections
- \ingroup qml-utility-elements
- \since 4.7
+ \ingroup qml-utility-elements
+ \since 4.7
\brief A Connections element describes generalized connections to signals.
A Connections object creates a connection to a QML signal.
@@ -83,7 +83,7 @@ public:
\qml
MouseArea {
- onClicked: { foo(...) }
+ onClicked: { foo(parameters) }
}
\endqml
@@ -104,7 +104,7 @@ public:
\qml
MouseArea {
Connections {
- onClicked: foo(...)
+ onClicked: foo(parameters)
}
}
\endqml
@@ -116,10 +116,10 @@ public:
MouseArea {
id: area
}
- ...
+ // ...
Connections {
target: area
- onClicked: foo(...)
+ onClicked: foo(parameters)
}
\endqml
diff --git a/src/declarative/util/qdeclarativefontloader.cpp b/src/declarative/util/qdeclarativefontloader.cpp
index d39da3f..eba9cf9 100644
--- a/src/declarative/util/qdeclarativefontloader.cpp
+++ b/src/declarative/util/qdeclarativefontloader.cpp
@@ -262,8 +262,18 @@ void QDeclarativeFontLoader::updateFontInfo(const QString& name, QDeclarativeFon
Example:
\qml
- FontLoader { id: webFont; source: "http://www.mysite.com/myfont.ttf" }
- Text { text: "Fancy font"; font.family: webFont.name }
+ Item {
+ width: 200; height: 50
+
+ FontLoader {
+ id: webFont
+ source: "http://www.mysite.com/myfont.ttf"
+ }
+ Text {
+ text: "Fancy font"
+ font.family: webFont.name
+ }
+ }
\endqml
*/
QString QDeclarativeFontLoader::name() const
diff --git a/src/declarative/util/qdeclarativelistmodel.cpp b/src/declarative/util/qdeclarativelistmodel.cpp
index a0c3a74..9332de4 100644
--- a/src/declarative/util/qdeclarativelistmodel.cpp
+++ b/src/declarative/util/qdeclarativelistmodel.cpp
@@ -108,9 +108,9 @@ QDeclarativeListModelParser::ListInstruction *QDeclarativeListModelParser::ListM
The following example shows a ListModel containing three elements, with the roles
"name" and "cost".
- \beginfloatright
+ \div {float-right}
\inlineimage listmodel.png
- \endfloat
+ \enddiv
\snippet doc/src/snippets/declarative/listmodel.qml 0
@@ -133,9 +133,9 @@ QDeclarativeListModelParser::ListInstruction *QDeclarativeListModelParser::ListM
The delegate displays all the fruit attributes:
- \beginfloatright
+ \div {float-right}
\inlineimage listmodel-nested.png
- \endfloat
+ \enddiv
\snippet doc/src/snippets/declarative/listmodel-nested.qml delegate
diff --git a/src/declarative/util/qdeclarativestate.cpp b/src/declarative/util/qdeclarativestate.cpp
index cde9a72..5a4e2b1 100644
--- a/src/declarative/util/qdeclarativestate.cpp
+++ b/src/declarative/util/qdeclarativestate.cpp
@@ -216,15 +216,18 @@ bool QDeclarativeState::isWhenKnown() const
\snippet doc/src/snippets/declarative/state-when.qml 0
- If multiple states in a group have \c when clauses that evaluate to \c true at the same time,
- the first matching state will be applied. For example, in the following snippet
- \c state1 will always be selected rather than \c state2 when sharedCondition becomes
- \c true.
+ If multiple states in a group have \c when clauses that evaluate to \c true
+ at the same time, the first matching state will be applied. For example, in
+ the following snippet \c state1 will always be selected rather than
+ \c state2 when sharedCondition becomes \c true.
\qml
- states: [
- State { name: "state1"; when: sharedCondition },
- State { name: "state2"; when: sharedCondition }
- ]
+ Item {
+ states: [
+ State { name: "state1"; when: sharedCondition },
+ State { name: "state2"; when: sharedCondition }
+ ]
+ // ...
+ }
\endqml
*/
QDeclarativeBinding *QDeclarativeState::when() const
diff --git a/src/declarative/util/qdeclarativestategroup.cpp b/src/declarative/util/qdeclarativestategroup.cpp
index 7aeea12..f1d0997 100644
--- a/src/declarative/util/qdeclarativestategroup.cpp
+++ b/src/declarative/util/qdeclarativestategroup.cpp
@@ -102,10 +102,10 @@ public:
id: myStateGroup
states: State {
name: "state1"
- ...
+ // ...
}
transitions: Transition {
- ...
+ // ...
}
}
@@ -140,11 +140,15 @@ QList<QDeclarativeState *> QDeclarativeStateGroup::states() const
\qml
StateGroup {
- states: [
- State { ... },
- State { ... }
- ...
- ]
+ states: [
+ State {
+ // State definition...
+ },
+ State {
+ // ...
+ }
+ // Other states...
+ ]
}
\endqml
@@ -197,11 +201,15 @@ void QDeclarativeStateGroupPrivate::clear_states(QDeclarativeListProperty<QDecla
\qml
StateGroup {
- transitions: [
- Transition { ... },
- Transition { ... }
- ...
- ]
+ transitions: [
+ Transition {
+ // ...
+ },
+ Transition {
+ // ...
+ }
+ // ...
+ ]
}
\endqml
@@ -221,14 +229,14 @@ QDeclarativeListProperty<QDeclarativeTransition> QDeclarativeStateGroup::transit
This property is often used in scripts to change between states. For
example:
- \qml
- function toggle() {
- if (button.state == 'On')
- button.state = 'Off';
- else
- button.state = 'On';
- }
- \endqml
+ \js
+ function toggle() {
+ if (button.state == 'On')
+ button.state = 'Off';
+ else
+ button.state = 'On';
+ }
+ \endjs
If the state group is in its base state (i.e. no explicit state has been
set), \c state will be a blank string. Likewise, you can return a
diff --git a/src/declarative/util/qdeclarativestateoperations.cpp b/src/declarative/util/qdeclarativestateoperations.cpp
index 148211a..9aca71f 100644
--- a/src/declarative/util/qdeclarativestateoperations.cpp
+++ b/src/declarative/util/qdeclarativestateoperations.cpp
@@ -606,25 +606,7 @@ public:
ScriptAction to specify the point in the transition at which
the StateChangeScript should to be run.
- \qml
- State {
- name "state1"
- StateChangeScript {
- name: "myScript"
- script: doStateStuff();
- }
- ...
- }
- ...
- Transition {
- to: "state1"
- SequentialAnimation {
- NumberAnimation { ... }
- ScriptAction { scriptName: "myScript" }
- NumberAnimation { ... }
- }
- }
- \endqml
+ \snippet snippets/declarative/states/statechangescript.qml state and transition
\sa ScriptAction
*/
@@ -659,7 +641,7 @@ void QDeclarativeStateChangeScript::setScript(const QDeclarativeScriptString &s)
This property holds the name of the script. This name can be used by a
ScriptAction to target a specific script.
- \sa ScriptAction::stateChangeScriptName
+ \sa ScriptAction::scriptName
*/
QString QDeclarativeStateChangeScript::name() const
{
diff --git a/src/declarative/util/qdeclarativetransition.cpp b/src/declarative/util/qdeclarativetransition.cpp
index e533a07..063ec3e 100644
--- a/src/declarative/util/qdeclarativetransition.cpp
+++ b/src/declarative/util/qdeclarativetransition.cpp
@@ -82,15 +82,7 @@ QT_BEGIN_NAMESPACE
To define multiple transitions, specify \l Item::transitions as a list:
- \qml
- Item {
- ...
- transitions: [
- Transition { to: "state1" ... },
- Transition { ... }
- ]
- }
- \endqml
+ \snippet doc/src/snippets/declarative/transitions-list.qml list of transitions
If multiple Transitions are specified, only a single (best-matching) Transition will be applied for any particular
state change. In the example above, when changing to \c state1, the first transition will be used, rather
@@ -222,13 +214,7 @@ void QDeclarativeTransition::prepare(QDeclarativeStateOperation::ActionList &act
If the transition was changed to this:
- \qml
- transitions: Transition {
- to: "brighter"
- ColorAnimation { duration: 1000 }
- }
- }
- \endqml
+ \snippet doc/src/snippets/declarative/transition-from-to-modified.qml modified transition
The animation would only be applied when changing from the default state to
the "brighter" state (i.e. when the mouse is pressed, but not on release).
@@ -313,24 +299,12 @@ void QDeclarativeTransition::setToState(const QString &t)
This property holds a list of the animations to be run for this transition.
- \qml
- Transition {
- PropertyAnimation { ... }
- NumberAnimation { ... }
- }
- \endqml
+ \snippet examples/declarative/toys/dynamicscene/dynamicscene.qml top-level transitions
The top-level animations are run in parallel. To run them sequentially,
define them within a SequentialAnimation:
- \qml
- Transition {
- SequentialAnimation {
- PropertyAnimation { ... }
- NumberAnimation { ... }
- }
- }
- \endqml
+ \snippet doc/src/snippets/declarative/transition-reversible.qml sequential animations
*/
QDeclarativeListProperty<QDeclarativeAbstractAnimation> QDeclarativeTransition::animations()
{
diff --git a/src/declarative/util/qdeclarativexmllistmodel.cpp b/src/declarative/util/qdeclarativexmllistmodel.cpp
index 976fc4a..cf3696b 100644
--- a/src/declarative/util/qdeclarativexmllistmodel.cpp
+++ b/src/declarative/util/qdeclarativexmllistmodel.cpp
@@ -90,10 +90,15 @@ typedef QPair<int, int> QDeclarativeXmlListRange;
\qml
XmlListModel {
id: xmlModel
- ...
- XmlRole { name: "title"; query: "title/string()" }
+ // ...
+ XmlRole {
+ name: "title"
+ query: "title/string()"
+ }
}
+ \endqml
+ \qml
ListView {
model: xmlModel
delegate: Text { text: title }
@@ -792,9 +797,9 @@ void QDeclarativeXmlListModel::setNamespaceDeclarations(const QString &declarati
This will access the \c title value for the first item in the model:
- \qml
- var title = model.get(0).title;
- \endqml
+ \js
+ var title = model.get(0).title;
+ \endjs
*/
QScriptValue QDeclarativeXmlListModel::get(int index) const
{