forked from qt-creator/qt-creator
Doc: Add more links to topics covering views
Also some miscellaneous fixes. Task-number: QDS-3407 Change-Id: If47cdb0b7bc16f3fc624b96c2e0dabfde2d2f2db Reviewed-by: Leena Miettinen <riitta-leena.miettinen@qt.io>
This commit is contained in:
@@ -104,9 +104,8 @@
|
|||||||
\uicontrol {Signal Handler} column, you can add it:
|
\uicontrol {Signal Handler} column, you can add it:
|
||||||
|
|
||||||
\list 1
|
\list 1
|
||||||
\li Right-click a component in the \uicontrol Navigator or
|
\li Right-click a component in the \l Navigator or \l {Form Editor} view
|
||||||
\uicontrol {Form Editor} view and select
|
and select \uicontrol {Add New Signal Handler} in the context menu.
|
||||||
\uicontrol {Add New Signal Handler} in the context menu.
|
|
||||||
\li In the \uicontrol Signal field, select the signal to handle.
|
\li In the \uicontrol Signal field, select the signal to handle.
|
||||||
\image qmldesigner-implement-signal-handler.png "Implement Signal Handler dialog"
|
\image qmldesigner-implement-signal-handler.png "Implement Signal Handler dialog"
|
||||||
\li Select the radio buttons to filter the list to only display
|
\li Select the radio buttons to filter the list to only display
|
||||||
|
|||||||
@@ -101,16 +101,16 @@
|
|||||||
|
|
||||||
\section1 Assets
|
\section1 Assets
|
||||||
|
|
||||||
\uicontrol {Assets} displays the images and other files that you add to
|
\uicontrol Library > \uicontrol {Assets} displays the images and other files
|
||||||
the project folder by selecting \inlineimage plus.png
|
that you add to the project folder by selecting \inlineimage plus.png
|
||||||
.
|
.
|
||||||
|
|
||||||
\image qtquick-assets-tab.png "Library view Assets tab"
|
\image qtquick-assets-tab.png "Library view Assets tab"
|
||||||
|
|
||||||
When you drag and drop assets from the tab to \uicontrol Navigator
|
When you drag-and-drop assets from \uicontrol Assets to \l Navigator
|
||||||
or \uicontrol {Form Editor}, components with a suitable type are
|
or \l {Form Editor}, component instances with a suitable type are
|
||||||
automatically created for you. For example, components of the
|
automatically created for you. For example, instances of the
|
||||||
\l{Images}{Image} type will be created for graphics files.
|
\l{Images}{Image} component will be created for graphics files.
|
||||||
|
|
||||||
\section1 Context Menu Commands
|
\section1 Context Menu Commands
|
||||||
|
|
||||||
|
|||||||
@@ -392,8 +392,8 @@
|
|||||||
(\uicontrol Next) buttons.
|
(\uicontrol Next) buttons.
|
||||||
|
|
||||||
To add a tab bar to a stack layout, right-click on the
|
To add a tab bar to a stack layout, right-click on the
|
||||||
\uicontrol {Stack Layout} in \uicontrol Navigator to access the context menu,
|
\uicontrol {Stack Layout} in \l Navigator to access the context menu, and
|
||||||
and select \uicontrol {Stacked Container} > \uicontrol {Add Tab Bar}.
|
select \uicontrol {Stacked Container} > \uicontrol {Add Tab Bar}.
|
||||||
|
|
||||||
To raise or lower the stacking order of a component, select
|
To raise or lower the stacking order of a component, select
|
||||||
\uicontrol {Stacked Container} > \uicontrol {Increase Index} or
|
\uicontrol {Stacked Container} > \uicontrol {Increase Index} or
|
||||||
|
|||||||
@@ -127,14 +127,14 @@
|
|||||||
We use the default values for all other fields.
|
We use the default values for all other fields.
|
||||||
|
|
||||||
To start recording the transition from the startup screen to the coffee
|
To start recording the transition from the startup screen to the coffee
|
||||||
selection screen on the timeline, we select \e choosingCoffee in the
|
selection screen on the timeline, we select \e choosingCoffee in
|
||||||
\uicontrol Navigator. We check that the playhead is at frame 0, and then
|
\l Navigator. We check that the playhead is at frame 0, and then
|
||||||
select the \inlineimage recordfill.png
|
select the \inlineimage recordfill.png
|
||||||
(\uicontrol {Auto Key (K)}) button (or press \key k).
|
(\uicontrol {Auto Key (K)}) button (or press \key k).
|
||||||
|
|
||||||
At frame 0, we set the X coordinate to 0 in \uicontrol Properties >
|
At frame 0, we set the X coordinate to 0 in \l Properties > \uicontrol
|
||||||
\uicontrol Geometry > \uicontrol Position. We then move the playhead
|
Geometry > \uicontrol Position. We then move the playhead to 400 frames and
|
||||||
to 400 frames and set the X coordinate to a negative value.
|
set the X coordinate to a negative value.
|
||||||
|
|
||||||
\image coffee-machine-properties.png
|
\image coffee-machine-properties.png
|
||||||
|
|
||||||
|
|||||||
@@ -60,13 +60,13 @@
|
|||||||
|
|
||||||
To start recording the transitions between the Standard screen and the
|
To start recording the transitions between the Standard screen and the
|
||||||
Trip and Navigator screens on the timeline, we select \e screenCanvas in
|
Trip and Navigator screens on the timeline, we select \e screenCanvas in
|
||||||
the Design mode \uicontrol Navigator view. We check that the playhead is at
|
the \l Navigator view. We check that the playhead is at frame 0, and then
|
||||||
frame 0, and then select the \inlineimage recordfill.png
|
select the \inlineimage recordfill.png
|
||||||
(\uicontrol {Auto Key (K)}) button (or press \key k).
|
(\uicontrol {Auto Key (K)}) button (or press \key k).
|
||||||
|
|
||||||
\image ebikedesign-timeline.png "Timeline view"
|
\image ebikedesign-timeline.png "Timeline view"
|
||||||
|
|
||||||
At frame 0, we set the X coordinate to 0 in \uicontrol Properties >
|
At frame 0, we set the X coordinate to 0 in \l Properties >
|
||||||
\uicontrol Geometry > \uicontrol Position to display the Trip screen.
|
\uicontrol Geometry > \uicontrol Position to display the Trip screen.
|
||||||
We then move the playhead to frame 1000 and set the X coordinate to
|
We then move the playhead to frame 1000 and set the X coordinate to
|
||||||
-1286 to display the Standard screen. We continue by moving the playhead
|
-1286 to display the Standard screen. We continue by moving the playhead
|
||||||
|
|||||||
@@ -101,8 +101,9 @@
|
|||||||
We construct the menu bar in the \e {MainFile.ui.qml} file using the
|
We construct the menu bar in the \e {MainFile.ui.qml} file using the
|
||||||
\l {Form Editor}. The CustomButton component is listed in
|
\l {Form Editor}. The CustomButton component is listed in
|
||||||
\l Library > \uicontrol Components > \uicontrol {My Components}.
|
\l Library > \uicontrol Components > \uicontrol {My Components}.
|
||||||
We drag and drop several instances of the component to the \l {Form Editor}
|
We drag-and-drop several instances of the component to the
|
||||||
and enclose them in a RowLayout component to lay them out as a menu bar.
|
\uicontrol {Form Editor} and enclose them in a RowLayout component instance
|
||||||
|
to lay them out as a menu bar.
|
||||||
|
|
||||||
\image sidemenu-menubar.png
|
\image sidemenu-menubar.png
|
||||||
|
|
||||||
|
|||||||
@@ -140,7 +140,7 @@
|
|||||||
\image washingmachineui-timeline-settings.png "Timeline settings"
|
\image washingmachineui-timeline-settings.png "Timeline settings"
|
||||||
|
|
||||||
First, we select the initial arc segment, \e arcSegment1, in
|
First, we select the initial arc segment, \e arcSegment1, in
|
||||||
\uicontrol Navigator to display its properties in \uicontrol Properties.
|
\l Navigator to display its properties in \uicontrol Properties.
|
||||||
In the \uicontrol Layout tab, \uicontrol Rotation field, we select
|
In the \uicontrol Layout tab, \uicontrol Rotation field, we select
|
||||||
\inlineimage icons/action-icon.png
|
\inlineimage icons/action-icon.png
|
||||||
, and then select \uicontrol {Insert Keyframe} to insert a keyframe
|
, and then select \uicontrol {Insert Keyframe} to insert a keyframe
|
||||||
@@ -167,7 +167,7 @@
|
|||||||
and 1000 (\e arcSegment4).
|
and 1000 (\e arcSegment4).
|
||||||
|
|
||||||
When we move the playhead in \uicontrol Timeline, we can see the rotation
|
When we move the playhead in \uicontrol Timeline, we can see the rotation
|
||||||
animation in \uicontrol {Form Editor}.
|
animation in \l {Form Editor}.
|
||||||
|
|
||||||
\image washingmachineui-multsegmentarc.gif "Rotation animation in Form Editor"
|
\image washingmachineui-multsegmentarc.gif "Rotation animation in Form Editor"
|
||||||
|
|
||||||
@@ -212,8 +212,8 @@
|
|||||||
\printuntil startClicked
|
\printuntil startClicked
|
||||||
|
|
||||||
Then, we select the mouse area for the start button, \e startMA,
|
Then, we select the mouse area for the start button, \e startMA,
|
||||||
in \uicontrol Navigator. In the \l {Connection View} >
|
in \uicontrol Navigator. In \l {Connection View} > \uicontrol Connections,
|
||||||
\uicontrol Connections tab, we select the \inlineimage plus.png
|
we select the \inlineimage plus.png
|
||||||
(\uicontrol Add) button to connect the \c onClicked() signal handler
|
(\uicontrol Add) button to connect the \c onClicked() signal handler
|
||||||
of the button to the \c startClicked() signal.
|
of the button to the \c startClicked() signal.
|
||||||
|
|
||||||
|
|||||||
@@ -91,7 +91,7 @@
|
|||||||
displayed in \uicontrol Library > \uicontrol Components >
|
displayed in \uicontrol Library > \uicontrol Components >
|
||||||
\uicontrol {My Components} as well as in the \uicontrol Projects view as
|
\uicontrol {My Components} as well as in the \uicontrol Projects view as
|
||||||
separate QML files. To start using them, drag-and-drop them from
|
separate QML files. To start using them, drag-and-drop them from
|
||||||
\uicontrol Library to \uicontrol {Form Editor} or \uicontrol Navigator.
|
\uicontrol Library to \uicontrol {Form Editor} or \l Navigator.
|
||||||
|
|
||||||
\note The layer that was the bottom layer in the design tool becames the top
|
\note The layer that was the bottom layer in the design tool becames the top
|
||||||
layer in \uicontrol Navigator to reflect the QML code model. You
|
layer in \uicontrol Navigator to reflect the QML code model. You
|
||||||
|
|||||||
@@ -154,7 +154,7 @@
|
|||||||
|
|
||||||
If you need to change the IP address and/or port, you need to select the
|
If you need to change the IP address and/or port, you need to select the
|
||||||
\uicontrol SimulinkConnector item in \l Navigator and set the IP address
|
\uicontrol SimulinkConnector item in \l Navigator and set the IP address
|
||||||
and/or port in the \uicontrol Properties view. If you cannot see
|
and/or port in the \l Properties view. If you cannot see
|
||||||
\uicontrol SimulinkConnector in \uicontrol Navigator, you need to click
|
\uicontrol SimulinkConnector in \uicontrol Navigator, you need to click
|
||||||
\inlineimage filtericon.png
|
\inlineimage filtericon.png
|
||||||
(\uicontrol {Filter Tree}) and unselect \uicontrol {Show only visible items}.
|
(\uicontrol {Filter Tree}) and unselect \uicontrol {Show only visible items}.
|
||||||
|
|||||||
@@ -81,25 +81,25 @@
|
|||||||
To create a custom effect:
|
To create a custom effect:
|
||||||
|
|
||||||
\list 1
|
\list 1
|
||||||
\li Drag and drop an \uicontrol {Effect} component from the
|
\li Drag-and-drop an \uicontrol {Effect} component from the
|
||||||
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
|
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
|
||||||
\uicontrol Library to a Model component in \uicontrol Navigator.
|
\uicontrol Library to a Model component in \l Navigator.
|
||||||
\li Select the custom effect component in \uicontrol Navigator to edit
|
\li Select the custom effect component in \uicontrol Navigator to edit
|
||||||
the values of its properties in the \uicontrol Properties view.
|
the values of its properties in the \l Properties view.
|
||||||
\image studio-qtquick-3d-custom-effect.png "Custom effect properties"
|
\image studio-qtquick-3d-custom-effect.png "Custom effect properties"
|
||||||
\li In the \uicontrol Passes field, select the pass components for
|
\li In the \uicontrol Passes field, select the pass components for
|
||||||
the effect.
|
the effect.
|
||||||
\li Select the pass component in \uicontrol Navigator to specify values
|
\li Select the pass component in \uicontrol Navigator to specify values
|
||||||
for its properties in \uicontrol Properties.
|
for its properties in \uicontrol Properties.
|
||||||
\image studio-qtquick-3d-pass.png "Pass properties"
|
\image studio-qtquick-3d-pass.png "Pass properties"
|
||||||
\li To execute commands during the pass, drag and drop the following
|
\li To execute commands during the pass, drag-and-drop the following
|
||||||
command components from \uicontrol Library to the custom material in
|
command components from \uicontrol Library to the custom material in
|
||||||
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
|
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
|
||||||
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
|
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
|
||||||
\uicontrol {Depth Input}, \uicontrol {Render State}, and
|
\uicontrol {Depth Input}, \uicontrol {Render State}, and
|
||||||
\uicontrol {Set Uniform Value}. Then select the commands in the
|
\uicontrol {Set Uniform Value}. Then select the commands in the
|
||||||
\uicontrol Commands field.
|
\uicontrol Commands field.
|
||||||
\li To allocate a buffer for the pass, drag and drop a \uicontrol Buffer
|
\li To allocate a buffer for the pass, drag-and-drop a \uicontrol Buffer
|
||||||
component to the custom material. Then select the buffer in the
|
component to the custom material. Then select the buffer in the
|
||||||
\uicontrol Buffer field.
|
\uicontrol Buffer field.
|
||||||
\li Select the shader component in \uicontrol Navigator to set the path
|
\li Select the shader component in \uicontrol Navigator to set the path
|
||||||
@@ -133,7 +133,7 @@
|
|||||||
To create a custom material:
|
To create a custom material:
|
||||||
|
|
||||||
\list 1
|
\list 1
|
||||||
\li Drag and drop a \uicontrol {Custom Material} component from the
|
\li Drag-and-drop a \uicontrol {Custom Material} component from the
|
||||||
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
|
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
|
||||||
\uicontrol Library to a Model component in \uicontrol Navigator.
|
\uicontrol Library to a Model component in \uicontrol Navigator.
|
||||||
\li Select the custom material component in \uicontrol Navigator to
|
\li Select the custom material component in \uicontrol Navigator to
|
||||||
@@ -159,7 +159,7 @@
|
|||||||
\li Select the pass component in \uicontrol Navigator to specify values
|
\li Select the pass component in \uicontrol Navigator to specify values
|
||||||
for its properties in \uicontrol Properties.
|
for its properties in \uicontrol Properties.
|
||||||
\image studio-qtquick-3d-pass.png "Pass properties"
|
\image studio-qtquick-3d-pass.png "Pass properties"
|
||||||
\li To execute commands during the pass, drag and drop the following
|
\li To execute commands during the pass, drag-and-drop the following
|
||||||
command components from \uicontrol Library to the pass component in
|
command components from \uicontrol Library to the pass component in
|
||||||
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
|
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
|
||||||
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
|
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
|
||||||
@@ -167,10 +167,10 @@
|
|||||||
\uicontrol {Set Uniform Value}. The command components are created
|
\uicontrol {Set Uniform Value}. The command components are created
|
||||||
at the same level as the pass component and automatically added to
|
at the same level as the pass component and automatically added to
|
||||||
the \uicontrol Commands field.
|
the \uicontrol Commands field.
|
||||||
\li To allocate a buffer for the pass, drag and drop a \uicontrol Buffer
|
\li To allocate a buffer for the pass, drag-and-drop a \uicontrol Buffer
|
||||||
component to the custom material. Then select the buffer in the
|
component to the custom material. Then select the buffer in the
|
||||||
\uicontrol Buffer field.
|
\uicontrol Buffer field.
|
||||||
\li To add a shader to the pass, drag and drop the \uicontrol Shader
|
\li To add a shader to the pass, drag-and-drop the \uicontrol Shader
|
||||||
component from the \uicontrol Library to the pass component in
|
component from the \uicontrol Library to the pass component in
|
||||||
\uicontrol Navigator. The shader components are created at the same
|
\uicontrol Navigator. The shader components are created at the same
|
||||||
level as the pass component and automatically added to the
|
level as the pass component and automatically added to the
|
||||||
|
|||||||
@@ -42,7 +42,7 @@
|
|||||||
described in \l {Adding and Removing Modules}.
|
described in \l {Adding and Removing Modules}.
|
||||||
|
|
||||||
Select the \uicontrol Group component in \uicontrol Navigator to modify its
|
Select the \uicontrol Group component in \uicontrol Navigator to modify its
|
||||||
properties in the \l Properties view.
|
properties in the \uicontrol Properties view.
|
||||||
|
|
||||||
\section1 Setting Node Opacity and Visibility
|
\section1 Setting Node Opacity and Visibility
|
||||||
|
|
||||||
|
|||||||
@@ -133,8 +133,8 @@
|
|||||||
\image studio-qtquick-3d-material-texture.png "Material properties"
|
\image studio-qtquick-3d-material-texture.png "Material properties"
|
||||||
|
|
||||||
To change the source file for the texture, select the \uicontrol Texture
|
To change the source file for the texture, select the \uicontrol Texture
|
||||||
component in \uicontrol Navigator, go to the \uicontrol Properties view, and
|
component in \uicontrol Navigator, go to the \l Properties view, and specify
|
||||||
specify a new image to use in the \uicontrol Source field.
|
a new image to use in the \uicontrol Source field.
|
||||||
|
|
||||||
\image studio-qtquick-3d-texture-properties.png "Texture properties"
|
\image studio-qtquick-3d-texture-properties.png "Texture properties"
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -55,8 +55,8 @@
|
|||||||
scene created by using the wizard template mentioned above. To use other
|
scene created by using the wizard template mentioned above. To use other
|
||||||
light and camera types, select the component in \uicontrol {3D Editor} or
|
light and camera types, select the component in \uicontrol {3D Editor} or
|
||||||
\uicontrol Navigator and change the type of the component in the \uicontrol
|
\uicontrol Navigator and change the type of the component in the \uicontrol
|
||||||
Type field in \uicontrol Properties. For example, to use a point light,
|
Type field in \l Properties. For example, to use a point light, enter
|
||||||
enter \e {PointLight}.
|
\e {PointLight}.
|
||||||
|
|
||||||
\image studio-3d-properties-type.png "Type field in Properties view"
|
\image studio-3d-properties-type.png "Type field in Properties view"
|
||||||
|
|
||||||
|
|||||||
@@ -35,7 +35,7 @@
|
|||||||
|
|
||||||
\title Editing 3D Scenes
|
\title Editing 3D Scenes
|
||||||
|
|
||||||
You can use \l{3D Editor} in the Design mode to edit files you
|
You can use \l{3D Editor} in the \uicontrol Design mode to edit files you
|
||||||
created using 3D graphics applications and stored in one of the supported
|
created using 3D graphics applications and stored in one of the supported
|
||||||
formats. You cannot create 3D models or other assets in the editor, but you
|
formats. You cannot create 3D models or other assets in the editor, but you
|
||||||
can \l{Importing 3D Assets}{import} the assets you need and work with them
|
can \l{Importing 3D Assets}{import} the assets you need and work with them
|
||||||
@@ -64,9 +64,9 @@
|
|||||||
\endif
|
\endif
|
||||||
\li \l{Adding 3D Views}
|
\li \l{Adding 3D Views}
|
||||||
|
|
||||||
You can drag and drop 3D components from \uicontrol Library
|
You can drag-and-drop 3D components from \l Library >
|
||||||
to the scene or to \uicontrol Navigator. You must add all 3D
|
\uicontrol Components to \uicontrol {3D Editor} or to \l Navigator.
|
||||||
components into a 3D view.
|
You must add all 3D components into a 3D view.
|
||||||
\li \l {Using 3D Components}
|
\li \l {Using 3D Components}
|
||||||
|
|
||||||
You can speficy properties for 3D components, such as cameras,
|
You can speficy properties for 3D components, such as cameras,
|
||||||
|
|||||||
@@ -67,7 +67,7 @@
|
|||||||
the checked state of a third one. First we drag-and-drop three
|
the checked state of a third one. First we drag-and-drop three
|
||||||
\uicontrol {Check Box} component and an \uicontrol {And Operator} to
|
\uicontrol {Check Box} component and an \uicontrol {And Operator} to
|
||||||
\uicontrol Navigator (1). Then we select the \uicontrol {And Operator}
|
\uicontrol Navigator (1). Then we select the \uicontrol {And Operator}
|
||||||
component (2) and set its properties in \uicontrol Properties (3).
|
component (2) and set its properties in \l Properties (3).
|
||||||
|
|
||||||
We select \inlineimage icons/action-icon.png
|
We select \inlineimage icons/action-icon.png
|
||||||
next to the \uicontrol {Input 01} field to display the \uicontrol Actions
|
next to the \uicontrol {Input 01} field to display the \uicontrol Actions
|
||||||
|
|||||||
Reference in New Issue
Block a user