Merge branch '4.7' of git@scm.dev.nokia.troll.no:qt/oslo-staging-1 into 4.7

6 files changed, 617 insertions, 64 deletions

diff --git a/doc/src/examples/elasticnodes.qdoc b/doc/src/examples/elasticnodes.qdoc
index edc62d85c0..e6e6594156 100644
--- a/doc/src/examples/elasticnodes.qdoc
+++ b/doc/src/examples/elasticnodes.qdoc
@@ -83,7 +83,7 @@
     also reimplements \l{QGraphicsItem::shape()}{shape()} to ensure its hit
     area has an elliptic shape (as opposed to the default bounding rectangle).
 
-    For edge management purposes the node provides a simple API for adding
+    For edge management purposes, the node provides a simple API for adding
     edges to a node, and for listing all connected edges.
 
     The \l{QGraphicsItem::advance()}{advance()} reimplementation is called
@@ -126,16 +126,21 @@
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 2
 
-    The \e calculateForces() function implements the elastic forces effect that
-    pulls and pushes on nodes in the grid. In addition to this algorithm, the
-    user can move one node around with the mouse. Because we do not want the
-    two to interfere, we start by checking if this \c Node is the current mouse
-    grabber item (i.e., QGraphicsScene::mouseGrabberItem()). Because we need to
-    find all neighboring (but not necessarily connected) nodes, we also make
-    sure the item is part of a scene in the first place.
+    There are two ways to move a node. The \c calculateForces() function
+    implements the elastic effect that pulls and pushes on nodes in the grid.
+    In addition, the user can directly move one node around with the mouse.
+    Because we do not want the two approaches to operate at the same time on
+    the same node, we start \c calculateForces() by checking if this \c Node is
+    the current mouse grabber item (i.e., QGraphicsScene::mouseGrabberItem()).
+    Because we need to find all neighboring (but not necessarily connected)
+    nodes, we also make sure the item is part of a scene in the first place.
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 3
 
+    The "elastic" effect comes from an algorithm that applies pushing and
+    pulling forces. The effect is impressive, and surprisingly simple to
+    implement.
+
     The algorithm has two steps: the first is to calculate the forces that push
     the nodes apart, and the second is to subtract the forces that pull the
     nodes together. First we need to find all the nodes in the graph. We call
@@ -143,19 +148,20 @@
     qgraphicsitem_cast() to look for \c Node instances.
 
     We make use of \l{QGraphicsItem::mapFromItem()}{mapFromItem()} to create a
-    vector pointing from this node to each other node, in \l{The Graphics View
-    Coordinate System}{local coordinates}. We use the decomposed components of
-    this vector to determine the direction and strength of force that apply to
-    the node. The forces are added up for each node, and weighted so that the
-    closest nodes are given the strongest force. The sum of all forces are
-    stored in \e xvel (X-velocity) and \e yvel (Y-velocity).
+    temporary vector pointing from this node to each other node, in \l{The
+    Graphics View Coordinate System}{local coordinates}. We use the decomposed
+    components of this vector to determine the direction and strength of force
+    that should apply to the node. The forces accumulate for each node, and are
+    then adjusted so that the closest nodes are given the strongest force, with
+    rapid degradation when distance increases. The sum of all forces is stored
+    in \c xvel (X-velocity) and \c yvel (Y-velocity).
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 4
 
-    The edges between the nodes represent the forces that pull the nodes
-    together. By visiting each edge that is connected to this node, we can use
-    a similar approach as above to find the direction and strength of all
-    forces. These forces are subtracted from \e xvel and \e yvel.
+    The edges between the nodes represent forces that pull the nodes together.
+    By visiting each edge that is connected to this node, we can use a similar
+    approach as above to find the direction and strength of all pulling forces.
+    These forces are subtracted from \c xvel and \c yvel.
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 5
 
@@ -166,20 +172,20 @@
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 6
 
-    The final step of \e calculateForces() determines the node's new position.
+    The final step of \c calculateForces() determines the node's new position.
     We add the force to the node's current position. We also make sure the new
     position stays inside of our defined boundaries. We don't actually move the
-    item in this function; that's done in a separate step, from \e advance().
+    item in this function; that's done in a separate step, from \c advance().
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 7
 
-    The \e advance() function updates the item's current position. It is called
-    from \e GraphWidget::timerEvent(). If the node's position changed, the
+    The \c advance() function updates the item's current position. It is called
+    from \c GraphWidget::timerEvent(). If the node's position changed, the
     function returns true; otherwise false is returned.
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 8
 
-    The \e Node's bounding rectangle is a 20x20 sized rectangle centered around
+    The \c Node's bounding rectangle is a 20x20 sized rectangle centered around
     its origin (0, 0), adjusted by 2 units in all directions to compensate for
     the node's outline stroke, and by 3 units down and to the right to make
     room for a simple drop shadow.
@@ -188,8 +194,8 @@
 
     The shape is a simple ellipse. This ensures that you must click inside the
     node's elliptic shape in order to drag it around. You can test this effect
-    by running the example, and zooming far enough in so that the nodes become
-    very large. Without reimplementing \l{QGraphicsItem::shape()}{shape()}, the
+    by running the example, and zooming far in so that the nodes are very
+    large. Without reimplementing \l{QGraphicsItem::shape()}{shape()}, the
     item's hit area would be identical to its bounding rectangle (i.e.,
     rectangular).
 
@@ -197,7 +203,7 @@
 
     This function implements the node's painting. We start by drawing a simple
     dark gray elliptic drop shadow at (-7, -7), that is, (3, 3) units down and
-    to the right.
+    to the right from the top-left corner (-10, -10) of the ellipse.
 
     We then draw an ellipse with a radial gradient fill. This fill is either
     Qt::yellow to Qt::darkYellow when raised, or the opposite when sunken. In
@@ -217,8 +223,8 @@
     calculations.
 
     This notification is the only reason why the nodes need to keep a pointer
-    back to the \e GraphWidget. Another approach could be to provide such
-    notification using a signal; in such case, \e Node would need to inherit
+    back to the \c GraphWidget. Another approach could be to provide such
+    notification using a signal; in such case, \c Node would need to inherit
     from QGraphicsObject.
 
     \snippet examples/graphicsview/elasticnodes/node.cpp 12
@@ -226,14 +232,14 @@
     Because we have set the \l{QGraphicsItem::ItemIsMovable}{ItemIsMovable}
     flag, we don't need to implement the logic that moves the node according to
     mouse input; this is already provided for us. We still need to reimplement
-    the mouse press and release handlers though, to update the nodes' visual
+    the mouse press and release handlers, though, to update the nodes' visual
     appearance (i.e., sunken or raised).
 
     \section1 Edge Class Definition
 
-    The \e Edge class represents the arrow-lines between the nodes in this
+    The \c Edge class represents the arrow-lines between the nodes in this
     example. The class is very simple: it maintains a source- and destination
-    node pointer, and provides an \e adjust() function that makes sure the line
+    node pointer, and provides an \c adjust() function that makes sure the line
     starts at the position of the source, and ends at the position of the
     destination. The edges are the only items that change continuously as
     forces pull and push on the nodes.
@@ -242,13 +248,13 @@
 
     \snippet examples/graphicsview/elasticnodes/edge.h 0
 
-    \e Edge inherits from QGraphicsItem, as it's a simple class that has no use
+    \c Edge inherits from QGraphicsItem, as it's a simple class that has no use
     for signals, slots, and properties (compare to QGraphicsObject).
 
     The constructor takes two node pointers as input. Both pointers are
     mandatory in this example. We also provide get-functions for each node.
 
-    The \e adjust() function repositions the edge, and the item also implements
+    The \c adjust() function repositions the edge, and the item also implements
     \l{QGraphicsItem::boundingRect()}{boundingRect()} and
     \{QGraphicsItem::paint()}{paint()}.
 
@@ -256,7 +262,7 @@
 
     \snippet examples/graphicsview/elasticnodes/edge.cpp 0
 
-    The \e Edge constructor initializes its arrowSize data member to 10 units;
+    The \c Edge constructor initializes its \c arrowSize data member to 10 units;
     this determines the size of the arrow which is drawn in
     \l{QGraphicsItem::paint()}{paint()}.
 
@@ -265,7 +271,7 @@
     This ensures that the edge items are not considered for mouse input at all
     (i.e., you cannot click the edges). Then, the source and destination
     pointers are updated, this edge is registered with each node, and we call
-    \e adjust() to update this edge's start end end position.
+    \c adjust() to update this edge's start end end position.
 
     \snippet examples/graphicsview/elasticnodes/edge.cpp 1
 
@@ -274,7 +280,7 @@
 
     \snippet examples/graphicsview/elasticnodes/edge.cpp 2
 
-    In \e adjust(), we define two points: \e sourcePoint, and \e destPoint,
+    In \c adjust(), we define two points: \c sourcePoint, and \c destPoint,
     pointing at the source and destination nodes' origins respectively. Each
     point is calculated using \l{The Graphics View Coordinate System}{local
     coordinates}.
@@ -295,7 +301,7 @@
 
     It's important to notice that we call
     \l{QGraphicsItem::prepareGeometryChange()}{prepareGeometryChange()} in this
-    function. The reason is that the variables \e sourcePoint and \e destPoint
+    function. The reason is that the variables \c sourcePoint and \c destPoint
     are used directly when painting, and they are returned from the
     \l{QGraphicsItem::boundingRect()}{boundingRect()} reimplementation. We must
     always call
@@ -338,26 +344,26 @@
 
     \section1 GraphWidget Class Definition
 
-    \e GraphWidget is a subclass of QGraphicsView, which provides the main
+    \c GraphWidget is a subclass of QGraphicsView, which provides the main
     window with scrollbars.
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.h 0
 
-    It provides a basic constructor that initializes the scene, an \e
+    The class provides a basic constructor that initializes the scene, an \c
     itemMoved() function to notify changes in the scene's node graph, a few
     event handlers, a reimplementation of
     \l{QGraphicsView::drawBackground()}{drawBackground()}, and a helper
-    function for scaling the view by mouse or keyboard.
+    function for scaling the view by using the mouse wheel or keyboard.
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.cpp 0
 
-    \e GraphicsWidget's constructor creates the scene, and because most items
-    move around most of the time, it sets QGraphicsScene::NoIndex. Then the
-    scene gets a fixed \l{QGraphicsScene::sceneRect}{scene rectangle}.
-    The scene is then assigned to the \e GraphWidget view.
+    \c GraphicsWidget's constructor creates the scene, and because most items
+    move around most of the time, it sets QGraphicsScene::NoIndex. The scene
+    then gets a fixed \l{QGraphicsScene::sceneRect}{scene rectangle}, and is
+    assigned to the \c GraphWidget view.
 
     The view enables QGraphicsView::CacheBackground to cache rendering of its
-    static and somewhat complex background. Because the graph renders a close
+    static, and somewhat complex, background. Because the graph renders a close
     collection of small items that all move around, it's unnecessary for
     Graphics View to waste time finding accurate update regions, so we set the
     QGraphicsView::BoundingRectViewportUpdate viewport update mode. The default
@@ -381,15 +387,15 @@
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.cpp 2
 
-    \e GraphWidget is notified of node movement through this \e itemMoved()
+    \c GraphWidget is notified of node movement through this \c itemMoved()
     function. Its job is simply to restart the main timer in case it's not
     running already. The timer is designed to stop when the graph stabilizes,
     and start once it's unstable again.
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.cpp 3
 
-    This is \e GraphWidget's key event handler. The arrow keys move the center
-    node around, the '+' and '-' keys zoom in and out by calling \e
+    This is \c GraphWidget's key event handler. The arrow keys move the center
+    node around, the '+' and '-' keys zoom in and out by calling \c
     scaleView(), and the enter and space keys randomize the positions of the
     nodes. All other key events (e.g., page up and page down) are handled by
     QGraphicsView's default implementation.
@@ -398,16 +404,16 @@
 
     The timer event handler's job is to run the whole force calculation
     machinery as a smooth animation. Each time the timer is triggered, the
-    handler will find all nodes in the scene, and call \e
+    handler will find all nodes in the scene, and call \c
     Node::calculateForces() on each node, one at a time. Then, in a final step
-    it will call \e Node::advance() to move all nodes to their new positions.
-    By checking the return value of \e advance(), we can decide if the grid
+    it will call \c Node::advance() to move all nodes to their new positions.
+    By checking the return value of \c advance(), we can decide if the grid
     stabilized (i.e., no nodes moved). If so, we can stop the timer.
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.cpp 5
 
     In the wheel event handler, we convert the mouse wheel delta to a scale
-    factor, and pass this factor to \e scaleView(). This approach takes into
+    factor, and pass this factor to \c scaleView(). This approach takes into
     account the speed that the wheel is rolled. The faster you roll the mouse
     wheel, the faster the view will zoom.
 
@@ -415,24 +421,24 @@
 
     The view's background is rendered in a reimplementation of
     QGraphicsView::drawBackground(). We draw a large rectangle filled with a
-    linear gradient, with a drop shadow, and then render text in top. The text
-    is rendered twice to give a similar simple drop-shadow effect.
+    linear gradient, add a drop shadow, and then render text on top. The text
+    is rendered twice for a simple drop-shadow effect.
 
     This background rendering is quite expensive; this is why the view enables
     QGraphicsView::CacheBackground.
 
     \snippet examples/graphicsview/elasticnodes/graphwidget.cpp 7
 
-    The \e scaleView() helper function checks that the scale factor stays
+    The \c scaleView() helper function checks that the scale factor stays
     within certain limits (i.e., you cannot zoom too far in nor too far out),
-    and then applies this scale.
+    and then applies this scale to the view.
 
     \section1 The main() Function
 
-    In contrast to the complexity of the rest of this example, the \e main()
+    In contrast to the complexity of the rest of this example, the \c main()
     function is very simple: We create a QApplication instance, seed the
-    randomizer using qsrand(), and then create and show an instance of \e
-    GraphWidget. Because all nodes in the grid are moved initially, the \e
+    randomizer using qsrand(), and then create and show an instance of \c
+    GraphWidget. Because all nodes in the grid are moved initially, the \c
     GraphWidget timer will start immediately after control has returned to the
     event loop.
 */
diff --git a/doc/src/examples/fingerpaint.qdoc b/doc/src/examples/fingerpaint.qdoc
index e5eb4ef926..7eb1512d7b 100644
--- a/doc/src/examples/fingerpaint.qdoc
+++ b/doc/src/examples/fingerpaint.qdoc
@@ -46,5 +46,5 @@
     The Finger Paint example shows the use of multi-touch with a custom widget
     to create a simple painting application.
 
-    \image multitouch-fingerpaint.png
+    \image multitouch-fingerpaint-example.png
 */
diff --git a/doc/src/examples/padnavigator.qdoc b/doc/src/examples/padnavigator.qdoc
index 70e131ed6c..e29a3b2ee8 100644
--- a/doc/src/examples/padnavigator.qdoc
+++ b/doc/src/examples/padnavigator.qdoc
@@ -43,9 +43,555 @@
     \example graphicsview/padnavigator
     \title Pad Navigator Example
 
-    The Pad Navigator Example shows how you can use Graphics View
-    together with embedded widgets to create a simple but useful
-    dynamic user interface for embedded devices.
+    The Pad Navigator Example shows how you can use Graphics View together with
+    embedded widgets and Qt's \l{State Machine Framework} to create a simple
+    but useful, dynamic, animated user interface.
 
     \image padnavigator-example.png
+
+    The interface consists of a flippable, rotating pad with icons that can be
+    selected using the arrow keys on your keyboard or keypad. Pressing enter
+    will flip the pad around and reveal its back side, which has a form
+    embedded into a QGraphicsProxyWidget. You can interact with the form, and
+    press the enter key to flip back to the front side of the pad at any time.
+
+    Graphics View provides the QGraphicsScene class for managing and
+    interacting with a large number of custom-made 2D graphical items derived
+    from the QGraphicsItem class, and a QGraphicsView widget for visualizing
+    the items, with support for zooming and rotation.
+
+    This example consists of a \c RoundRectItem class, a \c FlippablePad class,
+    a \c PadNavigator class, a \c SplashItem class, and a \c main() function.
+
+    \section1 RoundRectItem Class Definition
+
+    The \c RoundRectItem class is used by itself to diplay the icons on the
+    pad, and as a base class for \c FlippablePad, the class for the pad itself.
+    The role of the class is to paint a round rectangle of a specified size and
+    gradient color, and optionally to paint a pixmap icon on top. To support \c
+    FlippablePad it also allows filling its contents with a plain window
+    background color.
+
+    Let's start by reviewing the \c RoundRectItem class declaration.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.h 0
+
+    \c RoundRectItem inherits QGraphicsObject, which makes it easy to control
+    its properties using QPropertyAnimation. Its constructor takes a rectangle
+    to determine its bounds, and a color.
+
+    Besides implementing the mandatory \l{QGraphicsItem::paint()}{paint()} and
+    \l{QGraphicsItem::boundingRect()}{boundingRect()} pure virtual functions,
+    it also provides the \c pixmap and \c fill properties.
+
+    The \c pixmap property sets an optional pixmap that is drawn on top of the
+    round rectangle. The \c fill property will, when true, fill the round
+    rectangle contents with a fixed QPalette::Window background color.
+    Otherwise the contents are filled using a gradient based on the color
+    passed to \c RoundRectItem's constructor.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.h 1
+
+    The private data members are:
+
+    \list
+    \o \c pix: The optional pixmap that is drawn on top of the rectangle.
+    \o \c fillRect: Corresponds to the \c fill property.
+    \o \c color: The configurable gradient color fill of the rectangle.
+    \o \c bounds: The bounds of the rectangle.
+    \o \c gradient: A precalculated gradient used to fill the rectangle.
+    \endlist
+
+    We will now review the \c RoundRectItem implementation. Let's start by
+    looking at its constructor:
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 0
+
+    The constructor initializes its member variables and forwards the \c parent
+    argument to QGraphicsObject's constructor. It then constructs the linear
+    gradient that is used in \l{QGraphicsItem::paint()}{paint()} to draw the
+    round rectangle's gradient background. The linear gradient's starting point
+    is at the top-left corner of the bounds, and the end is at the bottom-left
+    corner. The start color is identical to the color passed as an argument,
+    and a slightly darker color is chosen for the final stop.
+
+    We store this gradient as a member variable to avoid having to recreate the
+    gradient every time the item is repainted.
+
+    Finally we set the cache mode
+    \l{QGraphicsItem::ItemCoordinateCache}{ItemCoordinateCache}. This mode
+    causes the item's rendering to be cached into an off-screen pixmap that
+    remains persistent as we move and transform the item. This mode is ideal
+    for this example, and works particularily well with OpenGL and OpenGL ES.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 1
+
+    The \c pixmap property implementation simple returns the member pixmap, or
+    sets it and then calls \l{QGraphicsItem::update()}{update()}.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 2
+
+    As the \l{QGraphicsItem::paint()}{paint()} implementation below draws a
+    simple drop shadow down and to the right of the item, we return a slightly
+    adjusted rectangle from \l{QGraphicsItem::boundingRect()}{boundingRect()}.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 3
+
+    The \l{QGraphicsItem::paint()}{paint()} implementation starts by rendering
+    a semi transparent black round rectangle drop shadow, two units down and to
+    the right of the main item.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 4
+
+    We then draw the "foreground" round rectangle itself. The fill depends on
+    the \c fill property; if true, we will with a plain QPalette::Window color.
+    We get the corrent brush from QApplication::palette(). We assign a single
+    unit wide pen for the stroke, assign the brush, and then draw the
+    rectangle.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 5
+
+    If a pixmap has been assigned to the \e pixmap property, we draw this
+    pixmap in the center of the rectangle item. The pixmaps are scaled to match
+    the size of the icons; in arguably a better approach would have been to
+    store the icons with the right size in the first places.
+
+    \snippet examples/graphicsview/padnavigator/roundrectitem.cpp 6
+
+    Finally, for completeness we include the \c fill property implementation.
+    It returns the \c fill member variable's value, and when assigned to, it
+    calls \l{QGraphicsItem::update()}{update()}.
+
+    As mentioned already, \c RoundRectItem is the base class for \c
+    FlippablePad, which is the class representing the tilting pad itself. We
+    will proceed to reviewing \c FlippablePad.
+
+    \section1 FlippablePad Class Definition
+
+    \c FlippablePad is, in addition to its inherited \c RoundRectItem
+    responsibilities, responsible for creating and managing a grid of icons.
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.h 0
+
+    Its declaration is very simple: It inherits \c RoundRectItem and does not
+    need any special polymorphic behavior. It's suitable to declare its own
+    constructor, and a getter-function that allows \c PadNavigator to access
+    the icons in the grid by (row, column).
+
+    The example has no "real" behavior or logic of any kind, and because of
+    that, the icons do not need to provide any \e behavior or special
+    interactions management. In a real application, however, it would be
+    natural for the \c FlippablePad and its icons to handle more of the
+    navigation logic. In this example, we have chosen to leave this to
+    the \c PadNavigator class, which we will get back to below.
+
+    We will now review the \c FlippablePad implementation. This implementation
+    starts with two helper functions: \c boundsFromSize() and \c
+    posForLocation():
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 0
+
+    \c boundsForSize() takes a QSize argument, and returns the bounding
+    rectangle of the flippable pad item. The QSize determines how many rows and
+    columns the icon grid should have. Each icon is given 150x150 units of
+    space, and this determines the bounds.
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 1
+
+    \c posForLocation() returns the position of an icon given its row and
+    column position. Like \c boundsForSize(), the function assumes each icon is
+    given 150x150 units of space, and that all icons are centered around the
+    flippable pad item's origin (0, 0).
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 2
+
+    The \c FlippablePad constructor passes suitable bounds (using \c
+    boundsForSize()) and specific color to \c RoundRectItem's constructor.
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 3
+
+    It then loads pixmaps from compiled-in resources to use for its icons.
+    QDirIterator is very useful in this context, as it allows us to fetch all
+    resource "*.png" files inside the \c :/images directory without explicitly
+    naming the files.
+
+    We also make sure not to load more pixmaps than we need.
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 4
+
+    Now that we have the pixmaps, we can create icons, position then and assign
+    pixmaps. We start by finding a suitable size and color for the icons, and
+    initializing a convenient grid structure for storing the icons. This \c
+    iconGrid is also used later to find the icon for a specific (column, row)
+    location.
+
+    For each row and column in our grid, we proceed to constructing each icon
+    as an instance of \c RoundRectItem. The item is placed by using the \c
+    posForLocation() helper function. To make room for the slip-behind
+    selection item, we give each icon a \l{QGraphicsItem::zValue()}{Z-value} of
+    1. The pixmaps are distributed to the icons in round-robin fasion.
+
+    Again, this approach is only suitable for example purposes. In a real-life
+    application where each icon represents a specific action, it would be more
+    natural to assign the pixmaps directly, or that the icons themselves
+    provide suitable pixmaps.
+
+    \snippet examples/graphicsview/padnavigator/flippablepad.cpp 5
+
+    Finally, the \c iconAt() function returns a pointer to the icon at a
+    specific row and column. It makes a somewhat bold assumption that the input
+    is valid, which is fair because the \c PadNavigator class only calls this
+    function with correct input.
+
+    We will now review the \c SplashItem class.
+
+    \section1 SplashItem Class Definition
+
+    The \c SplashItem class represents the "splash window", a semitransparent
+    white overlay with text that appears immediately after the application has
+    started, and disappears after pressing any key. The animation is controlled
+    by \c PadNavigator; this class is very simple by itself.
+
+    \snippet examples/graphicsview/padnavigator/splashitem.h 0
+
+    The class declaration shows that \c SplashItem inherits QGraphicsObject to
+    allow it to be controlled by QPropertyAnimation. It reimplements the
+    mandatory \l{QGraphicsItem::paint()}{paint()} and
+    \l{QGraphicsItem::boundingRect()}{boundingRect()} pure virtual functions,
+    and keeps a \c text member variable which will contain the information text
+    displayed on this splash item.
+
+    Let's look at its implementation.
+
+    \snippet examples/graphicsview/padnavigator/splashitem.cpp 0
+
+    The constructor forwards to QGraphicsObject as expected, assigns a text
+    message to the \c text member variable, and enables
+    \l{QGraphicsItem::DeviceCoordinateCache}{DeviceCoordinateCache}. This cache
+    mode is suitable because the splash item only moves and is never
+    transformed, and because it contains text, it's important that it has a
+    pixel perfect visual appearance (in constrast to
+    \l{QGraphicsItem::ItemCoordinateCache}{ItemCoordinateCache}, where the
+    visual appearance is not as good).
+
+    We use caching to avoid having to relayout and rerender the text for each
+    frame. An alterative approach would be to use the new QStaticText class.
+
+    \snippet examples/graphicsview/padnavigator/splashitem.cpp 1
+
+    \c SplashItem's bounding rectangle is fixed at (400x175).
+
+    \snippet examples/graphicsview/padnavigator/splashitem.cpp 2
+
+    The \l{QGraphicsItem::paint()}{paint()} implementation draws a clipped
+    round rectangle with a thick 2-unit border and a semi-transparent white
+    background. It proceeds to finding a suitable text area by adjusting the
+    splash item's bounding rectangle with 10 units in each side. The text is
+    rendered inside this rectangle, with top-left alignment, and with word
+    wrapping enabled.
+
+    The main class now remains. We will proceed to reviewing \c PadNavigator.
+
+    \section1 PadNavigator Class Definition
+
+    \c PadNavigator represents the main window of our Pad Navigator Example
+    application. It creates and controls a somewhat complex state machine, and
+    several animations. Its class declaration is very simple:
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.h 0
+
+    It inherits QGraphicsView and reimplements only one function:
+    \l{QGraphicsView::resizeEvent()}{resizeEvent()}, to ensure the scene is
+    scaled to fit inside the view when resizing the main window.
+
+    The \c PadNavigator constructor takes a QSize argument that determines the
+    number or rows and columns in the grid.
+
+    It also keeps a private member instance, \c form, which is the generated
+    code for the pad's back side item's QGraphicsProxyWidget-embedded form.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 0
+
+    \c PadNavigator's constructor is a bit long. In short, its job is to create
+    all items, including the \c FlippablePad, the \c SplashItem and the
+    QGraphicsProxyWidget \c backItem, and then to set up all animations, states
+    and transitions that control the behavior of the application.
+
+    It starts out simple, by forwarding to QGraphicsView's constructor.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 1
+
+    The first item to be created is \c SplashItem. This is going to be a top-level
+    item in the scene, next to \c FlippablePad, and stacked on top of it, so we
+    assign it a \l{QGraphicsItem::zValue()}{Z-value} of 1.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 2
+
+    Now we construct the \c FlippablePad item, passing its column-row count to
+    its constructor.
+
+    The pad is constrolled by three transformations, and we create one
+    QGraphicsRotation object for each of these.
+
+    \list
+    \o \c flipRotation: Rotates the grid around its Qt::YAxis. This rotation is
+    animated from 0 to 180, and eventually back, when enter is pressed on the
+    keyboard, flipping the pad around.
+    \o \c xRotation: Rotates the grid around its Qt::XAxis. This is used to
+    tilt the pad vertically corresponding to which item is currently selected.
+    This way, the selected item is always kept in front.
+    \o \c yRotation: Rotates the grid around its Qt::YAxis. This is used to
+    tilt the pad horizontally corresponding to which item is selected. This
+    way, the selected item is always kept in front.
+    \endlist
+
+    The combination of all three rotations is assigned via
+    QGraphicsItem::setTransformations().
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 3
+
+    Now we construct the QGraphicsProxyWidget-embedded \c backItem. The proxy
+    widget is created as a child of the pad. We create a new QWidget and
+    populate it with the \c form member. To ensure the \c hostName line edit is
+    the first to receive input focus when this item is shown, we call
+    \l{QWidget::setFocus()}{setFocus()} immediately. This will not give the
+    widget focus right away; it will only prepare the item to automatically
+    receive focus once it is shown.
+
+    The QWidget based form is embedded into the proxy widget. The proxy is
+    hidden initially; we only want to show it when the pad is rotated at least
+    90 degrees, and we also rotate the proxy itself by 180 degrees. This way we
+    give the impression that the proxy widget is "behind" the flipped pad, when
+    in fact, it's actually \e{on top of it}.
+
+    We enable \l{QGraphicsItem::ItemCoordinateCache}{ItemCoordinateCache} to
+    ensure the flip animation can run smoothly.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 4
+
+    We now create the selection item. This is simply another instance of \c
+    RoundRectItem that is slightly larger than the icons on the pad. We create
+    it as an immediate child of the \c FlippablePad, so the selection item is a
+    sibling to all the icons. By giving it a
+    \l{QGraphicsItem::zValue()}{Z-value} of 0.5 we ensure it will slide beteen
+    the pad and its icons.
+
+    What follows now is a series of animation initializations.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 5
+
+    We begin with the animations that apply to the splash item. The first
+    animation, \c smoothSplashMove, ensures that the "y" property of \c splash
+    will be animated with a 250-millisecond duration
+    \l{QEasingCurve::InQuad}{InQuad} easing function. \c smoothSplashOpacity
+    ensures the opacity of \c splash eases in and out in 250 milliseconds.
+
+    The values are assigned by \c PadNavigator's state machine, which is
+    created later.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 6
+
+    These are the animations that control the selection item's movement and the
+    \c xRotation and \c yRotation QGraphicsRotation objects that tilt the pad.
+    All animations have a duration of 125 milliseconds, and they all use the
+    \l{QEasingCurve::InOutQuad}{InOutQuad} easing function.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 7
+
+    We now create the animations that control the flip-effect when you press
+    the enter key. The main goal is to rotate the pad by 180 degrees or back,
+    but we also need to make sure the selection item's tilt rotations are reset
+    back to 0 when the pad is flipped, and restored back to their original
+    values when flipped back:
+
+    \list
+    \o \c smoothFlipRotation: Animates the main 180 degree rotation of the pad.
+    \o \c smoothFlipScale: Scales the pad out and then in again while the pad is rotating.
+    \o \c smoothFlipXRotation: Animates the selection item's X-tilt to 0 and back.
+    \o \c smoothFlipYRotation: Animates the selection item's Y-tilt to 0 and back.
+    \o \c flipAnimation: A parallel animation group that ensures all the above animations are run in parallel.
+    \endlist
+
+    All animations are given a 500 millisecond duration and an
+    \l{QEasingCurve::InOutQuad}{InOutQuad} easing function.
+
+    It's worth taking a close look at \c smoothFlipScale. This animation's
+    start and end values are both 1.0, but at animation step 0.5 the
+    animation's value is 0.7. This means that after 50% of the animation's
+    duration, or 250 milliseconds, the pad will be scaled down to 0.7x of its
+    original size, which gives a great visual effect while flipping.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 8
+
+    This section uses a trick to ensure that certain properties are assigned
+    precisely when the flip animation passes 50%, or 90 degrees, rotation. In
+    short, the pad's icons and selection item are all hidden, the pad's \c fill
+    property is enabled, and \c backItem is shown when flipping over. When
+    flipping back, the reverse properties are applied.
+
+    The way this is achieved is by running a sequential animation in parallel
+    to the other animations. This sequence, dubbed \c setVariablesSequence,
+    starts with a 250 millisecond pause, and then executes several animations
+    with a duration of 0. Each animation will ensure that properties are set
+    immediate at this point.
+
+    This approach can also be used to call functions or set any other
+    properties at a specific time while an animation is running.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 9
+
+    We will now create the state machine. The whole \c PadNavigator state
+    machinery is controlled by one single state machine that has a
+    straight-forward state structure. The state engine itself is created
+    as a child of the \c PadNavigator itself. We then create three top level
+    states:
+
+    \list
+    \o \c splashState: The initial state where the splash item is visible.
+    \o \c frontState: The base state where the splash is gone and we can see
+    the front side of the pad, and navigate the selection item.
+    \o \c backState: The flipped state where the \c backItem is visible, and we
+    can interact with the QGraphicsProxyWidget-embedded form.
+    \endlist
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 10
+
+    Each state assigns specific properties to objects on entry. Most
+    interesting perhaps is the assignment of the value 0.0 to the pad's \c
+    flipRotation angle property when in \c frontState, and 180.0 when in \c
+    backState. At the end of this section we register default animations with
+    the state engine; these animations will apply to their respective objects
+    and properties for any state transition. Otherwise it's common to assign
+    animations to specific transitions.
+
+    The \c splashState state is set as the initial state. This is required
+    before we start the state engine. We proceed with creating some
+    transitions.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 11
+
+    QEventTransition defines a very flexible transition type. You can use this
+    class to trigger a transition based on an object receiving an event of a
+    specific type. In this case, we would like to transition from \c
+    splashState into \c frontState if \c PadNavigator receives any key press
+    event (QEvent::KeyPress).
+
+    We register the \c splashItem's animations to this transition to ensure they
+    are used to animate the item's movement and opacity.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 12
+
+    We use QKeyEventTransition to capture specific key events. In this case, we
+    detect that the user presses Qt::Key_Return or Qt::Key_Enter, and use this
+    to trigger transitions between \c frontState and backState. We register \c
+    flipAnimation, our complex parallel animation group, with these
+    transitions.
+
+    We continue by defining the states for each of the icons in the grid.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 13
+
+    We will use state groups to control transitions between icons. Each icon
+    represents a \e substate of \c frontState. We will then define transitions
+    between the states by detecting key presses, using QKeyEventTransition.
+
+    We start by creating all the substates, and at the same time we create a
+    temporary grid structure for the states to make it easier to find which
+    states represents icons that are up, down, left and to the right each
+    other.
+
+    Once the first substate is known, we set this up as the initial substate of
+    \c frontState. We will use the (0, 0), or top-left, icon for the initial
+    substate. We initialze the selection item's position to be exactly where
+    the top-left icon is.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 14
+
+    We can now create four transitions for each icon. Each transition ensures
+    that we move to the state corresponding to which arrow key has been
+    pressed. It's clear from this techinique that we could design any other
+    specific transitions to and from each of the sub states depending on these
+    and other keys.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 15
+
+    Also, for each of the icons, we assign suitable values to the \c xRotation
+    and \c yRotation objects' "angle"-properties. If you recall, these
+    properties "tilt" the pad corresponding to which item is currently
+    selected. We ensure each icon is invisible when the pad is flipped, and
+    visible when the pad is not flipped. To ensure the visible property is
+    assigned at the right time, we add property-controlling animations to the
+    \c setVariableSequence animation defined earlier.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 16
+
+    We are now finished with all states, transitions, and animations. We now
+    create the scene that will contain all our items. The scene gets a defined
+    background pixmap, and we disable item indexing (as most items in this
+    scene are animated). We add our \c pad item to the scene, and use its
+    bounding rectangle to fixate the scene rectangle. This rectangle is used by
+    the view to find a suitable size for the application window.
+
+    Then the scene is assigned to the view, or in our case, \c PadNavigator
+    itself.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 17
+
+    Now that the scene has received its final size, we can position the splash
+    item at the very top, find its fade-out position, and add it to the scene.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 18
+
+    The view toggles a few necessary properties:
+
+    \list
+    \o It disables its scroll bars - this application has no use for scroll bars.
+    \o It assigns a minimum size. This is necessary to avoid numerical errors
+    in our fit-in-view \c resizeEvent() implementation.
+    \o It sets \l{QGraphicsView::FullViewportUpdate}{FullViewportUpdate}, to
+    ensure QGraphicsView doesn't spend time figuring out precisely what needs
+    to be redrawn. This application is very simple - if anything changes,
+    everything is updated.
+    \o It enables background caching - this makes no performance difference
+    with OpenGL, but without OpenGL it avoids unnecessary re-scaling of the
+    background pixmap.
+    \o It sets render hints that increase rendering quality.
+    \o If OpenGL is supported, a QGLWidget viewport is assigned to the view.
+    \endlist
+
+    Finally, we start the state engine.
+
+    \snippet examples/graphicsview/padnavigator/padnavigator.cpp 19
+
+    The \l{QGraphicsView::resizeEvent()}{resizeEvent()} implementation calls
+    the base implementation, and then calls QGraphicsView::fitInView() to scale
+    the scene so that it fits perfectly inside the view.
+
+    By resizing the main application window, you can see this effect yourself.
+    The scene contents grow when you make the window larger, and shrink when
+    you make it smaller, while keeping the aspect ratio intact.
+
+    \section1 The main() Function
+
+    \snippet examples/graphicsview/padnavigator/main.cpp 0
+
+    The \c main function creates the QApplication instance, uses
+    Q_INIT_RESOURCE to ensure our compiled-in resources aren't removed by the
+    linker, and then creates a 3x3 \c PadNavigator instance and shows it.
+
+    Our flippable pad shows up with a suitable splash item once control returns
+    to the event loop.
+
+    \section1 Performance Notes
+
+    The example uses OpenGL if this is available, to achieve optimal
+    performance; otherwise perspective tranformations can be quite costly.
+
+    Although this example does use QGraphicsProxyWidget to demonstrate
+    integration of Qt widget components integrated into Graphics View, using
+    QGraphicsProxyWidget comes with a performance penalty, and is therefore not
+    recommended for embedded development.
+
+    This example uses extensive item caching to avoid rerendering of static
+    elements, at the expense of graphics memory.
 */
diff --git a/doc/src/examples/pinchzoom.qdoc b/doc/src/examples/pinchzoom.qdoc
index 726b1b3311..867b2b3a8a 100644
--- a/doc/src/examples/pinchzoom.qdoc
+++ b/doc/src/examples/pinchzoom.qdoc
@@ -46,5 +46,5 @@
     The Pinch Zoom example shows how to use low-level multi-touch information
     to recognize a gesture.
 
-    \image multitouch-pinchzoom.png
+    \image multitouch-pinchzoom-example.png
 */
diff --git a/doc/src/getting-started/examples.qdoc b/doc/src/getting-started/examples.qdoc
index 400714f4de..2e7f47eed9 100644
--- a/doc/src/getting-started/examples.qdoc
+++ b/doc/src/getting-started/examples.qdoc
@@ -696,6 +696,7 @@
     \o \l{graphicsview/diagramscene}{Diagram Scene}\raisedaster
     \o \l{graphicsview/dragdroprobot}{Drag and Drop Robot}\raisedaster
     \o \l{graphicsview/elasticnodes}{Elastic Nodes}\raisedaster
+    \o \l{graphicsview/padnavigator}{Pad Navigator}\raisedaster
     \o \l{graphicsview/portedasteroids}{Ported Asteroids}
     \o \l{graphicsview/portedcanvas}{Ported Canvas}
     \endlist
diff --git a/doc/src/images/multitouch-fingerpaint-example.png b/doc/src/images/multitouch-fingerpaint-example.png
new file mode 100644
index 0000000000..c741b65526
--- /dev/null
+++ b/doc/src/images/multitouch-fingerpaint-example.png