Docs - add missing images and code, clean up sections

Includes the removal of concepts/modelviewsdata/localstorage.qdoc
since that is a duplicate of the existing Local Storage module docs.

Also removes classes from whatsnew.qdoc that are internal.

Change-Id: I4170c1797bbec09bb67784b0b2ad67fd990365a8
Reviewed-by: Andrew den Exter <andrew.den-exter@nokia.com>

1 files changed, 36 insertions, 16 deletions

diff --git a/src/quick/doc/snippets/qml/usecases/layouts.qml b/src/quick/doc/snippets/qml/usecases/layouts.qml
index 0099cdf319..4d1e7478a0 100644
--- a/src/quick/doc/snippets/qml/usecases/layouts.qml
+++ b/src/quick/doc/snippets/qml/usecases/layouts.qml
@@ -38,18 +38,16 @@
 **
 ****************************************************************************/
 
-//![0]
+//![import]
 import QtQuick 2.0
 
-Item {
-    width: 320
-    height: 480
+//![import]
 
-    Rectangle {
-        color: "#272822"
-        width: 320
-        height: 480
-    }
+Column {
+
+//![direct]
+Item {
+    width: 100; height: 100
 
     Rectangle {
         // Manually positioned at 20,20
@@ -59,32 +57,53 @@ Item {
         height: 80
         color: "red"
     }
+}
+//![direct]
+
+//![anchors]
+Item {
+    width: 200; height: 200
+
     Rectangle {
         // Anchored to 20px off the top right corner of the parent
         anchors.right: parent.right
         anchors.top: parent.top
         anchors.margins: 20 // Sets all margins at once
+
         width: 80
         height: 80
-        color: "blue"
+        color: "orange"
     }
+
     Rectangle {
-        // Anchored to 20px off the top center corner of the parent
-        // Note the different group property syntax to the previous Rectangle. Both are valid.
+        // Anchored to 20px off the top center corner of the parent.
+        // Notice the different group property syntax for 'anchors' compared to
+        // the previous Rectangle. Both are valid.
         anchors { horizontalCenter: parent.horizontalCenter; top: parent.top; topMargin: 20 }
+
         width: 80
         height: 80
         color: "green"
     }
+}
+//![anchors]
 
-    Row { // Lays the Rectangles out in a line
-        x: 20
-        y: 120
+//![positioners]
+Item {
+    width: 300; height: 100
+
+    Row { // The "Row" type lays out its child items in a horizontal line
         spacing: 20 // Places 20px of space between items
+
         Rectangle { width: 80; height: 80; color: "red" }
         Rectangle { width: 80; height: 80; color: "green" }
         Rectangle { width: 80; height: 80; color: "blue" }
     }
+}
+//![positioners]
+
+Item {
+    width: 300; height: 400
 
     Rectangle {
         id: middleRect
@@ -119,4 +138,5 @@ Item {
         color: "blue"
     }
 }
-//![0]
+
+}