Doc: Describe changes in the Qt Quick Designer UI

The canvas area now contains Form Editor and Text Editor tabs.
Further, the Properties view can be split to show any view, so
there are now two sidebars.

Change-Id: Ib921a806178606a76d584440e2308d504a297fcb
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>

1 files changed, 36 insertions, 27 deletions

diff --git a/doc/src/qtquick/qtquick-designer.qdoc b/doc/src/qtquick/qtquick-designer.qdoc
index ac71be0911..edcf18a9c7 100644
--- a/doc/src/qtquick/qtquick-designer.qdoc
+++ b/doc/src/qtquick/qtquick-designer.qdoc
@@ -38,49 +38,57 @@
     \title Using Qt Quick Designer
 
     You can edit \l{Qt Quick UI Forms} (ui.qml files) in \QMLD. \QC opens the
-    UI forms in the \uicontrol Design mode. It is recommended that you use UI forms
-    for components that you want to design in \QMLD.
+    UI forms in the \uicontrol {Form Editor} tab in the \uicontrol Design mode.
+    It is recommended that you use UI forms for components that you want to
+    design in \QMLD.
 
     \image qmldesigner-visual-editor.png "Visual editor"
 
-    Use the visual editor to manage your project:
+    Use \QMLD to manage your project:
 
     \list
 
-        \li Use the sidebar to select QML types to use in the project and to
+        \li \uicontrol Canvas (1) is the working area where you create QML
+            components and design applications. In the \uicontrol {Form Editor}
+            tab, you can use a visual editor to design UIs, and in the
+            \uicontrol {Text Editor} tab, you can use a code editor to edit the
+            QML code generated by the visual editor.
+
+        \li Use the sidebars to select QML types to use in the project, to
+            specify properties for them, and to
             view them in a tree structure, as well as to create connections
             and browse projects and files. You can select the content of the
-            sidebar in the sidebar menu:
+            sidebars in the sidebar menu:
 
         \list
 
-            \li \uicontrol {Navigator} (1) displays the items in the current QML
-                file as tree structure.
-
-            \li \uicontrol {Library} (2) displays the building blocks that you can use
-                to design applications: predefined QML types, your own QML
-                components, Qt Quick components or Qt Quick Controls 2 that you
-                import to the project, and other resources.
+            \li \uicontrol {Library} (2) displays the building blocks that you
+                can use to design applications: predefined QML types, your own
+                QML components, or Qt Quick Controls 2 that you import to the
+                project, and other resources.
 
-            \li \uicontrol Connections (3) enables you to create connections between
-                objects, signals, and object properties. For
-                more information, see \l{Adding Connections}.
+            \li \uicontrol {Navigator} (3) displays the items in the current QML
+                file as a tree structure.
 
-            \li \uicontrol {Projects} shows a list of projects open in the current
-                session. For more information, see \l{Viewing Project Files}.
+            \li \uicontrol {Properties} (4) organizes the properties of the
+                selected item. You can change the properties also in the
+                \uicontrol {Text Editor}.
 
-            \li \uicontrol {File System} shows all files in the currently selected
-                directory. For more information, see \l{Viewing the File System}.
+            \li \uicontrol Connections (5) enables you to create connections
+                between objects, signals, and object properties. For more
+                information, see \l{Adding Connections}.
 
-            \li \uicontrol {Open Documents} sidebar view shows currently open files.
+            \li \uicontrol {File System} shows all files in the currently
+                selected directory. For more information, see
+                \l{Viewing the File System}.
 
-        \endlist
+            \li \uicontrol {Open Documents} shows currently open files.
 
-        \li \uicontrol Canvas (4) is the working area where you create QML components and
-            design applications.
+            \li \uicontrol {Projects} shows a list of projects open in the
+                current session. For more information, see
+                \l{Viewing Project Files}.
 
-        \li \uicontrol {Properties} pane (5) organizes the properties of the selected item.
-            You can change the properties also in the code editor.
+        \endlist
 
         \li \uicontrol {State} pane (6) displays the different states of the item.
             QML states typically describe user interface configurations, such as
@@ -132,7 +140,7 @@
 
     To view lists of files or projects, instead, select \uicontrol {File System},
     \uicontrol {Open Documents}, or \uicontrol Projects in the menu.
-    To view several types of content at a time, split the sidebar by clicking
+    To view several types of content at a time, split the sidebars by clicking
     the \inlineimage splitbutton_horizontal.png
     (\uicontrol Split) button.
 
@@ -492,7 +500,8 @@
     bindings.
 
     To experiment with different component sizes, enter values in the
-    \uicontrol Height and \uicontrol Width fields (1) on the canvas toolbar. The changes are
+    \uicontrol {Override Width} and \uicontrol {Override Height} fields (1) on
+    the canvas toolbar. The changes are
     displayed in the \uicontrol State pane (2) and on the canvas (3), but the property
     values are not changed permanently in the QML file. You can permanently
     change the property values in the \uicontrol Properties pane (4).