Doc: Show the User Interface topic in Qt Design Studio Manual

The topic was added to the Getting Started section, so the
navigation links were changed.

Also, the topic that describes the Design mode was moved to
Getting Started.

There is a respective change in the Qt Design Studio repository.

Change-Id: I5b9d85e06be089924fccba8264a669eaeb258249
Reviewed-by: Brook Cronin <brook.cronin@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

doc/src/editors/creator-coding-edit-mode.qdoc

@@ -261,11 +261,4 @@
     correct paths for includes that are not resolved or that are resolved to the
     wrong file, select \uicontrol {Project Parts} > \uicontrol {Header Paths}.
     \endif
-
-    \if defined(qtdesignstudio)
-    \include creator-sidebar-views.qdocinc using sidebar views
-    \include creator-sidebar-views.qdocinc projects view
-    \include creator-sidebar-views.qdocinc file system view
-    \include creator-sidebar-views.qdocinc outline view
-    \endif
 */

doc/src/howto/creator-ui.qdoc

@@ -31,9 +31,14 @@
 
 /*!
     \contentspage index.html
-    \previouspage creator-overview.html
     \page creator-quick-tour.html
+    \if defined(qtdesignstudio)
+    \previouspage qtbridge-ps-using.html
+    \nextpage creator-using-qt-quick-designer.html
+    \else
+    \previouspage creator-overview.html
     \nextpage creator-configuring.html
+    \endif
 
     \title User Interface
 
@@ -53,20 +58,32 @@
 
     \endlist
 
+    \if defined(qtcreator)
     \image qtcreator-breakdown.png
+    \else
+    \image studio-welcome-mode.png
+    \endif
 
     You can use the mode selector (1) to change to another \QC mode.
 
+    \if defined(qtcreator)
     You can use the kit selector (2) to select the
     \l{glossary-buildandrun-kit}{kit} for running (3), debugging (4), or
     building (5) the application. Output from these actions is displayed in the
     output panes (7).
+    \else
+    You can use the kit selector (2) to select the \l{glossary-buildandrun-kit}
+    {kit} for running (3) or debugging (4) the application. Output from these
+    actions is displayed in the output panes (5).
+    \endif
 
-    You can use the locator (6) to to browse through projects, files, classes,
+    You can use the locator (6) to browse through projects, files, classes,
     functions, documentation, and file systems.
 
+    \if defined(qtcreator)
     For a quick tour of the user interface that takes you to the locations of
     these controls, select \uicontrol Help > \uicontrol {UI Tour}.
+    \endif
 
     \section1 Modes
 
@@ -84,7 +101,11 @@
     The following image displays an example application in \uicontrol Edit mode (1)
     and \uicontrol Design mode (2).
 
+    \if defined(qtcreator)
     \image qtcreator-qt-quick-editors.png "Edit mode and Design mode"
+    \else
+    \image studio-editors.png "Edit mode and Design mode"
+    \endif
 
     You can use \QC in the following modes:
 
@@ -95,19 +116,29 @@
         \li \uicontrol{\l{Coding}{Edit}} mode for editing project and source
             files.
 
-        \li \uicontrol{\l{Designing User Interfaces}{Design}} mode for designing and
+        \if defined(qtcreator)
-            developing application user interfaces. This mode is available for
+        \li \uicontrol{\l{Designing User Interfaces}{Design}}
-            UI files.
+        \else
+        \li \uicontrol{\l{Editing QML Files in Design Mode}{Design}}
+        \endif
+            mode for designing and developing application user interfaces.
+            This mode is available for UI files.
 
         \li \uicontrol{\l{Debugging}{Debug}} mode for inspecting the state of your
             application while debugging and for using code analysis tools
             to detect memory leaks and profile C++ or QML code.
 
-        \li \uicontrol{\l{Specifying Build Settings}{Projects}} mode for configuring
+        \if defined(qtcreator)
-            project building and execution. This mode is available when a
+        \li \uicontrol{\l{Specifying Build Settings}{Projects}} mode
-            project is open.
+            for configuring project building and execution.
+        \else
+        \li \uicontrol{\l{Selecting the Preview Tool}{Projects}} mode
+            for selecting the tool to use for live preview.
+        \endif
+            This mode is available when a project is open.
 
-        \li \uicontrol{\l{Getting Help}{Help}} mode for viewing Qt documentation.
+        \li \uicontrol{\l{Using the Help Mode}{Help}} mode for viewing Qt
+            documentation.
 
     \endlist
 
@@ -119,9 +150,11 @@
     \include creator-sidebar-views.qdocinc projects view
     \include creator-sidebar-views.qdocinc file system view
     \include creator-sidebar-views.qdocinc outline view
+    \if defined(qtcreator)
     \include creator-sidebar-views.qdocinc class view
     \include creator-sidebar-views.qdocinc type hierarchy view
     \include creator-sidebar-views.qdocinc include hierarchy view
+    \endif
 
     \section1 Viewing Output
 
@@ -139,14 +172,16 @@
 
        \li \uicontrol {QML Debugger Console}
 
-       \li \uicontrol {To-Do Entries}
+       \li \uicontrol{General Messages}
 
        \li \uicontrol{Version Control}
 
-       \li \uicontrol{General Messages}
+       \if defined(qtcreator)
-
        \li \uicontrol{Test Results}
 
+       \li \uicontrol {To-Do Entries}
+       \endif
+
     \endlist
 
     Output panes are available in all \l{Modes}{modes}. Click the name of an
@@ -159,10 +194,16 @@
     up in the pane. In these panes, you can also use the zoom buttons to increase and
     decrease the text size of the output.
 
-    To open the \uicontrol{General Messages} and \l{Using Version Control Systems}
+    To open the \uicontrol{General Messages} and
-    {Version Control} panes, select
+    \if defined(qtcreator)
-    \uicontrol {Window > Output Panes}. To display the \uicontrol {To-Do Entries} pane,
+    \l{Using Version Control Systems}{Version Control}
-    enable the Todo plugin.
+    \else
+    \l{Using Git}{Version Control}
+    \endif
+     panes, select \uicontrol {Window > Output Panes}.
+    \if defined(qtcreator)
+    To display the \uicontrol {To-Do Entries} pane, enable the Todo plugin.
+    \endif
 
     For more information about the \uicontrol {QML Debugger Console} view, see
     \l{Executing JavaScript Expressions}.
@@ -173,12 +214,19 @@
 
     \list
 
+        \if defined(qtdesignstudio)
+        \li \uicontrol {Asset Importer Error} - Errors and warnings encountered
+            while importing assets from a design tool.
+        \endif
+
         \li \uicontrol {Build System} - Errors and warnings encountered during a
             build.
 
+        \if defined(qtcreator)
         \li \uicontrol {Clang Code Model} -
             \l {Parsing C++ Files with the Clang Code Model}
             {Errors and warnings from the current editor}.
+        \endif
 
         \li \uicontrol Compile - Selected output from the compiler. Open the
             \uicontrol {Compile Output} pane for more detailed information.
@@ -186,8 +234,10 @@
        \li \uicontrol{Debug Information} - Lists debug information packages that might
             be missing.
 
+        \if defined(qtcreator)
         \li \uicontrol Debugger - Errors encountered while running the
             \l{Analyzing Code}{Valgrind code analysis tools}.
+        \endif
 
        \li \uicontrol{Debugger Runtime} - Errors encountered when starting \QC. For
             example, information about missing DLLs.
@@ -195,11 +245,13 @@
        \li \uicontrol Deployment - Errors encountered between building an application
             successfully and starting it on a \l{glossary-device}{device}.
 
+        \if defined(qtcreator)
         \li \uicontrol {My Tasks} - Entries from a task list file (.tasks) generated
             by \l{Showing Task List Files in Issues Pane}
             {code scanning and analysis tools}.
 
         \li \uicontrol Python - Runtime errors and exceptions of Python scripts.
+        \endif
 
         \li \uicontrol QML and \uicontrol {QML Analysis} -
             \l{JavaScript and QML Error Codes}
@@ -255,10 +307,12 @@
 
     \image qtcreator-application-output.png
 
+    \if defined(qtcreator)
     If you specify command line arguments in the run settings that are passed
     to the application when running it, they are displayed as a part of the
     application output. For more information, see
     \l{Specifying Run Settings for Desktop Device Types}.
+    \endif
 
     Select toolbar buttons to run applications, to attach the debugger to the
     running application, and to stop running or debugging.
@@ -290,6 +344,7 @@
     In the \uicontrol {Limit build output to} field, you can specify the maximum
     amount of build output lines to display in the pane.
 
+    \if defined(qtcreator)
     \section2 To-Do Entries
 
     The \uicontrol {To-Do Entries} pane lists the BUG, FIXME, NOTE, TODO, and
@@ -331,6 +386,7 @@
     In addition, you can open task list files generated by code scanning and
     analysis tools in the \uicontrol Issues pane. For more information, see
     \l{Showing Task List Files in Issues Pane}.
+    \endif
 
     \section1 Changing Languages
 
@@ -379,10 +435,12 @@
     \l{Searching with the Locator}{navigation} shortcuts are available to help
     speed up the process of developing your application.
 
+    \if defined(qtcreator)
     \section1 Useful Features
 
     For a list of useful \QC features described in other parts of the
     documentation, see \l{Tips and Tricks}.
+    \endif
 
     \section1 Platform Notes
 
@@ -413,6 +471,7 @@
                 \uicontrol Keyboard
     \endtable
 
+    \if defined(qtcreator)
     \section2 Location of Settings Files
 
     \QC creates the following files and directories:
@@ -453,6 +512,7 @@
             \c {%SystemDrive%\Users\%USERNAME%\AppData\Local\QtProject}.
 
     \endlist
+    \endif
 
     \section2 High DPI Scaling
 

doc/src/qtquick/qtquick-components.qdoc

@@ -32,7 +32,11 @@
 /*!
     \contentspage index.html
     \page quick-components.html
+    \if defined(qtdesignstudio)
+    \previouspage studio-prototyping.html
+    \else
     \previouspage creator-using-qt-quick-designer.html
+    \endif
     \nextpage quick-buttons.html
 
     \title Creating Components

doc/src/qtquick/qtquick-designer.qdoc

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2018 The Qt Company Ltd.
+** Copyright (C) 2019 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the Qt Creator documentation.
@@ -33,11 +33,12 @@
     \contentspage index.html
     \page creator-using-qt-quick-designer.html
     \if defined(qtdesignstudio)
-    \previouspage studio-prototyping.html
+    \previouspage creator-quick-tour.html
+    \nextpage {Tutorials}
     \else
     \previouspage creator-quick-ui-forms.html
-    \endif
     \nextpage quick-components.html
+    \endif
 
     \title Editing QML Files in Design Mode
 
@@ -46,7 +47,11 @@
     recommended that you use UI forms for components that you want to
     edit in the Design mode.
 
+    \if defined(qtcreator)
     \image qmldesigner-visual-editor.png "Visual editor"
+    \else
+    \image studio-design-mode.png "Design mode"
+    \endif
 
     To manage your project in the Design mode:
 
@@ -97,11 +102,16 @@
 
         \endlist
 
-        \li \uicontrol {State} pane (6) displays the different states of the item.
+        \li \uicontrol {States} pane (6) displays the different states of the item.
             QML states typically describe user interface configurations, such as
             the UI controls, their properties and behavior and the available
             actions. For more information, see \l{Adding States}.
 
+        \if defined(qtdesignstudio)
+        \li \uicontrol Timeline pane (7) provides a timeline and keyframe based
+            editor that enables you to animate the properties of UI components.
+        \endif
+
     \endlist
 
     \section1 Snapping to Parent and Sibling Items