path: root/examples/quick/painteditem
diff options
authorVenugopal Shivashankar <venugopal.shivashankar@digia.com>2012-11-07 19:09:52 +0100
committerGeir Vattekar <geir.vattekar@digia.com>2012-11-08 12:16:52 +0100
commit61d35829eed6661c1371d397bbb316ea2f636c50 (patch)
tree0cf63cdb094e24699833c3986e35e8b8a9373077 /examples/quick/painteditem
parent47c45bb1e487b3823281683c1110d9269f144582 (diff)
Doc: Moved all content in the doc directory.
- most images to the corresponding examples directory - Fixed a few broken links to the examples and qdoc pages - removed the obsolete and unused images and qdoc pages Change-Id: I18f9551b42ec713b81e3f69694a2bd04b1ebf794 Reviewed-by: Geir Vattekar <geir.vattekar@digia.com>
Diffstat (limited to 'examples/quick/painteditem')
-rw-r--r--examples/quick/painteditem/textballoons/doc/images/declarative-textballoons_example.pngbin0 -> 29663 bytes
2 files changed, 77 insertions, 3 deletions
diff --git a/examples/quick/painteditem/textballoons/doc/images/declarative-textballoons_example.png b/examples/quick/painteditem/textballoons/doc/images/declarative-textballoons_example.png
new file mode 100644
index 0000000000..d572de597c
--- /dev/null
+++ b/examples/quick/painteditem/textballoons/doc/images/declarative-textballoons_example.png
Binary files differ
diff --git a/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc
index aeaf1cec1a..910072aee4 100644
--- a/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc
+++ b/examples/quick/painteditem/textballoons/doc/src/textballoons.qdoc
@@ -25,8 +25,82 @@
- \title QtQuick Examples - Painted Text Balloons
+ \title Scenegraph Painted Item Example
\example quick/painteditem/textballoons
- \brief This is a simple example that draws text balloons using QPainter
+ The Painted Item example shows how to use the QML Scene Graph framework to
+ implement custom scenegraph items using QPainter.
+ \image declarative-textballoons_example.png
+ The QQuickPaintedItem class is a class derived from QQuickItem for implementing
+ custom QML Scene Graph items using the QPainter interfaces.
+ The example consists of an item class, a plugin class and a QML file
+ to use this plugin. The \c TextBalloon class represents the individual
+ text balloons extending QQuickPaintedItem, the \c TextBalloonPlugin class
+ represents the skeleton code for a QtQuick plugin and the
+ \c textballoons.qml file is used to load the plugin and display the text
+ balloons.
+ We will focus on the \c TextBalloon class first and continue with the
+ \c textballoons.qml file. For an example on how to implement a QtQuick
+ plugin please look at \l{declarative/tutorials/extending/chapter6-plugins}
+ {Writing an Extension Plugin}
+ \section1 TextBalloon Class Declaration
+ The \c TextBalloon class inherits from QQuickPaintedItem. QQuickPaintedItem
+ is the base class for all QPainter based items in the QML Scene Graph
+ framework.
+ \snippet examples/quick/painteditem/textballoons/textballoon.h 0
+ To implement a QQuickPaintedItem you must implement QQuickPaintedIem's pure
+ virtual function \l {QQuickPaintedItem::}{paint()} which implements the
+ painting of the element.
+ \section1 TextBalloon Class Definition
+ We have to be sure to initialize the rightAligned property for a
+ TextBalloon item.
+ \snippet examples/quick/painteditem/textballoons/textballoon.cpp 0
+ Then we implement the \c paint() function which is automatically called by
+ the Scenegraph framework to paint the contents of the item. The function
+ paints the item in local coordinates.
+ \snippet examples/quick/painteditem/textballoons/textballoon.cpp 1
+ We start with setting the pen and brush on the item to define the look of
+ the item. After that we start drawing. Note that the \l {QQuickPaintedItem::}{boundingRect()}
+ item is called to draw depending on the size of the item. The rectangle
+ returned by the \l {QQuickPaintedItem::}{boundingRect()} function is the size
+ of the item as defined in the QML file.
+ \section1 textballoons.qml file
+ The Interface consists of two main parts. The scrollable area with the
+ textballoons and the controls button to add new balloons.
+ \section2 BalloonView
+ \snippet examples/quick/painteditem/textballoons/textballoons.qml 0
+ The balloonModel contains two elements at application start which will be
+ displayed by the balloonView. The balloonView alernates the TextBalloon
+ delegate items between left-aligned and right-aligned.
+ \section2 Controls
+ \snippet examples/quick/painteditem/textballoons/textballoons.qml 1
+ The controls part of the UI contains a rectangle with a MouseArea which
+ changes color when the mouse hovers over it. This control 'button' adds
+ a new element to the end of the model with a random width.
+ */