Improve Drawer docs

- Add a complete example of pushing the contents by applying
  a translation transformation.
- In the popup group docs, use the "expanded" wireframe where
  the drawer is actually visible.
- Add a note about system gestures on some platforms.

Change-Id: Ice8285c8bed99ebfafca5aea7032621b770f3645
Reviewed-by: Mitch Curtis <mitch.curtis@theqtcompany.com>

1 files changed, 31 insertions, 2 deletions

diff --git a/src/quicktemplates2/qquickdrawer.cpp b/src/quicktemplates2/qquickdrawer.cpp
index 3cb89363..e08bb278 100644
--- a/src/quicktemplates2/qquickdrawer.cpp
+++ b/src/quicktemplates2/qquickdrawer.cpp
@@ -74,14 +74,43 @@ QT_BEGIN_NAMESPACE
     screen. This is achieved by applying a translation to the contents:
 
     \code
-    transform: Translate {
-        x: (1.0 - drawer.position) * listview.width
+    import QtQuick 2.7
+    import QtQuick.Controls 2.0
+
+    ApplicationWindow {
+        id: window
+        width: 200
+        height: 228
+        visible: true
+
+        Drawer {
+            id: drawer
+            width: 0.66 * window.width
+            height: window.height
+        }
+
+        Label {
+            id: content
+
+            text: "Aa"
+            font.pixelSize: 96
+            anchors.fill: parent
+            verticalAlignment: Label.AlignVCenter
+            horizontalAlignment: Label.AlignHCenter
+
+            transform: Translate {
+                x: drawer.position * content.width * 0.33
+            }
+        }
     }
     \endcode
 
     If you would like the application's contents to stay where they are when
     the drawer is opened, don't apply a translation.
 
+    \note On some platforms, certain edges may be reserved for system
+    gestures and therefore cannot be used with Drawer.
+
     \sa SwipeView, {Customizing Drawer}, {Navigation Controls}, {Popup Controls}
 */