Doc: Update docs related to Library, Assets, and Components view

The Library view has been removed and replaced by the Assets
and Components view.

Task-number: QDS-6216
Change-Id: Iad2454196898ca0d6631a6bd6261c02d1bad98ac
Reviewed-by: Leena Miettinen <riitta-leena.miettinen@qt.io>
This commit is contained in:
Mats Honkamaa
2022-02-25 12:52:54 +02:00
parent 8828e6c22d
commit 2a4c149e49
77 changed files with 313 additions and 273 deletions

View File

@@ -158,10 +158,9 @@
\l{https://fonts.google.com/specimen/Titillium+Web#standard-styles}
{Titillium Web ExtraLight font} or use Arial as a substitute.
To add the assets to \l Library:
To add the assets:
\list 1
\li Select \uicontrol Library > \uicontrol Assets
> \inlineimage icons/plus.png
\li Select \uicontrol Assets > \inlineimage icons/plus.png
.
\li Select the asset files, and then select \uicontrol Open.
\li Select the location where the files will be saved in the
@@ -181,8 +180,8 @@
To modify the \e Screen01 component in \uicontrol {Form Editor}:
\list 1
\li Drag-and-drop the background image from \uicontrol Library >
\uicontrol Assets to the rectangle in \l Navigator.
\li Drag-and-drop the background image from \uicontrol Assets to the
rectangle in \l Navigator.
\image loginui1-library-assets.jpg "Library view Assets tab"
\li \QDS automatically creates an instance of the \l{Images}{Image}
component for you with the path to the image file set as the
@@ -237,11 +236,10 @@
You can view the import statements in the \uicontrol {Text Editor} view.
The \l Library view lists the components in each module that are
The \l Components view lists the components in each module that are
supported by \QDS. You can use the basic components to create your own
components, and they will be listed in \uicontrol Components >
\uicontrol {My Components}. This section is only visible if you have created
custom components.
components, and they will be listed in \uicontrol {My Components}.
This section is only visible if you have created custom components.
The \l {basic-rectangle}{Rectangle}, \l Text, and \l {Images}{Image}
components used in this tutorial are based on the \l Item component.
@@ -264,7 +262,7 @@
If you want to specify the radius of each corner separately, you can use the
\l{studio-rectangle}{Rectangle} component from the
\uicontrol {Qt Quick Studio Components} module instead of the basic rectangle
component. It is available in \uicontrol Library > \uicontrol Components
component. It is available in \uicontrol Components
> \uicontrol {Qt Quick Studio Components}.
\section3 Text Properties
@@ -281,25 +279,25 @@
The \l {Images}{Image} component is used for adding images to the UI in several
supported formats, including bitmap formats such as PNG and JPEG and vector
graphics formats such as SVG. To add an image to \uicontrol Library, select
\uicontrol Assets > \inlineimage icons/plus.png
graphics formats such as SVG. To add an image to \uicontrol Assets, select
\inlineimage icons/plus.png
, and then select the image file.
If you need to display animated images, use the \l {Animated Image}
component, also available in \uicontrol Library > \uicontrol Components >
component, also available in \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic.
\section1 Creating a Push Button
You can use another wizard template to create a push button and to add it to
the project. The wizard template creates a reusable button component that
appears in \uicontrol Library > \uicontrol Components >
\uicontrol {My Components}. You can drag-and-drop it to \l Navigator
to create button instances and modify their properties in the
\uicontrol Properties view to change their appearance and functionality.
appears in \uicontrol Components > \uicontrol {My Components}.
You can drag-and-drop it to \l Navigator to create button instances and
modify their properties in the \uicontrol Properties view to change their
appearance and functionality.
If you cannot use the wizard template nor the preset
button controls available in \uicontrol Library > \uicontrol Components >
button controls available in \uicontrol Components >
\uicontrol {Qt Quick Controls} to create the kind of push button that you
want, you can create your button from scratch using default components. For
more information, see \l {Creating Buttons} and
@@ -409,8 +407,8 @@
\li Double-click \e Screen01.ui.qml in \uicontrol Projects
to open it in \uicontrol {Form Editor}.
\li Drag-and-drop two instances of the EntryField component from
\uicontrol Library > \uicontrol Components >
\uicontrol {My Components} to the rectangle in \uicontrol Navigator.
\uicontrol Components > \uicontrol {My Components} to the rectangle
in \uicontrol Navigator.
\image loginui1-library.jpg "My Components tab of Library view"
\li Select the first EntryField instance in \uicontrol Navigator
to modify its ID and text in \uicontrol Properties.
@@ -482,8 +480,8 @@
\li Double-click \e Screen01.ui.qml in \uicontrol Projects
to open it in \uicontrol {Form Editor}.
\li Drag-and-drop two instances of the PushButton component from
\uicontrol Library > \uicontrol Components >
\uicontrol {My Components} to the rectangle in \uicontrol Navigator.
\uicontrol Components > \uicontrol {My Components} to the rectangle
in \uicontrol Navigator.
\li Drag the button instances to the bottom of the background image in
\uicontrol {Form Editor}. Use the guidelines to align the button
instances horizontally with the entry fields.

View File

@@ -74,8 +74,8 @@
\li Double-click \e Screen01.ui.qml in \uicontrol Projects to open it
in \uicontrol {Form Editor}.
\li Drag-and-drop an instance of the EntryField component from
\uicontrol Library > \uicontrol Components >
\uicontrol {My Components} to \e fields in \l Navigator.
\uicontrol Components > \uicontrol {My Components} to \e fields in
\l Navigator.
\li Select the EntryField instance in \uicontrol Navigator to modify
its ID and text in \uicontrol Properties.
\li In \uicontrol Component > \uicontrol ID, enter

View File

@@ -43,18 +43,18 @@
\l{basic-rectangle}{Rectangle} component and an instance of the preset
\l{Text} component to create the progress bar. There is also a preset
\l {progress-bar-control}{Progress Bar} component available in
\uicontrol Library > \uicontrol Components > \uicontrol {Qt Quick Controls}.
\uicontrol Components > \uicontrol {Qt Quick Controls}.
In the \uicontrol Design mode, we drag-and-drop a \uicontrol Rectangle from
\l Library > \uicontrol Components > \uicontrol {Default Components} >
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Basic to \l {Form Editor} and modify its size to create the
background for the progress bar. We change its ID to \e pb_back in
\l Properties.
We want to be able to control the background rectangle and the text label
that was added by the project wizard, so we will use an \uicontrol Item
component for that. We drag-and-drop the Item from \uicontrol Library >
\uicontrol Components > \uicontrol {Default Components} > \uicontrol Basic
component for that. We drag-and-drop the Item from \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic
to \uicontrol {Form Editor} and change its ID to \e root in
\uicontrol Properties.
@@ -75,7 +75,7 @@
change for the animation.
For more information about creating and positioning components, see
\l {Components} and \l {Scalable Layouts}.
\l {Using Components} and \l {Scalable Layouts}.
\section1 Animating Progress Bar Elements

View File

@@ -53,11 +53,10 @@
module to your project:
\list 1
\li In the \uicontrol Library view, select
\inlineimage icons/plus.png
next to \uicontrol Components.
\li In the \uicontrol Component view, select \inlineimage icons/plus.png
.
\li Find QtQuick3D.Particles3D and select it to add it to your project.
\li From \uicontrol Library > \uicontrol Components, drag a
\li From \uicontrol Components, drag a
\uicontrol{Particle System} to \uicontrol scene in \uicontrol Navigator.
\endlist
@@ -74,7 +73,7 @@
In \uicontrol Navigator, select \e particleSystem and in
\uicontrol Properties, set \uicontrol Translation > \uicontrol Y to 193.
\li Set the \e rain-drop-white-square.png as texture for the particles.
From \uicontrol Library > \uicontrol Assets, drag
From \uicontrol Assets, drag
\e {rain-drop-white-square.png} to \e spriteParticle.
\li Adjust the apperance and behavior of the sprite further. In \uicontrol
Properties, set:

View File

@@ -103,7 +103,7 @@
We construct the menu bar in the \e {MainFile.ui.qml} file using the
\l {Form Editor}. The CustomButton component is listed in
\l Library > \uicontrol Components > \uicontrol {My Components}.
\uicontrol Components > \uicontrol {My Components}.
We drag-and-drop several instances of the component to \uicontrol Navigator
or \uicontrol {Form Editor} and enclose them in a \uicontrol {Row Layout}
component instance to lay them out as a menu bar.
@@ -127,7 +127,7 @@
We can now continue to create a side menu that slides open when users
click the burger menu. We drag-and-drop a \l Text component from
\uicontrol Library > \uicontrol Components > \uicontrol {Default Components}
\uicontrol Components > \uicontrol {Default Components}
> \uicontrol Basic and a \l {slider-control}{Slider} component from
\uicontrol {Qt Quick Controls} to \uicontrol Navigator to create separate
submenus for each set of effects we want to apply to the images. We use
@@ -232,9 +232,8 @@
\uicontrol Properties > \uicontrol Slider.
We open the \e {EffectStack.qml} file, and drag-and-drop components from
\uicontrol Library > \uicontrol Components >
\uicontrol {Qt Quick Studio Effects} to \uicontrol Navigator to create the
effect stack.
\uicontrol Components > \uicontrol {Qt Quick Studio Effects} to
\uicontrol Navigator to create the effect stack.
\image sidemenu-effects-stack.png "Effects stack in the Navigator"

View File

@@ -68,7 +68,7 @@
project.
This way, only the components and properties supported on MCUs are visible
in \l Library and \l Properties, and we won't accidentally
in \l Components and \l Properties, and we won't accidentally
add unsupported components to our UI or specify unsupported properties for
supported components. For more information, see \l{Creating Projects}.
@@ -103,7 +103,7 @@
by selecting \uicontrol File > \uicontrol {New File} >
\uicontrol {Qt Quick Files}. While designing the screens, you can
move reusable components into separate files. For more information,
see \l{Components}.
see \l{Using Components}.
\section1 Creating a Progress Indicator
@@ -177,7 +177,7 @@
In our UI, we use connections and states to move between screens. First,
we specify the application workflow in \e ApplicationFlow.qml. When the
file is open in \uicontrol {Form Editor}, we drag-and-drop the components
that define the screens in the application from \uicontrol Library to
that define the screens in the application from \uicontrol Components to
\uicontrol Navigator or \uicontrol {Form Editor}: \e StartScreen,
\e SettingsScreen, \e PresetsScreen, and \e RunningScreen.

View File

@@ -169,7 +169,7 @@
The \e {LayoutReference.ui.qml} file contains a reference image of
the UI we will create. We use the imported components to create the
UI in the \e {MainApp.ui.qml} file. The imported components are
listed in \l Library > \uicontrol Components > \uicontrol {My Components},
listed in \uicontrol Components > \uicontrol {My Components},
and we can drag-and-drop them to \l {Form Editor}.
\image webinardemo-mainappui.png "Main app UI in Design mode"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 74 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.0 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.6 KiB

After

Width:  |  Height:  |  Size: 8.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.7 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 11 KiB

View File

@@ -38,7 +38,7 @@
that is to be animated, and apply the animation depending on the type of
behavior that is required.
You can drag-and-drop animation components from \l Library >
You can drag-and-drop animation components from
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Animation to \l Navigator or \l {Form Editor} to
create instances of them.
@@ -206,9 +206,9 @@
\section1 Summary of Animation Components
The following table lists the components that you can use to animate
component properties programmatically. They are available in \l Library
> \uicontrol Components > \uicontrol {Default Components} >
\uicontrol Animation
component properties programmatically. They are available in
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol {Animation}.
\table
\header

View File

@@ -49,7 +49,7 @@
\uicontrol Choose to create a \l{UI Files}{UI file} called
Button.ui.qml (for example).
\note Components are listed in \l Library > \uicontrol Components >
\note Components are listed in \uicontrol Components >
\uicontrol {My Components} only if the filename begins with a
capital letter.
@@ -59,11 +59,11 @@
(\uicontrol W) and height (\uicontrol H) of the button in
\l Properties.
\li Drag-and-drop a \uicontrol Rectangle from \l Library >
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Basic to the component in \uicontrol Navigator. This
creates a nested component where the Item is the parent of the
Rectangle. Components are positioned relative to their parents.
\li Drag-and-drop a \uicontrol Rectangle from \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic to the component
in \uicontrol Navigator. This creates a nested component where the
Item is the parent of the Rectangle. Components are positioned
relative to their parents.
\li In the \uicontrol Properties view, modify the appearance of the
rectangle:
@@ -114,7 +114,7 @@
To be useful, the button component has to be created in a project.
When you work on other files in the project to create screens
or other components for the UI, the button component appears in
\uicontrol Library > \uicontrol Components > \uicontrol {My Components}.
\uicontrol Components > \uicontrol {My Components}.
You can use it to create button instances and modify their properties
to assign them useful IDs, change their appearance, and set the button
text for each button instance, for example.
@@ -166,7 +166,7 @@
\uicontrol Choose to create a \l{UI Files}{UI file} called Button.ui.qml
(for example).
\note Components are listed in \l Library > \uicontrol Components >
\note Components are listed in \uicontrol Components >
\uicontrol {My Components} only if the filename begins with a
capital letter.
@@ -176,7 +176,7 @@
\list 1
\li Click \uicontrol {Design} to edit the UI file in \l {Form Editor}.
\li Select \l Library > \uicontrol Assets > \inlineimage icons/plus.png
\li Select \uicontrol Assets > \inlineimage icons/plus.png
to copy the image files you want to use to the project folder.
\li In \l Navigator, select the root component and set the
width (\uicontrol W) and height (\uicontrol H) of the button in the
@@ -184,9 +184,8 @@
you plan to use. This specifies the initial size of the button
component.
\li Drag-and-drop two \uicontrol {Border Image} components from
\uicontrol Library > \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic to the root
component in \uicontrol Navigator.
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Basic to the root component in \uicontrol Navigator.
\li Drag-and-drop a \uicontrol Text component to the root component.
\li Drag-and-drop a \uicontrol {Mouse Area} to the root component.
\li Select a border image to edit the values of its properties:
@@ -271,7 +270,7 @@
To be useful, the button component has to be created in a project.
When you work on other files in the project to create screens
or other components for the UI, the button component appears in
\l Library > \uicontrol Components > \uicontrol {My Components}.
\uicontrol Components > \uicontrol {My Components}.
You can drag-and-drop it to \uicontrol {Form Editor} or
\uicontrol Navigator to create button instances and modify the values
of their properties to assign them useful IDs, change their appearance,

View File

@@ -38,7 +38,7 @@
To create component instances and edit their properties:
\list 1
\li Drag-and-drop components from \uicontrol Library (1) to
\li Drag-and-drop components from \uicontrol Components (1) to
\l Navigator (2), \l {Form Editor} (3), or \l {3D Editor} (4).
This creates instances of the components in the current
component file.

View File

@@ -37,9 +37,9 @@
\image qtquick-components-custom.png "Custom components in My Components"
Custom components are stored in \l Library > \uicontrol Components >
Custom components are stored in \uicontrol Components >
\uicontrol {My Components}. You can create instances of custom components
by dragging-and-dropping them from \uicontrol Library to \l {Form Editor},
by dragging-and-dropping them from \uicontrol Components to \l {Form Editor},
\l {3D Editor}, or \l Navigator.
\section1 Creating Components from Scratch
@@ -54,12 +54,12 @@
\uicontrol {Qt Quick Files} > \uicontrol {Qt Quick UI File} >
\endif
\uicontrol Choose to create a new \c .ui.qml file.
\note Components are listed in \uicontrol Library >
\uicontrol Components > \uicontrol {My Components} only
if the filename begins with a capital letter.
\note Components are listed in \uicontrol Components >
\uicontrol {My Components} only if the filename begins with a
capital letter.
\li Click \uicontrol Design to open the file in
\uicontrol {Form Editor}.
\li Drag-and-drop a component from \uicontrol Library to
\li Drag-and-drop a component from \uicontrol Components to
\uicontrol Navigator or \uicontrol {Form Editor}.
\li Edit component properties in the \uicontrol Properties view.
The available properties depend on the component type. You can
@@ -134,7 +134,7 @@
\l{Progress Bar}.
\endif
Custom components are listed in \uicontrol Library > \uicontrol Components
Custom components are listed in \uicontrol Components
> \uicontrol {My Components}, and you can use instances of them to build
more components.

View File

@@ -32,7 +32,7 @@
\endif
\nextpage quick-preset-components.html
\title Components
\title Using Components
A \e component is a reusable building block for a UI.
@@ -57,7 +57,7 @@
\l{Turning Component Instances into Custom Components}
{move component instances into separate component files}.
Select \l Library > \uicontrol Components to view the preset components that
Select \uicontrol Components to view the preset components that
have been added to your project. If you cannot find the components you need,
add the relevant modules to your project, as described in
\l {Adding and Removing Modules}.

View File

@@ -32,7 +32,7 @@
You can create instances of preset UI controls to inform users about
the progress of the application or to gather input from users. They are
available in \l Library > \uicontrol Components >
available in \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls.
\image qtquick-designer-qtquickcontrols-types.png "Qt Quick Controls components in Library"
@@ -111,7 +111,7 @@
\section2 Button
You can create an instance of \l Library > \uicontrol Components >
You can create an instance of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls > \uicontrol Button:
\image qtquickcontrols2-button.gif "Qt Quick Controls - Button"
@@ -178,7 +178,7 @@
\section2 Check Box
You can create instances of \l Library > \uicontrol Components >
You can create instances of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls >
\uicontrol {Check Box}:
@@ -272,7 +272,7 @@
\section2 Switch
You can create an instance of \l Library > \uicontrol Components >
You can create an instance of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls > \uicontrol Switch:
\image qtquickcontrols2-switch.gif "Switch"
@@ -458,7 +458,7 @@
\target slider-control
\section2 Slider and Dial
You can create an instance of \l Library > \uicontrol Components >
You can create an instance of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls > \uicontrol Slider:
\image qtquickcontrols2-slider.gif "Slider"
@@ -480,7 +480,7 @@
devices such as stereos or industrial equipment. It allows users to
specify a value within a range.
You can create an instance of \l Library > \uicontrol Components >
You can create an instance of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls > \uicontrol Dial:
\image qtquickcontrols2-dial-no-wrap.gif "Dial"
@@ -530,7 +530,7 @@
\section2 Spin Box
You can create an instance of \l Library > \uicontrol Components >
You can create an instance of \uicontrol Components >
\uicontrol {Qt Quick Controls} > \uicontrol Controls >
\uicontrol {Spin Box}:
@@ -711,7 +711,7 @@
\section1 Summary of UI Controls
The following table lists preset UI controls with links to their developer
documentation. They are available in \l Library > \uicontrol Components >
documentation. They are available in \uicontrol Components >
\uicontrol {Qt Quick Controls}. The \e MCU column indicates which controls
are supported on MCUs.

View File

@@ -58,7 +58,7 @@
Create instances of \uicontrol {List View} and \uicontrol {Grid View}
components to organize other component instances in list or grid format.
They are available in \l Library > \uicontrol Components >
They are available in \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Views.
A \uicontrol {List View} organizes other components as a list, whereas a
@@ -169,7 +169,7 @@
\list 1
\li Drag-and-drop a \uicontrol {Grid View} or \uicontrol {List View}
from \uicontrol Library > \uicontrol Components >
from \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Views to
\uicontrol Navigator or \uicontrol {Form Editor}.
\li Right-click the view in \uicontrol Navigator, and select
@@ -185,7 +185,7 @@
You can replace the default model and delegate with other,
more complex models and delegates in \l {Text Editor}.
\l{ItemDelegate}{Item Delegate} and \l{SwipeDelegate}{Swipe Delegate}
components are also available in \uicontrol Library > \uicontrol Components
components are also available in \uicontrol Components
> \uicontrol {Qt Quick Controls}.
\include qtquick-pathview-editor.qdocinc pathview
@@ -197,7 +197,7 @@
The following table lists the components that you can use to add data models
to UIs. The \e Location column indicates the location of the component in
\l Library > \uicontrol Components. The \e MCU column indicates which
\uicontrol Components. The \e MCU column indicates which
components are supported on MCUs.
\table

View File

@@ -34,9 +34,9 @@
The Image component is used for adding images to the UI in several supported
formats, including bitmap formats, such as PNG and JPEG, and vector graphics
formats, such as SVG. To use any image files in your designs, you need to
first add them to \l Library:
first add them to \l Assets:
\list 1
\li Select \uicontrol Library > \uicontrol Assets
\li Select \uicontrol Assets
> \inlineimage icons/plus.png
.
\li Select the image file, and then select \uicontrol Open.
@@ -45,12 +45,12 @@
\li Select \uicontrol OK.
\endlist
Your image is now available in \uicontrol Library > \uicontrol Assets.
Your image is now available in \uicontrol Assets.
\image qtquick-designer-image-type.png "Image component in different views"
When you drag-and-drop an image file from \uicontrol Library >
\uicontrol Assets to \l Navigator or \l {Form Editor}, \QC automatically
When you drag-and-drop an image file from \uicontrol Assets to \l Navigator
or \l {Form Editor}, \QC automatically
creates an instance of the Image component for you with the path to the
image file set as the value of the \uicontrol Source field in
\uicontrol Properties.
@@ -235,7 +235,7 @@
The following table lists the components that you can use to add images.
The \e Location column contains the tab name where you can find the
component in \l Library > \uicontrol Components. The \e MCU column
component in \uicontrol Components. The \e MCU column
indicates which components are supported on MCUs.
\table

View File

@@ -309,7 +309,7 @@
Positioner components are containers that manage the positions of their
child components. For many use cases, the best positioner to use is a simple
column, row, flow, or grid. You can use the components available in
\l Library > \uicontrol Components > \uicontrol {Default Components} >
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Positioner to position the children of a component in these
formations in the most efficient manner possible.
@@ -382,7 +382,7 @@
\section3 Summary of Positioners
The following table lists the positioners that you can use to arrange
components in UIs. They are available in \l Library > \uicontrol Components
components in UIs. They are available in \uicontrol Components
> \uicontrol {Default Components} > \uicontrol Positioner.
\table
@@ -415,7 +415,7 @@
Since Qt 5.1, you can use QML types in the \l{qtquicklayouts-index.html}
{Qt Quick Layouts} module to arrange components in UIs.
\else
You can use the components available in \l Library > \uicontrol Components
You can use the components available in \uicontrol Components
> \uicontrol {Qt Quick Layouts} to arrange components in UIs.
\endif
Unlike positioners, layouts manage both the positions and sizes of their
@@ -501,7 +501,7 @@
\section3 Summary of Layouts
The following table lists the layout components that you can use to arrange
components in UIs. They are available in \l Library > \uicontrol Components
components in UIs. They are available in \uicontrol Components
> \uicontrol {Qt Quick Layouts}.
\table
@@ -540,7 +540,7 @@
The following table lists the UI controls that you can use to organize
components in UIs (since Qt 5.7). The \e Location column indicates the
location of the component in \l Library > \uicontrol Components.
location of the component in \uicontrol Components.
\table
\header

View File

@@ -31,10 +31,10 @@
\title Preset Components
To use preset components, add the modules that contain them to your project
by selecting \l Library > \uicontrol Components > \inlineimage icons/plus.png
by selecting \uicontrol Components > \inlineimage icons/plus.png
. For more information, see \l{Adding and Removing Modules}. You can then
create instances of the components by dragging-and-dropping them from
\uicontrol Library to \l {Form Editor}, \l {3D Editor}, or \l Navigator.
\uicontrol Components to \l {Form Editor}, \l {3D Editor}, or \l Navigator.
To edit the appearance of a component instance, select it in
\uicontrol {Form Editor}, \uicontrol {3D Editor}, or \uicontrol Navigator

View File

@@ -36,7 +36,7 @@
according to your needs. The values of some properties of the controls are
specified by using styling, and therefore you cannot change them.
However, you can use some of the components in \l Library to draw
However, you can use some of the components in \l Components to draw
basic shapes, such as rectangles. In addition, \QDS comes with a set of
more powerful and flexible graphical primitives, that allow creating more
complex shapes, such as borders, triangles, arcs, and pies in
@@ -50,7 +50,7 @@
\image qml-shapes.png "Shapes in Form Editor"
\endif
Most visual components in \uicontrol Library are based on the \l [QtQuick]
Most visual components in \uicontrol Components are based on the \l [QtQuick]
{Item} component. Even though it has no visual appearance itself (similarly
to a mouse area, for example), it defines all the properties that are
common across visual components, such as position, size, and visibility. For
@@ -102,7 +102,7 @@
If you want to modify each corner of the rectangle independently
or use a dashed border, create an instance of the \uicontrol Rectangle
component available in \uicontrol Library > \uicontrol Components >
component available in \uicontrol Components >
\uicontrol {Qt Quick Studio Components} instead of the basic
\uicontrol Rectangle component available in \uicontrol {Default Components}
> \uicontrol Basic.
@@ -242,7 +242,7 @@
The following table lists the components that you can use to draw shapes.
The \e Location column indicates the location of the component in
\l Library > \uicontrol Components. The \e MCU column indicates which
\uicontrol Components. The \e MCU column indicates which
components are supported on MCUs.
\table

View File

@@ -45,7 +45,7 @@
\youtube yOUdg1o2KJM
To create a label with a background, use the \uicontrol Label
component available in \l Library > \uicontrol Components >
component available in \uicontrol Components >
\uicontrol {Qt Quick Controls}. The module also contains components
for creating \uicontrol {Text Field} and \uicontrol {Text Area} controls.
They differ from the basic components in that a common style is applied
@@ -119,10 +119,10 @@
\image qtquick-designer-text-properties.png "Character properties"
To display custom fonts in the list of available fonts in the
\uicontrol Font field, you need to first add them to \l Library:
\uicontrol Font field, you need to first add them to \l Assets:
\list 1
\li Select \uicontrol Library > \l Assets
\li Select \uicontrol Assets
> \inlineimage icons/plus.png
.
\li Select the font file, and then select \uicontrol Open.
@@ -422,7 +422,7 @@
The following table lists the components that you can use to add text to
UIs. The \e Location column contains the tab name where you can find the
component in \l Library > \uicontrol Components. The \e MCU column
component in \uicontrol Components. The \e MCU column
indicates which components are supported on MCUs.
\table

View File

@@ -33,7 +33,7 @@
You can create instances of preset basic components to add interaction
methods to UIs, such as performing actions by using a pointing device or
the keyboard, or flicking the visible area of the screen horizontally or
vertically. They are availabe in \l Library > \uicontrol Components >
vertically. They are availabe in \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic.
In addition, you can create instances of preset \l{UI Controls} to inform
@@ -318,7 +318,7 @@
The following table lists the components that you can use to add basic
interaction methods to UIs with links to their developer documentation.
They are availabe in \l Library > \uicontrol Components >
They are availabe in \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic. The \e MCU column
indicates which components are supported on MCUs.

View File

@@ -221,7 +221,7 @@
\c complete() functions.
You can create instances of preset animation components available in
\l Library > \uicontrol Components > \uicontrol {Default Components} >
\uicontrol Components > \uicontrol {Default Components} >
\uicontrol Animation to create animations depending on the type of the
property and the behavior that you want.

View File

@@ -45,7 +45,7 @@
To add fonts:
\list 1
\li Select \uicontrol Library > \l Assets
\li Select \uicontrol Assets
> \inlineimage icons/plus.png
.
\li Browse to the folder that contains the font files and select them,

View File

@@ -51,13 +51,13 @@
In \QC, you build UIs around the behavior of \l{glossary-component}
{components} and how they connect with one another. You can use preset
components available in the \l Library view or combine them to create
components available in the \l Components view or combine them to create
your own components. You can specify values for the \e properties of a
component to change its appearance and behavior. All components have a
set of predefined properties, some of which control things that are
visible to users, while others are used behind the scene.
You drag-and-drop the preset components from the \uicontrol Library view
You drag-and-drop the preset components from the \uicontrol Components view
to the \l {Form Editor}, \l{3D Editor}, or \l Navigator view to create
instances of them. You then change the instances to your liking by modifying
their properties in the \l Properties view. The application code is
@@ -76,7 +76,7 @@
the user experience of the application.
\endif
\li \l {Components}
\li \l {Using Components}
\QDS comes with \e {preset components} that you can use in
wireframes and prototypes by creating instances of them.

View File

@@ -148,9 +148,8 @@
You can specify effects, such as a blur effect, to use for a group or layer.
The QML types supported by \QDS are listed in the \uicontrol {Components}
tab in the \l {Library} in the Design mode of \QDS. For more
information, see \l{Components}.
The QML types supported by \QDS are listed in the \l {Components}
view in the Design mode of \QDS.
You can also specify values for the properties of the component or create
\l{Property Aliases}{property aliases} to fetch the values from other

View File

@@ -68,13 +68,13 @@
to replace transition lines with connections to real signals
from UI controls, as described in \l{Simulating Events}.
\li To set up alternative pathways between flow items, use
\uicontrol {Flow Decision} components from \l Library >
\uicontrol {Flow Decision} components from
\uicontrol Components > \uicontrol {Flow View}, as described in
\l{Simulating Conditions}.
\li Use \l{Adding States}{states} in flows to modify the appearance
of components on screens in response to user interaction, as
described in \l{Applying States in Flows}.
\li Use \uicontrol {Flow Wildcard} components from \uicontrol Library >
\li Use \uicontrol {Flow Wildcard} components from
\uicontrol Components > \uicontrol {Flow View} to prioritize events
from other applications and to stop some screens from appearing on
others, as described in \l{Reacting to External Events}.
@@ -177,20 +177,20 @@
If you \l{Importing 2D Assets}{imported} your screen designs from a
design tool as individual \l{glossary-component}{components}
(\e {.ui.qml} files), you can use them as content for flow items.
The imported components are listed in \l Library > \uicontrol Components
The imported components are listed in \uicontrol Components
> \uicontrol {My Components}.
If you are building your UI from scratch in \QDS, you must first add
components to the flow items to create the screens as you would any
components. For more information, see \l {Components}. The
components. For more information, see \l {Using Components}. The
flow items that you attach the components to are listed under
\uicontrol {My Components}.
\image studio-flow-item.png "Custom Flow Item in Library"
\note You must use the wizard to create the flow items. After you create
a flow view, the \uicontrol {Flow View} module is added to \uicontrol Library
> \uicontrol Components. It contains a \uicontrol {Flow Item} component that
a flow view, the \uicontrol {Flow View} module is added to
\uicontrol Components. It contains a \uicontrol {Flow Item} component that
you can use to \l{Applying States in Flows}{apply states to flow items}, and
that you should use solely for that purpose.
@@ -203,16 +203,16 @@
to create flow items for each screen in the UI.
\li Add content to the flow item in one of the following ways:
\list
\li Drag-and-drop components from \uicontrol Library to a flow
item in \l {Form Editor} or \l Navigator.
\li Drag a screen from \uicontrol Library > \uicontrol Components
\li Drag-and-drop components from \uicontrol Components to a
flow item in \l {Form Editor} or \l Navigator.
\li Drag a screen from \uicontrol Components
> \uicontrol {My Components} to a flow item in
\uicontrol {Form Editor} or \uicontrol Navigator.
\endlist
\li In \l Properties, edit the properties of each flow item.
\endlist
You can now drag the flow items from \uicontrol Library > \uicontrol Components
You can now drag the flow items from \uicontrol Components
> \uicontrol {My Components} to the flow view in \uicontrol {Form Editor}
or \uicontrol Navigator. When you have all the flow items in place, you can
\l{Adding Action Areas and Transitions}{add action areas} to them to create
@@ -573,7 +573,7 @@
To simulate conditions:
\list 1
\li Drag a \uicontrol {Flow Decision} component from \l Library >
\li Drag a \uicontrol {Flow Decision} component from
\uicontrol Components \uicontrol {Flow View} to a
\l{Adding Flow Views}{flow view} in \l Navigator or \l {Form Editor}.
\li Select the flow item where you want the application to start in
@@ -645,7 +645,7 @@
You can use \l{Adding States}{states} in flows to modify the appearance
of \l{glossary-component}{components} in flow items in response to user
interaction, for example. For this purpose, you use the
\uicontrol {Flow Item} components available in \l Library >
\uicontrol {Flow Item} components available in
\uicontrol Components > \uicontrol {Flow View}.
\list 1
@@ -657,7 +657,7 @@
{flow view} in \l {Form Editor} and drag the flow item to the
flow view in \l Navigator or \l {Form Editor}.
\li Drag an empty \uicontrol {Flow Item} component from
\uicontrol Library > \uicontrol Components > \uicontrol {Flow View}
\uicontrol Components > \uicontrol {Flow View}
to the flow for each state that you added.
\li In \l Properties, in the \uicontrol {State change target}
field, select the flow item that you created using the wizard.
@@ -694,7 +694,7 @@
To use wildcards:
\list 1
\li Drag a \uicontrol {Flow Wildcard} component from \l Library >
\li Drag a \uicontrol {Flow Wildcard} component from
\uicontrol Components > \uicontrol {Flow View} to an
\l{Adding Action Areas and Transitions}{action area} in \l Navigator
or \l {Form Editor}.

View File

@@ -94,7 +94,7 @@
Yes, you can create custom components and controls by using wizard templates
or move component instances into separate files to turn them into new
components that you can create instances of. For more information, see
\l {Components}.
\l {Using Components}.
\section2 What are the 3D import formats for \QDS?

View File

@@ -36,18 +36,18 @@
To import an asset, drag-and-drop the external file containing the asset from,
for example, File Explorer on Windows, to \uicontrol {Form Editor},
\uicontrol Navigator, or \uicontrol {Text Editor}. Alternatively, select
\l Library > \uicontrol Assets > \inlineimage icons/plus.png
\uicontrol Assets > \inlineimage icons/plus.png
and follow the instructions in the \uicontrol {Asset Import} dialog. You can
also multiselect several external asset files to drag-and-drop them to
\QDS simultaneously.
The imported images will appear in \uicontrol Library > \uicontrol Assets.
The imported images will appear in \uicontrol Assets.
If you initiate the import by dragging the assets to \uicontrol {Form Editor},
they are also added to your projects as image components, and you can view
them in \uicontrol {Form Editor} and \uicontrol Navigator. If you drag an
external font file to \uicontrol {Form Editor}, it will be added to your
project as a text component. Other imported assets, such as sound files,
will only appear in \uicontrol Library > \uicontrol Assets, and you can then
will only appear in \uicontrol Assets, and you can then
drag-and-drop them to a suitable view.
\section1 Importing Designs From Other Design Tools
@@ -76,7 +76,7 @@
create an empty project.
\li In \uicontrol Projects, double-click \e Screen01.ui.qml to move to
the Design mode.
\li Select \l Library > \uicontrol Assets > \inlineimage icons/plus.png
\li Select \uicontrol Assets > \inlineimage icons/plus.png
.
\li Select the folder where you exported the assets.
\li Select \uicontrol {Exported Assets (*.metadata)} in the dropdown
@@ -108,12 +108,12 @@
might take a little while for complex projects.
\endlist
The imported assets are displayed in \uicontrol Library > \uicontrol Assets
The imported assets are displayed in \uicontrol Assets
as PNG images. The components that you specified in the design tool are
displayed in \uicontrol Library > \uicontrol Components >
\uicontrol {My Components} as well as in the \uicontrol Projects view as
separate QML files. To start using them, drag-and-drop them from
\uicontrol Library to \uicontrol {Form Editor} or \l Navigator.
displayed in \uicontrol Components > \uicontrol {My Components} as well as
in the \uicontrol Projects view as separate QML files. To start using them,
drag-and-drop them from \uicontrol Components to \uicontrol {Form Editor} or
\l Navigator.
\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

View File

@@ -153,7 +153,7 @@
\li qtquickcontrols2.conf file specifies the preferred style and some
style-specific arguments.
\li \e fonts folder contains font files that you have added in
\l Library > \uicontrol Assets.
\uicontrol Assets.
\li \e imports folder contains a \e {Constants.qml} file that specifies
a font loader for the Arial font and the screen resolution. The size
of the default Screen.ui.qml \l{basic-rectangle}{Rectangle} should
@@ -163,7 +163,7 @@
For more information, see \l {Module Definition qmldir Files}.
\endlist
To use JavaScript and image files in the UI, select \uicontrol Library >
To use JavaScript and image files in the UI, select
\uicontrol Assets > \inlineimage icons/plus.png
.

View File

@@ -145,8 +145,8 @@
\section2 Importing the Simulink Connector
To integrate the Simulink model into \QDS, you first need to add the
Simulink connector module to your project. In the \l Library view, select
\uicontrol Components > \inlineimage icons/plus.png
Simulink connector module to your project. In the \uicontrol Components
view, select \inlineimage icons/plus.png
> \uicontrol SimulinkConnector. \QDS is now ready to communicate with the
Simulink model.

View File

@@ -106,7 +106,7 @@
text, or images, while others represent complex UI controls with full
functionality, such as spin boxes or sliders. You can also add instances of
preset \l {3D Components}{3D components} to your UIs. You can find all
the preset components in \l Library.
the preset components in \l Components.
To build \l {Creating Component Instances}{your own components}, you can
modify the \l{glossary-property}{properties} of the component instances
@@ -191,7 +191,7 @@
You use templates to create different types of projects according to your
needs. The templates add preset components to the project by default. For
example, if you create a 3D project, preset 3D components are added to it.
You can add more preset components in \uicontrol Library.
You can add more preset components in \uicontrol {Components}.
\image studio-project-wizards.png "New Project dialog"

View File

@@ -39,7 +39,8 @@
\list
\li \l{Form Editor}
\li \l{3D Editor}
\li \l{Library}
\li \l{Components}
\li \l{Assets}
\li \l{Navigator}
\li \l{Properties}
\li \l{Connection View}
@@ -75,7 +76,7 @@
\li \l{Applying States in Flows}
\li \l{Reacting to External Events}
\endlist
\li \l {Components}
\li \l {Using Components}
\list
\li \l{Preset Components}
\list

View File

@@ -58,7 +58,7 @@
\li \b {\l{Wireframing}}
\list
\li \l{Designing Application Flows}
\li \l{Components}
\li \l{Using Components}
\li \l{Specifying Component Properties}
\li \l{Scalable Layouts}
\li \l{Annotating Designs}

View File

@@ -166,7 +166,7 @@
\section2 Importing Assets
\list 1
\li Select \uicontrol Library > \uicontrol Assets > \inlineimage icons/plus.png
\li Select \uicontrol Assets > \inlineimage icons/plus.png
.
\image exporting-from-qt3ds/09-add-new-assets.png
@@ -178,18 +178,17 @@
Close.
\image exporting-from-qt3ds/11-import.png "Import the file"
\li The 2D assets imported from \Q3DS now appear in \uicontrol Library
> \uicontrol Assets.
\li The 2D assets imported from \Q3DS now appear in > \uicontrol Assets.
\image exporting-from-qt3ds/12-imported-image-assets.png "Imported assets in Library"
\li The QML components generated from the imported \Q3DS project now appear
as available imports in \uicontrol Library under \uicontrol {QML Types}.
as available imports in \uicontrol Components under \uicontrol {QML Types}.
Select \uicontrol Quick3DAssets.MyOwnCluster to import them to your
project.
\image exporting-from-qt3ds/13-myowncluster-in-qml-types.png "Available imports in QML Types"
\li The imported QML types now appear in \uicontrol Library and can be added
to the project.
\li The imported QML types now appear in \uicontrol Components and can be
added to the project.
\image exporting-from-qt3ds/14-add-myowncluster-to-project.png "MyOwnCluster in Library"
\endlist
@@ -197,7 +196,7 @@
\list 1
\li Drag \uicontrol MyOwnCluster from \uicontrol {My Quick3D Components}
in \uicontrol Library to \uicontrol {Form Editor}.
in \uicontrol Components to \uicontrol {Form Editor}.
\image exporting-from-qt3ds/15-drag-to-project.png "Drag MyOwnCluster to Form Editor"
\li In \uicontrol Navigator, right click on myOwnCluster and select \uicontrol
@@ -222,7 +221,7 @@
\section2 Converting 3D Elements
\list 1
\li Drag subpresentation_ADAS from \uicontrol Library > \uicontrol Components
\li Drag subpresentation_ADAS from \uicontrol Components
> {My 3D Components} into layer folder in \uicontrol Navigator.
\image exporting-from-qt3ds/20-drag-subpresentation-adas-into-layer.png "Drag into layer"

View File

@@ -41,9 +41,9 @@
\image studio-qtquick-3d-components.png "Qt Quick 3D components in Library"
Add a camera by dragging-and-dropping one of the camera components from
\l Library > \uicontrol Components > \uicontrol {Qt Quick 3D} > \uicontrol
\uicontrol Components > \uicontrol {Qt Quick 3D} > \uicontrol
{Qt Quick 3D} to \l {3D Editor} or to a 3D view in \l Navigator.
If the cameras are not displayed in \uicontrol Library, add the
If the cameras are not displayed in \uicontrol {Components}, add the
\uicontrol QtQuick3D module to your project, as described in
\l {Adding and Removing Modules}.

View File

@@ -40,7 +40,7 @@
implements all the functions needed to calculate the shaded color. The
material system also offers ready-made functions to help you implement
the material. If the 3D effects and materials are not displayed in
\l Library, you should add the \uicontrol QtQuick3D.Effects and
\l Components, you should add the \uicontrol QtQuick3D.Effects and
\uicontrol QtQuick3D.Materials modules to your project, as described in
\l {Adding and Removing Modules}.
@@ -49,12 +49,12 @@
two-sided polygons, index-of-refraction, and fragment cutoff (masking).
For more information, see \l {Qt Quick 3D Custom Material Reference}.
Use the components in \uicontrol Library > \uicontrol Components >
Use the components in \uicontrol Components >
\uicontrol QtQuick3D > \uicontrol {Qt Quick 3D Custom Shader Utils} to
create custom effects and materials. You can find the \uicontrol Effect
component in \uicontrol Library > \uicontrol {QtQuick3D Effects} > \uicontrol
component in \uicontrol Components > \uicontrol {QtQuick3D Effects} > \uicontrol
{Qt Quick 3D Custom Shader Utils}, and the \uicontrol {Custom Material}
component in \uicontrol Library > \uicontrol {QtQuick3D Materials} >
component in \uicontrol Components> \uicontrol {QtQuick3D Materials} >
\uicontrol {Qt Quick 3D Custom Shader Utils}. For more information about the
shader utilities and commands and their properties, see
\l {Custom Shaders}.
@@ -83,7 +83,7 @@
\list 1
\li Drag-and-drop an \uicontrol {Effect} component from the
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
\uicontrol Library to a Model component in \l Navigator.
\uicontrol Component to a Model component in \l Navigator.
\li Select the custom effect component in \uicontrol Navigator to edit
the values of its properties in the \l Properties view.
\image studio-qtquick-3d-custom-effect.png "Custom effect properties"
@@ -93,7 +93,7 @@
for its properties in \uicontrol Properties.
\image studio-qtquick-3d-pass.png "Pass properties"
\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 Component to the custom material in
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
\uicontrol {Depth Input}, \uicontrol {Render State}, and
@@ -135,7 +135,7 @@
\list 1
\li Drag-and-drop a \uicontrol {Custom Material} component from the
\uicontrol {Qt Quick 3D Custom Shader Utils} tab of
\uicontrol Library to a Model component in \uicontrol Navigator.
\uicontrol Component to a Model component in \uicontrol Navigator.
\li Select the custom material component in \uicontrol Navigator to
edit the values of its properties in the \uicontrol Properties view.
\image studio-qtquick-3d-custom-material.png "Custom material properties"
@@ -160,7 +160,7 @@
for its properties in \uicontrol Properties.
\image studio-qtquick-3d-pass.png "Pass properties"
\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 Component to the pass component in
\uicontrol Navigator: \uicontrol Blending, \uicontrol {Buffer Blit},
\uicontrol {Buffer Input}, \uicontrol {Cull Mode},
\uicontrol {Depth Input}, \uicontrol {Render State}, and
@@ -171,7 +171,7 @@
component to the custom material. Then select the buffer in the
\uicontrol Buffer field.
\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 Component to the pass component in
\uicontrol Navigator. The shader components are created at the same
level as the pass component and automatically added to the
\uicontrol Shaders field.

View File

@@ -32,24 +32,25 @@
\title Custom Shaders
You can use the 3D shader utilities and commands available in \l Library
You can use the 3D shader utilities and commands available in
> \uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D Custom Shader Utilities} to create your own effects
and materials.
If the custom shader utilities are not displayed in \uicontrol Library, add
the \uicontrol QtQuick3D module to your project, as described in
If the custom shader utilities are not displayed in \uicontrol {Components},
add the \uicontrol QtQuick3D module to your project, as described in
\l {Adding and Removing Modules}.
\note If you select \uicontrol {Qt 5} as the \uicontrol {Target Qt Version}
when \l {Creating Projects}{creating your project}, the available custom
shader utilities and their properties will be slightly different, and some
of the components can be found in different locations in \uicontrol Library.
of the components can be found in different locations in
\uicontrol {Components}.
\image studio-qtquick-3d-shader-utilities.png "Custom shader utilities in Library"
You can find additional shader utilities, the \uicontrol Effect and
\uicontrol {Custom Material} components, in \uicontrol Library >
\uicontrol {Custom Material} components, in
\uicontrol Components > \uicontrol {Qt Quick3D} > \uicontrol {Qt Quick 3D}.
\image studio-qtquick-3d-components.png "Effect and Custom Material Components in Library"

View File

@@ -44,7 +44,7 @@
\l{Lights}{light}, \l{3D Models}{model}, and
\l {Materials and Shaders}{materials}. If your scene did not contain
them, you can add the corresponding \l {3D Components}{Qt Quick 3D}
components from \l Library > \uicontrol Components > \inlineimage icons/plus.png
components from \uicontrol Components > \inlineimage icons/plus.png
> \uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D}.
You can use the \l{Summary of the 3D Editor Toolbar Buttons}{toolbar buttons}
@@ -120,7 +120,7 @@
You can use scene cameras (2) to view the \uicontrol View3D component from a
specific angle in \l {Form Editor} while editing scenes. Different types of
cameras are available in \uicontrol Library > \uicontrol Components
cameras are available in \uicontrol Components
> \uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D}. For more information
about using cameras in the scene, the available camera types, and their
properties, see \l{Cameras}.

View File

@@ -33,12 +33,12 @@
\title 3D Effects
\QDS provides a set of 3D effects, which are visible in \l {Form Editor}.
To apply a visual effect to a scene, drag-and-drop an effect from \l Library
> \uicontrol Components > \uicontrol {Qt Quick 3D} >
To apply a visual effect to a scene, drag-and-drop an effect from
\uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D Effects} to a \uicontrol View3D component in
\l Navigator.
You can use the \l Effect component available in \uicontrol Library >
You can use the \l Effect component available in \uicontrol Components >
\uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D} as the base
component for creating custom post-processing effects. For more information,
see \l {Custom Effects and Materials} and \l {Custom Shaders}.
@@ -51,7 +51,7 @@
{Scene Environment} component in \uicontrol Navigator to view the applied
effects in \l Properties > \uicontrol {Scene Environment} > \uicontrol Effect.
If the effects are not displayed in \l Library, you should add the
If the effects are not displayed in \l Components, you should add the
\uicontrol QtQuick3D.Effects module to your project, as described in
\l {Adding and Removing Modules}.

View File

@@ -36,13 +36,13 @@
the \l Properties view simultaneously.
To add a \uicontrol Group component
to your scene, drag-and-drop it from \l Library > \uicontrol Components >
to your scene, drag-and-drop it from \uicontrol Components >
\uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D} to the \l {3D Editor}
view or to \l Navigator > \uicontrol View3D > \uicontrol {Scene Environment}
> \uicontrol Scene.
If the \uicontrol Group component is not displayed in
\uicontrol Library, you should add the \uicontrol {Qt Quick 3D} module to
\uicontrol {Components}, you should add the \uicontrol {Qt Quick 3D} module to
your project, as described in \l {Adding and Removing Modules}.
Select the \uicontrol Group component in \uicontrol Navigator to modify

View File

@@ -59,13 +59,13 @@
The 3D asset you dragged-and-dropped to \uicontrol {3D Editor} has now
been added to your scene, and you can see it in the \uicontrol {3D Editor}
view and in \uicontrol Navigator. It is also available in
\uicontrol Library > \uicontrol Components > \uicontrol {My 3D Components}.
\uicontrol Components > \uicontrol {My 3D Components}.
Alternatively, you can initiate the import dialog from the
\uicontrol Library view:
\uicontrol Assets view:
\list 1
\li In the \l{Design Views}{Design mode}, select \l Library >
\li In the \l{Design Views}{Design mode}, select
\uicontrol Assets > \inlineimage icons/plus.png
.
\li Select \uicontrol {3D Assets} in the dropdown menu to filter 3D
@@ -77,7 +77,7 @@
\li When the import is done, select \uicontrol Close.
\endlist
The 3D asset now appears in \uicontrol Library > \uicontrol Components >
The 3D asset now appears in \uicontrol Components >
\uicontrol {My 3D Components}. You can add it to the scene by
drag-and-dropping it to \uicontrol {3D Editor}.
@@ -88,7 +88,7 @@
or with other 3D graphics tools. See the tooltips in the options dialog
for more information about a particular option.
The 3D asset you added to the project now appears in \uicontrol Library >
The 3D asset you added to the project now appears in
\uicontrol Components > \uicontrol {My 3D Components}. You can add it to
your UI by dragging-and-dropping it to \l {3D Editor}.
*/

View File

@@ -40,8 +40,8 @@
instance is modified relative to the base model.
You can add instancing to your scenes by using the instancing components
available in \uicontrol Library > \uicontrol Components >
\uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D}:
available in \uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D}:
\list
\li \uicontrol {Instancing}
\li \uicontrol {Instance List}
@@ -70,7 +70,7 @@
QML type.
To use the \uicontrol Instancing component, drag-and-drop it from
\uicontrol Library to \uicontrol Scene in \uicontrol Navigator.
\uicontrol Components to \uicontrol Scene in \uicontrol Navigator.
\section2 Instancing Properties
@@ -107,7 +107,7 @@
To build an instance table:
\list 1
\li Drag-and-drop an \uicontrol {Instance List} component from
\uicontrol Library > \uicontrol Components > \uicontrol {Qt Quick 3D}
\uicontrol Components > \uicontrol {Qt Quick 3D}
> \uicontrol {Qt Quick 3D} to \uicontrol Scene in
\uicontrol Navigator.
\li Drag-and-drop \uicontrol {Instance List Entry} components to the

View File

@@ -36,11 +36,11 @@
As a secondary light source, you can use \l{Setting the Light Probe}
{image-based lighting}.
To add light components to your UI, drag-and-drop them from \l Library
> \uicontrol Components > \uicontrol {Qt Quick 3D} to \l {3D Editor} or to
To add light components to your UI, drag-and-drop them from
\uicontrol Components > \uicontrol {Qt Quick 3D} to \l {3D Editor} or to
\l Navigator > \uicontrol {Scene Environment} > \uicontrol Scene.
If you cannot find the light components in \uicontrol Library, add the
If you cannot find the light components in \uicontrol {Components}, add the
\uicontrol {Qt Quick 3D} module to your project as instructed in
\l {Adding and Removing Modules}.

View File

@@ -44,7 +44,7 @@
should not be created unnecessarily for performance reasons.
Add a \uicontrol Loader3D component to your scene by drag-and-dropping it
from \uicontrol Library > \uicontrol Components > \uicontrol {Qt Quick 3D} >
from \uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D} to \uicontrol Scene in \uicontrol Navigator.
For more information, see the \l{https://doc.qt.io/qt/qml-qtquick3d-loader3d.html}

View File

@@ -221,7 +221,7 @@
\section1 Applying Materials to Models
To apply materials to models, you should first delete the default material,
and then drag-and-drop a new material from \l Library to a model component
and then drag-and-drop a new material from \l Assets to a model component
in \l Navigator.
You can apply the same material to another component as well. Again,

View File

@@ -33,7 +33,7 @@
\title 3D Materials
\QDS provides a set of pregenerated \uicontrol {Qt Quick 3D}
materials. If the 3D materials are not displayed in \uicontrol Library,
materials. If the 3D materials are not displayed in \uicontrol {Components},
you can add the \uicontrol QtQuick3D.Materials module to your project,
as described in \l {Adding and Removing Modules}. However, since using the
pregenerated 3D materials may cause performance issues, we advice you to
@@ -47,7 +47,7 @@
\uicontrol {Target Qt Version} when \l {Creating Projects}{creating your project}.
To apply a 3D material to a component, you should first delete the default
material and then drag-and-drop a new material from \l Library >
material and then drag-and-drop a new material from
\uicontrol Components > \uicontrol {Qt Quick 3D Materials} >
\uicontrol {Qt Quick 3D Materials} to a model component in \l Navigator.
The materials you add to the model are listed in the model component's

View File

@@ -32,7 +32,7 @@
\title 3D Models
The \l Library view features some built-in primitive 3D models. This allows
The \l Components view features some built-in primitive 3D models. This allows
you to add cubes, cones, cylinders, and planes (rectangles) to your scene.
\image studio-3d-models.png "Various 3D models in 3D Editor"
@@ -41,10 +41,10 @@
component is shaded by using materials. For more information, see
\l {Materials and Shaders} and \l {Creating Custom Materials}.
You can drag-and-drop a model from \uicontrol Library > \uicontrol Components
You can drag-and-drop a model from \uicontrol Components
> \uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D} to \l {3D Editor} or
to \l Navigator > \uicontrol {Scene Environment} > \uicontrol Scene. If the
models are not displayed in \uicontrol Library, you should add the
models are not displayed in \uicontrol {Components}, you should add the
\uicontrol QtQuick3D module to your project, as described in
\l {Adding and Removing Modules}.
@@ -79,8 +79,8 @@
Set the \uicontrol Instancing property to render a number of instances of
the model as defined by an instancing table. The instancing tables can be
defined by using one of the \l{Instanced Rendering}{instancing components}
available in \uicontrol Library > \uicontrol Components >
\uicontrol {Qt Quick 3D} > {Qt Quick 3D}.
available in \uicontrol Components > \uicontrol {Qt Quick 3D}
> {Qt Quick 3D}.
Set the \uicontrol {Instance root} property to define the origin of the
instance's coordinate system.

View File

@@ -43,7 +43,7 @@
a mesh, which also contains morph targets, and import it to \QDS.
To add a morph target for a model in \QDS, drag-and-drop a
\uicontrol {Morph Target} component from \l Library > \uicontrol Components
\uicontrol {Morph Target} component from \uicontrol Components
> \uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D} to \uicontrol Scene in
\l Navigator. Then select the model in \uicontrol Navigator, and in
\l Properties > \uicontrol Model > \uicontrol {Morph Targets}, select the

View File

@@ -50,7 +50,7 @@
\section1 Adding a Particle System
Preset particle components are available in \l Library >
Preset particle components are available in
\uicontrol Components > \uicontrol {Qt Quick 3D Particles 3D}
after you add the \uicontrol {QtQuick3D.Particles3D} module to
your project, as instructed in \l{Adding and Removing Modules}.
@@ -86,15 +86,14 @@
To add a particle system that emits sprite particles:
\list 1
\li Select \uicontrol Library > \uicontrol Assets > \inlineimage icons/plus.png
\li Select \uicontrol Assets > \inlineimage icons/plus.png
to add your sprites, 3D models, textures, and other graphical
\l{Assets}{assets} to the project.
\li Drag-and-drop an instance of the \uicontrol {Particle System}
component from \uicontrol Library to a scene component instance
component from \uicontrol Components to a scene component instance
in \l Navigator.
\li Drag-and-drop the sprite image from \uicontrol Library >
\uicontrol Assets to the sprite particle instance
in \uicontrol Navigator.
\li Drag-and-drop the sprite image from \uicontrol Assets to the sprite
particle instance in \uicontrol Navigator.
\endlist
Add instances of other components according to your use case. The following

View File

@@ -47,7 +47,7 @@
as the model data relevant to the delegate.
Add a \uicontrol Repeater3D component to your scene by drag-and-dropping it
from \uicontrol Library > \uicontrol Components > \uicontrol {Qt Quick 3D} >
from \uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D} to \uicontrol Scene in \uicontrol Navigator.
\note \uicontrol Repeater3D owns all items it instantiates. Removing or

View File

@@ -36,7 +36,7 @@
how a scene is rendered globally. You can specify settings for antialiasing,
scene background, ambient occlusion, and image-based lighting in the
\l Properties view. The \uicontrol {Scene Environment} component is available
in \l Library > \uicontrol Components > \uicontrol {Qt Quick 3D}. It is
in \uicontrol Components > \uicontrol {Qt Quick 3D}. It is
automatically included under the 3D view component in \l{Creating Projects}
{projects created} using the \uicontrol {Qt Quick 3D Application} wizard
template.

View File

@@ -113,17 +113,17 @@
\section1 Applying Textures to Materials
Drag-and-drop an image from \l Library > \l Assets on a material to
Drag-and-drop an image from \l Assets on a material to
create a texture component. Dragging an image to a default or principled
material opens a \uicontrol {Select Texture Property} dialog. You can select
the property to attach the texture to in the \uicontrol {Set texture to property}
field. For a custom material, you must assign the texture to a map. If the
\uicontrol Texture component is not displayed in \uicontrol Library, you
should add the \uicontrol {Qt Quick 3D} module to your project, as described
in \l {Adding and Removing Modules}.
\uicontrol Texture component is not displayed in \uicontrol {Components},
you should add the \uicontrol {Qt Quick 3D} module to your project, as
described in \l {Adding and Removing Modules}.
To use Texture components to apply textures to materials, drag-and-drop a
Texture component from \uicontrol Library > \uicontrol Components >
Texture component from \uicontrol Components >
\uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D} to a material component
in \l Navigator. The new texture should now be visible in \l {Form Editor}
and \l {3D Editor}. \note If the colors in your texture are not visualized

View File

@@ -32,8 +32,8 @@
To create a Qt Quick 3D UI project, we recommend using a \uicontrol
{Qt Quick 3D Application} wizard template that adds the
\l {3D Components}{Qt Quick 3D} components to \l Library >
\uicontrol Components and contains a 3D view. A 3D view component includes a
\l {3D Components}{Qt Quick 3D} components to \uicontrol Components
and contains a 3D view. A 3D view component includes a
\l {Scene Environment}{scene environment} as well as a scene
\l {Lights}{light}, \l {Cameras}{camera}, and
\l {3D Models}{model}. A default \l {Materials and Shaders}{material}
@@ -41,7 +41,7 @@
to materials. For more information about creating projects, see \l{Creating Projects}.
To add a 3D view to some other kind of a project, you first need to add the
\uicontrol {Qt Quick 3D} module to \uicontrol Library, as described in
\uicontrol {Qt Quick 3D} module to \uicontrol {Components}, as described in
\l {Adding and Removing Modules}.
\image studio-qtquick-3d-components.png "Qt Quick 3D components in Library"

View File

@@ -40,8 +40,7 @@
the skeleton and the skin (this is sometimes also referred to as rigging),
and import them to \QDS. You can then create skeletal animations using
\uicontrol Skeleton and \uicontrol Joint components available in
\uicontrol Library > \uicontrol Components > \uicontrol {Qt Quick 3D} >
\uicontrol {Qt Quick 3D}.
\uicontrol Components > \uicontrol {Qt Quick 3D} > \uicontrol {Qt Quick 3D}.
\section1 Skeleton

View File

@@ -44,11 +44,11 @@
Logic helpers are invisible components that you can use in connection with
controls, such as a \l {slider-control}{Slider} or \l {Check Box}.
To use a logic helper, drag-and-drop it from \l Library >
\uicontrol Components > \uicontrol {Qt Quick Studio Logic Helper} to
\l Navigator. If you cannot find the logic helpers in \uicontrol Library,
you need to add the \uicontrol {Qt Quick Studio Logic Helper} module to
your project, as described in \l {Adding and Removing Modules}.
To use a logic helper, drag-and-drop it from \uicontrol Components >
\uicontrol {Qt Quick Studio Logic Helper} to \l Navigator. If you cannot
find the logic helpers in \uicontrol {Components}, you need to add the
\uicontrol {Qt Quick Studio Logic Helper} module to your project,
as described in \l {Adding and Removing Modules}.
The following sections describe the different types of logic helpers in more
detail.

View File

@@ -31,7 +31,7 @@
\title 2D Effects
\QDS provides a set of effects that you can apply to components by
dragging-and-dropping them from \l Library > \uicontrol Components
dragging-and-dropping them from \uicontrol Components
> \uicontrol {Qt Quick Studio Effects} to the component in \l Navigator.
\image studio-2d-effects.png "Effects tab in Library"

View File

@@ -0,0 +1,70 @@
/****************************************************************************
**
** Copyright (C) 2022 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Creator documentation.
**
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see https://www.qt.io/terms-conditions. For further
** information use the contact form at https://www.qt.io/contact-us.
**
** GNU Free Documentation License Usage
** Alternatively, this file may be used under the terms of the GNU Free
** Documentation License version 1.3 as published by the Free Software
** Foundation and appearing in the file included in the packaging of
** this file. Please review the following information to ensure
** the GNU Free Documentation License version 1.3 requirements
** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
**
****************************************************************************/
/*!
\page quick-assets.html
\previouspage quick-components-view.html
\nextpage qtquick-navigator.html
\title Assets
The \uicontrol Assets view lists available assets.
\uicontrol {Assets} displays the images and other files
that you add to the project folder by dragging-and-dropping external asset
files to \QDS or by selecting \inlineimage icons/plus.png
. For more information about importing assets to \QDS, see
\l {Importing 2D Assets} and \l {Importing 3D Assets}.
To add assets to your UI, drag-and-drop them from
\uicontrol Assets to \l Navigator, \l {Form Editor}, or \l {3D Editor}.
To add multiple assets to your UI simultaneously, multiselect them first by
holding \key Ctrl and clicking the asset files you wish to select.
\image qtquick-assets-tab.png "Assets view"
When you drag-and-drop assets from \uicontrol Assets to \l Navigator
or \l {Form Editor}, component instances with a suitable type are
automatically created for you. For example, instances of the
\l{Images}{Image} component will be created for graphics files.
\section1 Context Menu Commands
\image qtquick-library-context-menu.png "Context menu commands in Assets"
To use the context menu commands in \uicontrol Assets, right-click the
name of a folder and select one of the following commands:
\list
\li \uicontrol {Expand All}: expands all folders.
\li \uicontrol {Collapse All}: collapses all folders.
\li \uicontrol {Rename Folder}: prompts you to enter a new name
for the folder.
\li \uicontrol {New Folder}: creates a new folder.
\li \uicontrol {Delete Folder}: deletes the folder.
\endlist
*/

View File

@@ -24,23 +24,17 @@
****************************************************************************/
/*!
\page quick-library.html
\if defined(qtdesignstudio)
\page quick-components-view.html
\previouspage studio-3d-editor.html
\else
\previouspage creator-using-qt-quick-designer.html
\endif
\nextpage qtquick-navigator.html
\nextpage quick-assets.html
\title Library
\title Components
The \uicontrol Library view lists the available components and assets.
\section1 Components
The \uicontrol Component view lists the available components.
\image qtquick-components-tab.png "Library view Components tab"
\uicontrol Library > \uicontrol Components displays modules that have been
\uicontrol Components displays modules that have been
added to your project. In many modules the components have been further
organized into different categories. The modules contain visual components,
such as basic shapes, UI controls, and 3D components, and add functionality
@@ -103,7 +97,7 @@
alphabetical order. You can search for components and modules by entering
search criteria in the \uicontrol Search field.
Select the module to add it to \uicontrol Library > \uicontrol Components.
Select the module to add it to \uicontrol Components.
\image qtquick-components-tab-add.png "Select Modules to Add"
@@ -116,38 +110,17 @@
final application package, it is recommended that you select
\uicontrol {Remove Module} to remove the ones you don't use in the project.
\section1 Assets
\uicontrol Library > \uicontrol {Assets} displays the images and other files
that you add to the project folder by dragging-and-dropping external asset
files to \QDS or by selecting \inlineimage icons/plus.png
. For more information about importing assets to \QDS, see
\l {Importing 2D Assets} and \l {Importing 3D Assets}.
To add assets to your UI, drag-and-drop them from \uicontrol Library >
\uicontrol Assets to \l Navigator, \l {Form Editor}, or \l {3D Editor}.
To add multiple assets to your UI simultaneously, multiselect them first by
holding \key Ctrl and clicking the asset files you wish to select.
\image qtquick-assets-tab.png "Library view Assets tab"
When you drag-and-drop assets from \uicontrol Assets to \l Navigator
or \l {Form Editor}, component instances with a suitable type are
automatically created for you. For example, instances of the
\l{Images}{Image} component will be created for graphics files.
\section1 Context Menu Commands
\image qtquick-library-context-menu.png "Context menu commands in Library"
\image qtquick-library-context-menu-hide.png "Context menu command Hide Category"
\image qtquick-components-context-menu.png "Context menu commands in Components"
\image qtquick-components-context-menu-hide.png "Context menu command Hide Category"
To use the context menu commands in \uicontrol Library, right-click the
To use the context menu commands in \uicontrol Components, right-click the
name of a module or category and select one of the following commands:
\list
\li \uicontrol {Remove Module}: removes the module and all of its
components from \uicontrol Library > \uicontrol Components.
components from \uicontrol Components.
\li \uicontrol {Expand All}: expands all the modules.
\li \uicontrol {Collapse All}: collapses all the modules.
\li \uicontrol {Hide Category}: hides the category from the module.
@@ -157,7 +130,7 @@
categories in all of the modules.
\endlist
\note The context menu commands for the \uicontrol Library categories do not
function if you have entered something into the \uicontrol Search field.
\note The context menu commands for the \uicontrol Components categories do
not function if you have entered something into the \uicontrol Search field.
Clear the \uicontrol Search field to resume using the context menu commands.
*/

View File

@@ -74,11 +74,15 @@
applications and stored in one of the supported formats.
\li \l{3D Editor}
\row
\li \l Library
\li Contains the building blocks that you can use to design
applications: preset components, your own components, and
assets.
\li \l{Components}
\li \l Components
\li Contains preset components and your own components, that you can use
to design you application.
\li \l{Using Components}
\row
\li \l Assets
\li Contains assets such as images and fonts that you can use in your
application.
\li \l Assets
\row
\li \l Navigator
\li Displays the composition of the current component file as
@@ -288,7 +292,7 @@
component in the list to open it in \uicontrol {Form Editor} and
\uicontrol Navigator.
\li
\li \l{Components}
\li \l{Using Components}
\row
\li Workspace
\li Displays the currently selected workspace. To switch to another

View File

@@ -25,7 +25,7 @@
/*!
\page qtquick-navigator.html
\previouspage quick-library.html
\previouspage quick-assets.html
\nextpage qtquick-properties-view.html
\title Navigator

View File

@@ -412,7 +412,7 @@
When layering is enabled, you can use the component directly as a texture,
in combination with the component you select in the \uicontrol Effect field.
Typically, this component should be a shader effect with a source texture
specified. You can use the effects in \l Library > \uicontrol Components >
specified. You can use the effects in \uicontrol Components >
\uicontrol {Qt Quick Studio Effects} that are based on the components in the
\l {Qt Graphical Effects} module.

View File

@@ -49,7 +49,7 @@
place or to change the button background or text color. When you use
instances of the button in other components, you can define states to
create different screens by hiding or showing button component instances.
The preset \l Button control in \l Library > \uicontrol Components
The preset \l Button control in \uicontrol Components
> \uicontrol {Qt Quick Controls} > \uicontrol Controls has predefined
\e normal and \e down states.
@@ -149,7 +149,7 @@
\if defined(qtdesignstudio)
If you are not familiar with writing expressions, you can use preset
\l{Logic Helpers}{logic helpers} from \l Library > \uicontrol Components
\l{Logic Helpers}{logic helpers} from \uicontrol Components
> \uicontrol {Qt Quick Studio Logic Helper}.
\endif