From 84a1df764bf2e29e9e6e43f4f0e1a69201199fbc Mon Sep 17 00:00:00 2001 From: David Boddie Date: Fri, 21 Jan 2011 16:10:54 +0100 Subject: Doc: Fixed the syntax of QML code snippets. --- doc/src/declarative/qdeclarativestates.qdoc | 37 +++---- .../snippets/declarative/mousearea/mousearea.qml | 116 ++++++++++----------- doc/src/snippets/declarative/propertyanimation.qml | 24 ++--- .../graphicsitems/qdeclarativepathview.cpp | 14 +-- src/declarative/util/qdeclarativeanimation.cpp | 4 +- src/declarative/util/qdeclarativeconnections.cpp | 6 +- 6 files changed, 98 insertions(+), 103 deletions(-) diff --git a/doc/src/declarative/qdeclarativestates.qdoc b/doc/src/declarative/qdeclarativestates.qdoc index b663d43..69b348b 100644 --- a/doc/src/declarative/qdeclarativestates.qdoc +++ b/doc/src/declarative/qdeclarativestates.qdoc @@ -71,7 +71,7 @@ of an item, set the \l {Item::}{state} property to the name of the state. Non-Item objects can use states through the StateGroup element. -\section1 Creating states +\section1 Creating States To create a state, add a \l State object to the item's \l {Item::}{states} property, which holds a list of states for that item. @@ -91,7 +91,7 @@ objects, not just the object that owns the state. For example: \qml Rectangle { - ... + // ... states: [ State { name: "moved" @@ -106,14 +106,7 @@ As a convenience, if an item only has one state, its \l {Item::}{states} property can be defined as a single \l State, without the square-brace list syntax: -\qml -Item { - ... - states: State { - ... - } -} -\endqml +\snippet doc/src/snippets/declarative/propertyanimation.qml single state A \l State is not limited to performing modifications on property values. It can also: @@ -130,7 +123,7 @@ demonstrates how to declare a basic set of states and apply animated transitions between them. -\section1 The default state +\section1 The Default State Of course, the \l Rectangle in the example above could have simply been moved by setting its position to (50, 50) in the mouse area's \c onClicked handler. @@ -146,7 +139,7 @@ like this: \qml Rectangle { - ... + // ... MouseArea { id: mouseArea @@ -154,8 +147,9 @@ Rectangle { } states: State { - name: "moved"; when: mouseArea.pressed - ... + name: "moved" + when: mouseArea.pressed + // ... } } \endqml @@ -171,7 +165,7 @@ using the \l {State::}{when} property, the above code could be changed to: \qml Rectangle { - ... + // ... MouseArea { anchors.fill: parent @@ -181,7 +175,7 @@ Rectangle { states: State { name: "moved" - ... + // ... } } \endqml @@ -191,7 +185,7 @@ as it provides a simpler (and a better, more declarative) solution than assigning the state from signal handlers. -\section1 Animating state changes +\section1 Animating State Changes State changes can be easily animated through \l {Transitions}{transitions}. A @@ -203,12 +197,14 @@ movement of the \l Rectangle would be animated: \qml Rectangle { - ... + // ... - MouseArea { ... } + MouseArea { + // Handle mouse events... + } states: [ - ... + // States are defined here... ] transitions: [ @@ -224,5 +220,4 @@ during a state change within this item, their values should be animated over 500 milliseconds. See the \l Transitions documentation for more information. - */ diff --git a/doc/src/snippets/declarative/mousearea/mousearea.qml b/doc/src/snippets/declarative/mousearea/mousearea.qml index 7cd0a77..1dc0598 100644 --- a/doc/src/snippets/declarative/mousearea/mousearea.qml +++ b/doc/src/snippets/declarative/mousearea/mousearea.qml @@ -46,74 +46,72 @@ Rectangle { width: childrenRect.width height: childrenRect.height -Row { + Row { + //! [intro] + Rectangle { + width: 100; height: 100 + color: "green" -//! [intro] -Rectangle { - width: 100; height: 100 - color: "green" - - MouseArea { - anchors.fill: parent - onClicked: { parent.color = 'red' } - } -} -//! [intro] + MouseArea { + anchors.fill: parent + onClicked: { parent.color = 'red' } + } + } + //! [intro] -//! [intro-extended] -Rectangle { - width: 100; height: 100 - color: "green" + //! [intro-extended] + Rectangle { + width: 100; height: 100 + color: "green" - MouseArea { - anchors.fill: parent - acceptedButtons: Qt.LeftButton | Qt.RightButton - onClicked: { - if (mouse.button == Qt.RightButton) - parent.color = 'blue'; - else - parent.color = 'red'; + MouseArea { + anchors.fill: parent + acceptedButtons: Qt.LeftButton | Qt.RightButton + onClicked: { + if (mouse.button == Qt.RightButton) + parent.color = 'blue'; + else + parent.color = 'red'; + } + } } - } -} -//! [intro-extended] + //! [intro-extended] -//! [drag] -Rectangle { - id: container - width: 600; height: 200 + //! [drag] + Rectangle { + id: container + width: 600; height: 200 - Rectangle { - id: rect - width: 50; height: 50 - color: "red" - opacity: (600.0 - rect.x) / 600 + Rectangle { + id: rect + width: 50; height: 50 + color: "red" + opacity: (600.0 - rect.x) / 600 - MouseArea { - anchors.fill: parent - drag.target: rect - drag.axis: Drag.XAxis - drag.minimumX: 0 - drag.maximumX: container.width - rect.width + MouseArea { + anchors.fill: parent + drag.target: rect + drag.axis: Drag.XAxis + drag.minimumX: 0 + drag.maximumX: container.width - rect.width + } + } } - } -} -//! [drag] + //! [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] + //! [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/propertyanimation.qml b/doc/src/snippets/declarative/propertyanimation.qml index 1f1cbaf..30eeba8 100644 --- a/doc/src/snippets/declarative/propertyanimation.qml +++ b/doc/src/snippets/declarative/propertyanimation.qml @@ -48,10 +48,12 @@ Rectangle { width: 100; height: 100 color: "red" + //! [single state] states: State { name: "moved" PropertyChanges { target: rect; x: 50 } } + //! [single state] transitions: Transition { PropertyAnimation { properties: "x,y"; easing.type: Easing.InOutQuad } @@ -83,18 +85,16 @@ Rectangle { } //![propertyvaluesource] -//![standalone] -Rectangle { - id: theRect - width: 100; height: 100 - color: "red" - - // this is a standalone animation, it's not running by default - PropertyAnimation { id: animation; target: theRect; property: "width"; to: 30; duration: 500 } - - MouseArea { anchors.fill: parent; onClicked: animation.running = true } -} -//![standalone] + //![standalone] + Rectangle { + id: theRect + width: 100; height: 100 + color: "red" + // this is a standalone animation, it's not running by default + PropertyAnimation { id: animation; target: theRect; property: "width"; to: 30; duration: 500 } + MouseArea { anchors.fill: parent; onClicked: animation.running = true } + } + //![standalone] } diff --git a/src/declarative/graphicsitems/qdeclarativepathview.cpp b/src/declarative/graphicsitems/qdeclarativepathview.cpp index 87ea214..29838f6 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). @@ -437,7 +437,7 @@ QDeclarativePathView::~QDeclarativePathView() Component { Rectangle { visible: PathView.onPath - ... + // ... } } \endqml @@ -697,14 +697,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/util/qdeclarativeanimation.cpp b/src/declarative/util/qdeclarativeanimation.cpp index dd7e5fd..f2c54ab 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 } diff --git a/src/declarative/util/qdeclarativeconnections.cpp b/src/declarative/util/qdeclarativeconnections.cpp index 15e5ac5..dbb6f43 100644 --- a/src/declarative/util/qdeclarativeconnections.cpp +++ b/src/declarative/util/qdeclarativeconnections.cpp @@ -71,8 +71,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. @@ -115,7 +115,7 @@ public: MouseArea { id: area } - ... + // ... Connections { target: area onClicked: foo(...) -- cgit v0.12