feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

Doc: add missing info about sidebar views in Qt Quick Designer

Browse Source 
As it turns out that we have a sidebar also in the Design mode,
with partly the same views as in the Edit and Debug modes, I
added info about the missing views and fixed the terminology.

Change-Id: I997d472548781a466bec3e64dbf28ecb1476b3eb
Reviewed-by: Tim Jenssen <tim.jenssen@theqtcompany.com>
Reviewed-by: Thomas Hartmann <Thomas.Hartmann@digia.com>
This commit is contained in:
Leena Miettinen
2014-12-04 11:56:03 +01:00
committed by Leena Miettinen
parent d0dac2e9fd
commit dffd2866b3
7 changed files with 61 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
doc/src/howto/creator-ui.qdoc
View File

@@ -105,7 +105,8 @@
\section1 Browsing Project Contents
The sidebar is available in the \gui Edit and \gui Debug modes. Use the
The sidebar is available in the \gui Edit and \gui Debug modes, and with a
different set of views in the \gui Design mode. Use the
sidebar to browse projects, files, and bookmarks, and to view the class
hierarchy.
@@ -138,6 +139,9 @@
\endlist
For more information about the sidebar views that are only available in
\QMLD, see \l{Using Qt Quick Designer}.
You can change the view of the sidebar in the following ways:
\list

6
doc/src/qtquick/creator-mobile-app-tutorial.qdoc
View File

@@ -100,7 +100,7 @@
as the QML file) from the examples directory in the Qt installation
directory. For example:
\c {C:\Qt\Qt5.2.0\5.2.0\msvc2010\examples\sensors\accelbubble\content}.
The image appears in the \gui Resources pane. You can also use any other
The image appears in \gui Resources. You can also use any other
image or a QML type, instead.
\list 1
@@ -120,10 +120,10 @@
\li Click \gui Design to open the file in \QMLD.
\li In the \gui Navigator pane, select \gui Label and press \key Delete
\li In the \gui Navigator, select \gui Label and press \key Delete
to delete it.
\li In the \gui Library view, \gui Resources tab, select Bluebubble.svg
\li In \gui Library > \gui Resources, select Bluebubble.svg
and drag and drop it to the canvas.
\li In the \gui Properties pane, \gui Id field, enter \e bubble to be

10
doc/src/qtquick/qtquick-app-tutorial.qdoc
View File

@@ -90,7 +90,7 @@
directory in the Qt installation directory. For example:
\c {C:\Qt\Qt5.3.0\5.3.0\msvc2010\examples\declarative\animation\states}. The
image appears
in the \gui Resources pane. You can also use any other image or a QML
in \gui Resources. You can also use any other image or a QML
type, instead.
\list 1
@@ -102,7 +102,7 @@
\image qmldesigner-tutorial-desing-mode.png "Transitions project in Design Mode"
\li In the \gui Navigator pane, select \gui Text and press \key Delete to
\li In the \gui Navigator, select \gui Text and press \key Delete to
delete it.
\li Select \gui Window to edit its properties.
@@ -124,7 +124,7 @@
\endlist
\li In the \gui Library view, \gui Resources tab, select states.png and
\li In \gui Library > \gui Resources, select states.png and
drag and drop it to the canvas.
\image qmldesigner-tutorial-user-icon.png "Image properties"
@@ -184,7 +184,7 @@
\endlist
\li In the \gui Navigator pane, drag and drop the \gui {Mouse Area}
\li In the \gui Navigator, drag and drop the \gui {Mouse Area}
from \e page to \e topLeftRect to make it apply only to the
rectangle and not to the whole page.
@@ -220,7 +220,7 @@
\printuntil }
\printuntil }
\li In the \gui Navigator pane, copy topLeftRect (by pressing
\li In the \gui Navigator, copy topLeftRect (by pressing
\key {Ctrl+C}) and paste it to the canvas twice (by pressing
\key {Ctrl+V}). \QC renames the new instances of the type
topLeftRect1 and topLeftRect2.

8
doc/src/qtquick/qtquick-buttons.qdoc
View File

@@ -37,12 +37,12 @@
\li Select \gui {File > New File or Project > Qt > QML File > Choose}
to create a QML file called Button.qml (for example).
\note Components are listed in the \gui Library pane only if the
\note Components are listed in the \gui Library only if the
filename begins with a capital letter.
\li Click \gui {Design} to edit the file in the visual editor.
\li In the \gui Navigator pane, click \gui Rectangle to set properties
\li In the \gui Navigator, click \gui Rectangle to set properties
for it.
\li In the \gui Properties pane, modify the appearance of the button.
@@ -163,14 +163,14 @@
\li Click \gui {Design} to edit the file in the visual editor.
\li Drag and drop two \gui {Border Image} items from the \gui Library pane
\li Drag and drop two \gui {Border Image} items from the \gui Library
to the canvas.
\li Drag and drop a \gui Text item to the canvas.
\li Drag and drop a \gui {Mouse Area} to the canvas.
\li In the \gui Navigator pane, select \gui border_image1 to specify
\li In the \gui Navigator, select \gui border_image1 to specify
settings for it in the \gui Properties pane:
\list a

4
doc/src/qtquick/qtquick-components.qdoc
View File

@@ -93,12 +93,12 @@
file.
\note Components are listed in the \gui {QML Components} section of
the \gui Library pane only if the filename begins with a capital
the \gui Library only if the filename begins with a capital
letter.
\li Click \gui Design to open the .qml file in \QMLD.
\li Drag and drop a QML type from the \gui Library pane to the editor.
\li Drag and drop a QML type from the \gui Library to the editor.
\li Edit its properties in the \gui Properties pane.

62
doc/src/qtquick/qtquick-designer.qdoc
View File

@@ -36,22 +36,38 @@
\image qmldesigner-visual-editor.png "Visual editor"
Use the visual editor panes to manage your project:
Use the visual editor to manage your project:
\list
\li \gui {Navigator} pane (1) displays the items in the current QML
file as tree structure.
\li Use the sidebar to select QML types to use in the project 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:
\li \gui {Library} pane (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 that you import
to the project, and
other resources.
\list
\li \gui Connections pane (3) enables you to create connections between
objects, signals, and object properties (commercial only). For more
information, see \l{Adding Connections}.
\li \gui {Navigator} (1) displays the items in the current QML
file as tree structure.
\li \gui {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 that you
import to the project, and other resources.
\li \gui Connections (3) enables you to create connections between
objects, signals, and object properties (commercial only). For
more information, see \l{Adding Connections}.
\li \gui {Projects} shows a list of projects open in the current
session. For more information, see \l{Viewing Project Files}.
\li \gui {File System} shows all files in the currently selected
directory. For more information, see \l{Viewing the File System}.
\li \gui {Open Documents} sidebar view shows currently open files.
\endlist
\li \gui Canvas (4) is the working area where you create QML components and
design applications.
@@ -64,15 +80,15 @@
the UI controls, their properties and behavior and the available
actions.
\endlist
\section1 Managing Item Hierarchy
The \gui Navigator pane displays the items in the current QML file and their relationships.
The \gui Navigator displays the items in the current QML file and their
relationships.
Items (1) are listed in a tree structure, below their parent (2).
\image qmldesigner-navigator.png "Navigator pane"
\image qmldesigner-navigator.png "Navigator"
You can select items in the \gui Navigator to edit their properties
in the \gui Properties pane. Items can access the properties of their
@@ -132,7 +148,7 @@
key before you drag and drop the item into a new position. The topmost
item under the cursor becomes the new parent of the item.
You can change the parent of an item also in the \gui Navigator pane.
You can change the parent of an item also in the \gui Navigator.
Drag and drop the item to another position in the tree or use the arrow
buttons (1) to move the item in the tree.
@@ -140,10 +156,10 @@
\section1 QML Type Library
The \gui {Library} pane enables you to select QML types, UI components, and
The \gui {Library} enables you to select QML types, UI components, and
resources, as well as to manage imports.
The \gui {QML Types} pane displays the QML types grouped by category: your own QML
\gui {QML Types} displays the QML types grouped by category: your own QML
components, basic types, layouts, positioner types, and views.
Sets of UI components with the look and feel of a particular mobile device
@@ -151,15 +167,15 @@
Quick Controls, Dialogs, and Layouts are available for creating user
interfaces using Qt Quick 2.1. The components and controls are based on
standard QML types. To view the components and controls in the
\gui {Library} pane, import the component sets in the \gui Imports pane.
\gui {Library}, import the component sets in \gui Imports.
The \gui {Qt Quick Application} wizards for a particular platform add the
import statements automatically. You can remove import statements in the
\gui Imports pane.
import statements automatically. You can remove import statements in
\gui Imports
\image qmldesigner-qml-components.png "QML Components pane"
\image qmldesigner-qml-components.png "QML Components"
The \gui {Resources} pane displays the images and other files that you copy
\gui {Resources} displays the images and other files that you copy
to the project folder (to the same subfolder as the QML files).
\section1 Specifying Item Properties
@@ -461,7 +477,7 @@
To experiment with different component sizes, enter values in the
\gui Height and \gui Width fields (1) on the canvas toolbar. The changes are
displayed in the \gui States pane (2) and on the canvas (3), but the property
displayed in the \gui 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 \gui Properties pane (4).

6
doc/src/qtquick/qtquick-screens.qdoc
View File

@@ -36,7 +36,7 @@
main window of an application.
The QML files in the project folder are displayed in \gui {QML Components}
in the \gui Library pane.
in the \gui Library.
You can also use ready-made Qt Quick 1 Components (for Qt 4) to create
screens with a native look and feel for a particular target platform.
@@ -48,9 +48,9 @@
\list 1
\li Drag and drop components from the \gui Library pane to the editor.
\li Drag and drop components from the \gui Library to the editor.
\li Select components in the \gui Navigator pane to edit their
\li Select components in the \gui Navigator to edit their
properties in the \gui Properties pane.
For example, you can anchor components to a position on the screen.