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

Merge "Merge remote-tracking branch 'origin/qds/dev'"

Browse Source
This commit is contained in:
The Qt Project
2025-01-07 15:13:22 +00:00
parent 160f4b9f7c 119993747e
commit e606909c38
1055 changed files with 38997 additions and 11144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -157,7 +157,6 @@ tmp/
/bin/cplusplus-mkvisitor
/bin/cplusplus-update-frontend
/bin/qbs*
/bin/qml2puppet
/bin/qmlpuppet
/bin/qtcreator
/bin/qtcreator_crash_handler

1
cmake/QtCreatorAPI.cmake
View File

@@ -325,7 +325,6 @@ function(add_qtc_library name)
endif()
get_target_property(have_automoc_prop ${name} AUTOMOC)
# check for Qt 6 is needed because sdktool & qml2puppet still build with Qt 5
if(Qt6_VERSION AND "${have_automoc_prop}")
qt_extract_metatypes(${name})
endif()

3
cmake/QtCreatorIDEBranding.cmake
View File

@@ -8,7 +8,8 @@ set(IDE_ID "qtcreator") # The IDE id (no spaces, l
set(IDE_CASED_ID "QtCreator") # The cased IDE id (no spaces!)
set(IDE_BUNDLE_IDENTIFIER "org.qt-project.${IDE_ID}") # The macOS application bundle identifier.
set(IDE_APP_ID "org.qt-project.${IDE_ID}") # The free desktop application identifier.
set(IDE_AUTHOR "The Qt Company Ltd. and other contributors.")
set(IDE_PUBLISHER "The Qt Company Ltd.")
set(IDE_AUTHOR "${IDE_PUBLISHER} and other contributors.")
set(IDE_COPYRIGHT "Copyright (C) ${IDE_AUTHOR}")
set(PROJECT_USER_FILE_EXTENSION .user)

4
dist/branding/qtdesignstudio/QtCreatorIDEBranding.cmake vendored
View File

@@ -9,7 +9,8 @@ set(IDE_ID "qtdesignstudio") # The IDE id (no spaces, l
set(IDE_CASED_ID "QtDesignStudio") # The cased IDE id (no spaces!)
set(IDE_BUNDLE_IDENTIFIER "org.qt-project.${IDE_ID}") # The macOS application bundle identifier.
set(IDE_APP_ID "io.qt.${IDE_ID}") # The free desktop application identifier.
set(IDE_AUTHOR "The Qt Company Ltd. and other contributors.")
set(IDE_PUBLISHER "The Qt Company Ltd.")
set(IDE_AUTHOR "${IDE_PUBLISHER} and other contributors.")
set(IDE_COPYRIGHT "Copyright (C) ${IDE_AUTHOR}")
set(PROJECT_USER_FILE_EXTENSION .qtds)
@@ -34,6 +35,7 @@ set(DESIGNSTUDIO_PLUGINS
FakeVim
Git
Help
ImageViewer
Insight
LanguageClient
McuSupport

1
dist/branding/qtdesignstudio/QtProject/QtDesignStudio.ini vendored
View File

@@ -10,6 +10,7 @@ NewDialog\AllowAllTemplates=false
NewDialog\BlacklistedCategories=U.Java, R.Qt, T.Import, H.Project, U.General
NewDialog\AlternativeWizardStyle=true
CreatorTheme=design
RhiBackend=opengl
[Menu]
HideBuild=true

6
doc/qtcreator/config/style/qt5-sidebar.html
View File

@@ -15,7 +15,7 @@
<div class="indexboxcont indexboxbar">
<ul>
<li><a href="creator-overview.html">Overview</a></li>
<li><a href="creator-quick-tour.html">User Interface</a></li>
<li><a href="creator-quick-tour.html">User interface</a></li>
<li><a href="creator-configuring.html">Configuring Qt Creator</a></li>
<li><a href="creator-project-creating.html">Creating Projects</a></li>
<li><a href="creator-configuring-projects.html">Configuring Projects</a></li>
@@ -70,7 +70,7 @@
<h2>Reference</h2>
</div>
<ul>
<li><a href="creator-acknowledgements.html">Licenses and Acknowledgments</a></li>
<li><a href="creator-acknowledgements.html">Licenses and acknowledgments</a></li>
<li><a href="creator-cli.html">Command-Line Options</a></li>
<li><a href="creator-project-wizards.html">Custom Wizards</a></li>
<li><a href="creator-faq.html">FAQ</a></li>
@@ -78,7 +78,7 @@
<li><a href="creator-keyboard-shortcuts.html">Keyboard Shortcuts</a></li>
<li><a href="creator-known-issues.html">Known Issues</a></li>
<li><a href="creator-sdk-tool.html">SDK Tool</a></li>
<li><a href="technical-support.html">Technical Support</a></li>
<li><a href="technical-support.html">Technical support</a></li>
<li><a href="creator-version-control.html">Version Control Systems</a></li>
<li><a href="creator-reference.html#analyzers">Analyzers</a></li>
<li><a href="creator-reference.html#build-systems">Build Systems</a></li>

BIN
doc/qtcreator/images/icons/examples-32x32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

2
doc/qtcreator/src/analyze/creator-analyze.qdoc
View File

@@ -30,7 +30,7 @@
\section1 Improving QML Performance
\QC comes with the \l{Profiling QML Applications}{QML Profiler} for
\QC comes with the \l{Profiling QML applications}{QML Profiler} for
inspecting binding evaluations and signal handling when running QML code.
This is useful for identifying potential bottlenecks, especially in the
evaluation of bindings.

2
doc/qtcreator/src/analyze/creator-ctf-visualizer.qdoc
View File

@@ -26,7 +26,7 @@
how the hardware is utilized and what the kernel and application are doing.
Tracing information can tell you more about the data that
\l{Profiling QML Applications}{QML Profiler} collects. For example, you
\l{Profiling QML applications}{QML Profiler} collects. For example, you
can check why a trivial binding evaluation is taking so long. This might
be caused by C++ being executed or the disk I/O being slow.

2
doc/qtcreator/src/analyze/creator-heob.qdoc
View File

@@ -67,7 +67,7 @@
In \uicontrol {Extra arguments}, enter additional arguments for
running Heob. To list the available arguments in the Heob console, enter
\c -H in this field and press \key Enter.
\c -H in this field and select \key Enter.
For example, use the \c -oleaks.html option to record leak data in an HTML
file. Together with this option, you can use the \c -g2 option to group the

4
doc/qtcreator/src/appman/creator-appman-how-to-run.qdoc
View File

@@ -143,7 +143,7 @@
\section1 Analyze the applications
Use the \l{Profiling QML Applications}{QML Profiler} to find causes
Use the \l{Profiling QML applications}{QML Profiler} to find causes
for typical performance problems in Qt Quick applications, such as
slowness and unresponsive, stuttering user interfaces. You cannot profile an
in-process runtime as an individual process.
@@ -156,5 +156,5 @@
{Remote Linux}{How To: Develop for remote Linux},
{Run on many platforms}, {Debugging}, {Debuggers}, {Debugger},
{Developing for \B2Q Devices}, {Developing for Remote Linux Devices},
{Profiling QML Applications}, {Kits}
{Profiling QML applications}, {Kits}
*/

6
doc/qtcreator/src/cmake/creator-projects-cmake-building.qdoc
View File

@@ -180,15 +180,15 @@
case-sensitivity. Select \uicontrol {Show Non-matching Lines} to
hide the lines that match the filter.
Press \key {Ctrl+F} to \l{Search in current file}{search} for a string in
Select \key {Ctrl+F} to \l{Search in current file}{search} for a string in
the output.
To increase or decrease the output text size, select \inlineimage icons/plus.png
(\uicontrol {Zoom In}) or \inlineimage icons/minus.png
(\uicontrol {Zoom Out}), or press \key Ctrl++ or \key Ctrl+-.
(\uicontrol {Zoom Out}), or select \key Ctrl++ or \key Ctrl+-.
To hide the output, select the \inlineimage icons/rightsidebaricon.png
(\uicontrol {Hide Right Sidebar}) button or press \key {Alt+Shift+0}.
(\uicontrol {Hide Right Sidebar}) button or select \key {Alt+Shift+0}.
\section1 CLICOLOR_FORCE Environment Variable

2
doc/qtcreator/src/cmake/creator-projects-cmake.qdoc
View File

@@ -271,7 +271,7 @@
\li \c{$ENV} for environment variables
\endlist
Press \key Tab or \key Enter to accept the selected suggestion and complete
Select \key Tab or \key Enter to accept the selected suggestion and complete
the code.
\sa {Build with CMake}{How To: Build with CMake}, {CMake}, {Completion},

46
doc/qtcreator/src/debugger/creator-debug-views.qdoc
View File

@@ -12,7 +12,7 @@
\ingroup creator-reference-debugger-views
\ingroup studio-debugger-views
\title Viewing Call Stack Trace
\title Viewing call stack trace
\brief View the nested function calls leading to the current position as a
call stack trace.
@@ -33,11 +33,11 @@
If you click a frame with a known source location, the text editor jumps to
the corresponding location and updates the
\l {Local Variables and Function Parameters}{Locals} and
\l {Evaluating Expressions}{Expressions} views, making it seem like the
\l {Local variables and function parameters}{Locals} and
\l {Evaluating expressions}{Expressions} views, making it seem like the
application was interrupted before entering the function.
\section1 Loading QML Stack
\section1 Loading QML stack
To find out which QML file is causing a Qt Quick application to crash,
select \uicontrol {Load QML Stack} in the context menu in the
@@ -62,7 +62,7 @@
\ingroup creator-reference-debugger-views
\ingroup studio-debugger-views
\title Setting Breakpoints
\title Setting breakpoints
\brief Set breakpoints to interrupt the application.
@@ -96,7 +96,7 @@
evaluates the expression each time the application passes it, and the
application stops only if the condition evaluates to \c true.
\section1 Unclaimed and Claimed Breakpoints
\section1 Unclaimed and claimed breakpoints
Breakpoints come in two varieties: \c unclaimed and \c claimed.
An unclaimed breakpoint represents a task to interrupt the debugged
@@ -172,7 +172,7 @@
\list
\li In the code editor, click the left margin or press \key F9
\li In the code editor, click the left margin or select \key F9
(\key F8 on \macos) on a particular line where you want the
application to stop.
@@ -291,7 +291,7 @@
\li In the \uicontrol {Breakpoint Preset} view or the
\uicontrol Breakpoints view:
\list
\li Select the breakpoint and press \key Delete.
\li Select the breakpoint and select \key Delete.
\li Select \uicontrol {Delete Selected Breakpoints},
\uicontrol {Delete Selected Breakpoints}, or
\uicontrol {Delete Breakpoints of File} in the
@@ -310,13 +310,13 @@
\li Right-click the breakpoint marker in the text editor and select
\uicontrol{Disable Breakpoint}.
\li Select a line that has a breakpoint and press \key Ctrl+F9
\li Select a line that has a breakpoint and select \key Ctrl+F9
(\key Ctrl+F8 on \macos).
\li In the \uicontrol {Breakpoint Preset} view or the
\uicontrol Breakpoints view:
\list
\li Select the breakpoint and press \key Space.
\li Select the breakpoint and select \key Space.
\li Select \uicontrol {Disable Breakpoint} in the context menu.
\endlist
\endlist
@@ -391,7 +391,7 @@
\ingroup creator-reference-debugger-views
\ingroup studio-debugger-views
\title Local Variables and Function Parameters
\title Local variables and function parameters
\brief Inspect local variables and function parameters.
@@ -412,7 +412,7 @@
local value correctly.
\if defined(qtcreator)
\section1 Locals View Actions
\section1 Locals view actions
Right-click the \uicontrol Locals view to select the following actions:
@@ -435,7 +435,7 @@
//! [0]
\endif
\section1 Selecting Object Type for Display
\section1 Selecting object type for display
When using GDB, you can specify whether the dynamic or the static type of
objects will be displayed. Select \uicontrol {Use dynamic object type for
@@ -458,12 +458,12 @@
\ingroup creator-reference-debugger-views
\ingroup studio-debugger-views
\title Evaluating Expressions
\title Evaluating expressions
\brief Compute values of arithmetic expressions or function calls.
To access global data that is not visible in the
\l {Local Variables and Function Parameters}{Locals} view or to compute
\l {Local variables and function parameters}{Locals} view or to compute
values of arithmetic expressions or function calls, use
expression evaluators in the \uicontrol Expressions view.
@@ -477,7 +477,7 @@
\image qtcreator-debugger-expressions.webp {Expressions view}
\section1 Adding Expression Evaluators
\section1 Adding expression evaluators
To add expression evaluators, drag an expression from the code editor
to the \uicontrol Expressions view.
@@ -513,13 +513,13 @@
\note Evaluating expressions is slow, so remove expression evaluators after
use.
\section1 JavaScript Expressions
\section1 JavaScript expressions
The QML debugger can evaluate JavaScript expressions.
\if defined(qtcreator)
\section1 C and C++ Expressions
\section1 C and C++ expressions
CDB, GDB, and LLDB support the evaluation of simple C and C++ expressions,
such as arithmetic expressions made of simple values and pointers.
@@ -527,7 +527,7 @@
Depending on the backend and concrete location, some function calls
can be evaluated. CDB is the most limited backend in this respect.
\section2 Function Calls
\section2 Function calls
Functions can be called only if they are actually compiled into the debugged
executable or a library used by the executable. Inlined
@@ -538,20 +538,20 @@
corruption of the application's state, or using the application's permission
to perform arbitrary actions.
\section2 Ranged Syntax
\section2 Ranged syntax
When using GDB or LLDB as backend, you can use a special ranged syntax to
display multiple values with one expression. A sub-expression of form
\c{foo[a..b]} is split into a sequence of individually evaluated expressions
\c{foo[a], ..., foo[b]}.
\section2 Compound Variables
\section2 Compound variables
You can expand compound variables of struct or class type to show their
members. As you also see the variable value and type, you can examine and
traverse the low-level layout of object data.
\section2 Optimized Builds
\section2 Optimized builds
GDB and LLDB, and therefore \QC's debugger, also work for optimized
builds on Linux and \macos. Optimization can lead to re-ordering
@@ -569,7 +569,7 @@
\uicontrol {not in scope}. Not all uninitialized objects,
however, can be recognized as such.
\section1 Expressions View Actions
\section1 Expressions view actions
Right-click the \uicontrol Expressions view to select the following actions:

2
doc/qtcreator/src/debugger/creator-only/creator-debugger-example.qdoc
View File

@@ -35,7 +35,7 @@
\image qtcreator-setting-breakpoint1.png
\li Go to \uicontrol Debug > \uicontrol {Start Debugging} >
\uicontrol {Start Debugging of Startup Project} or press \key F5.
\uicontrol {Start Debugging of Startup Project} or select \key F5.
\li To view information about the breakpoint, go to the
\uicontrol Breakpoints view.

2
doc/qtcreator/src/debugger/creator-only/creator-debugger-settings.qdoc
View File

@@ -262,7 +262,7 @@
shifted to the next source code line for which the code was actually
generated. To reflect such temporary changes by moving the breakpoint
markers in the source code editor, select this checkbox. For more
information, see \l{Setting Breakpoints}.
information, see \l{Setting breakpoints}.
\row
\li \uicontrol {Use Python dumper}
\li Uses the abstraction layer of Python Dumper classes to create a

42
doc/qtcreator/src/debugger/creator-only/creator-debugger.qdoc
View File

@@ -118,19 +118,19 @@
To interrupt a running C++ application, go to \uicontrol Debug >
\uicontrol Interrupt. The debugger automatically interrupts
the application when it hits a \l {Setting Breakpoints}{breakpoint}.
the application when it hits a \l {Setting breakpoints}{breakpoint}.
Once the application stops, \QC:
\list
\li Retrieves data representing the \l{Viewing Call Stack Trace}
\li Retrieves data representing the \l{Viewing call stack trace}
{call stack} at the application's current position.
\li Retrieves the contents of \l{Local Variables and Function Parameters}
\li Retrieves the contents of \l{Local variables and function parameters}
{local variables}.
\li Examines \l{Evaluating Expressions}{expressions}.
\li Examines \l{Evaluating expressions}{expressions}.
\li Updates the \l{Viewing and Editing Register State}{Registers},
\l{Viewing Modules}{Modules}, and \l{Viewing Disassembled Code}
@@ -206,7 +206,7 @@
objects and user interfaces, as well as execute JavaScript
expressions.
For more information, see \l{Debugging Qt Quick Projects} and
For more information, see \l{Debugging Qt Quick projects} and
\l{Tutorial: Qt Quick debugging}.
\sa {Tutorial: C++ debugging}, {Debug}{How To: Debug}, {Debuggers},
@@ -227,7 +227,7 @@
\list
\li Select \inlineimage icons/qtcreator-debug-button.png
(\uicontrol {Start Debugging of Startup Project}).
\li Press \key F5.
\li Select \key F5.
\li Enter \c {dr} in the locator, and select the project to debug.
\li Go to \uicontrol Debug > \uicontrol {Start Debugging} >
\uicontrol {Start Debugging of Startup Project}.
@@ -245,7 +245,7 @@
parameters.
You can specify breakpoints before or after launching the debugger.
For more information, see \l{Setting Breakpoints}.
For more information, see \l{Setting breakpoints}.
\section1 Execute GDB or CDB commands
@@ -373,7 +373,7 @@
opening it makes setting breakpoints and stepping through the code easier.
You can specify breakpoints before or after attaching the debugger to the
application. For more information, see \l{Setting Breakpoints}.
application. For more information, see \l{Setting breakpoints}.
\sa {Debug}{How To: Debug}, {Debugging}, {Debuggers}, {Debugger}
*/
@@ -750,7 +750,7 @@
\li Stack
\li Examine the nested function calls leading to the current position
as a call stack trace.
\li \l {Viewing Call Stack Trace}
\li \l {Viewing call stack trace}
\row
\li Breakpoint Preset
@@ -758,7 +758,7 @@
\li Set \e {breakpoints} with conditions to make the application stop in
a controlled way. A \e {watchpoint} stops the application when the
value of an expression changes.
\li \l {Setting Breakpoints}
\li \l {Setting breakpoints}
\row
\li Threads
\li Switch between threads.
@@ -775,11 +775,11 @@
\li Locals
\li View information about the parameters of the function in the topmost
stack frame and local variables.
\li \l {Local Variables and Function Parameters}
\li \l {Local variables and function parameters}
\row
\li Expressions
\li Compute values of arithmetic expressions or function calls.
\li \l {Evaluating Expressions}
\li \l {Evaluating expressions}
\row
\li Registers
\li View the current state of the CPU registers to examine the
@@ -898,8 +898,8 @@
\image qtcreator-locals.png {Locals view}
The \l {Local Variables and Function Parameters}{Locals} and
\l {Evaluating Expressions}{Expressions} views show structured
The \l {Local variables and function parameters}{Locals} and
\l {Evaluating expressions}{Expressions} views show structured
data, such as objects of \c class, \c struct, or \c union types, as a tree.
To access sub-structures of the objects, expand the tree nodes.
The tree shows the sub-structures in their in-memory order. To show them
@@ -924,7 +924,7 @@
\l{Debugging Helpers}{debugging helpers}.
In addition to the generic IDE functionality of the
\l {Viewing Call Stack Trace}{Stack}, \uicontrol {Locals},
\l {Viewing call stack trace}{Stack}, \uicontrol {Locals},
\uicontrol {Expressions}, \l {Viewing and Editing Register State}{Registers},
and other views, \QC makes debugging Qt-based applications easy. The debugger
plugin understands the internal layout of several Qt classes, for example,
@@ -1083,7 +1083,7 @@
the contents of variables of simple data types, for example, \c int, \c float,
\c QString and \c std::string when the application is interrupted. To do so,
click the \uicontrol Value column, modify the value with the inplace editor,
and press \key Enter.
and select \key Enter.
To change the complete contents of QVector or \c std::vector values, type
all values separated by commas into the \uicontrol Value column of the main
@@ -1161,7 +1161,7 @@
This allows you to select the thread that is in the focus of the debugger.
The \l {Viewing Call Stack Trace}{Stack} view adjusts its contents
The \l {Viewing call stack trace}{Stack} view adjusts its contents
accordingly.
\sa {Debug}{How To: Debug}, {Debugging}, {Debuggers}, {Debugger}
@@ -1421,7 +1421,7 @@
You can use the left pane of the \uicontrol {Debugger Log} view to directly
interact with the command line of the debugger.
Press \key {Ctrl+Enter} to send the contents of the line under the
Select \key {Ctrl+Enter} to send the contents of the line under the
text cursor to the debugger. Or, enter the command in the
\uicontrol Command field. The right side pane of the
\uicontrol {Debugger Log} view shows the command output.
@@ -1429,7 +1429,7 @@
\note Usually, you do not need this feature because \QC offers better ways to
handle the task. For example, instead of using the GDB
\c print command from the command line, you can evaluate an expression in
the \l {Evaluating Expressions}{Expressions} view.
the \l {Evaluating expressions}{Expressions} view.
\sa {Debug}{How To: Debug}, {Debugging}, {Debuggers}, {Debugger}
*/
@@ -1493,8 +1493,8 @@
\QC uses Python scripts to translate raw memory contents and type information
data from debugger backends (GDB, LLDB, and CDB are currently supported)
into the form presented to the user in the
\l {Local Variables and Function Parameters}{Locals}
and \l {Evaluating Expressions}{Expressions} views.
\l {Local variables and function parameters}{Locals}
and \l {Evaluating expressions}{Expressions} views.
Unlike GDB's
\l{https://sourceware.org/gdb/onlinedocs/gdb/Pretty-Printing.html#Pretty-Printing}

6
doc/qtcreator/src/debugger/qtquick-debugger-example.qdoc
View File

@@ -29,7 +29,7 @@
\uicontrol Debug mode.
For more information about all the options you have, see
\l{Debugging Qt Quick Projects}.
\l{Debugging Qt Quick projects}.
\if defined(qtdesignstudio)
\note In this tutorial, you are using advanced menu items. These are not
@@ -69,7 +69,7 @@
\image qtquick-example-setting-breakpoint2.webp {Debugger view}
\li Select \inlineimage icons/debugger_stepinto_small.png
(\uicontrol {Step Into}) on the toolbar or press \key F11 to step
(\uicontrol {Step Into}) on the toolbar or select \key F11 to step
into the code in the stack. The samegame.js file opens in the code
editor at the function that starts a new game.
@@ -111,5 +111,5 @@
\endlist
\sa {Debugging Qt Quick Projects}
\sa {Debugging Qt Quick projects}
*/

32
doc/qtcreator/src/debugger/qtquick-debugging.qdoc
View File

@@ -19,7 +19,7 @@
\ingroup creator-reference-debugger
\ingroup studio-debugger
\title Debugging Qt Quick Projects
\title Debugging Qt Quick projects
\brief Debug JavaScript functions, execute JavaScript expressions to get
information about the state of the UI, and inspect QML properties and
@@ -34,14 +34,14 @@
\l{Customizing the Menu Bar}.
\endif
\section1 Setting Up QML Debugging
\section1 Setting up QML debugging
\if defined(qtcreator)
The process of setting up debugging for Qt Quick projects depends on the
\e type of the project: \uicontrol {Qt Quick UI Prototype} or
\uicontrol {Qt Quick Application}, and the Qt version.
\section2 Debugging Qt Quick UI Projects
\section2 Debugging Qt Quick UI projects
\endif
To debug Qt Quick UI projects (.qmlproject), select \uicontrol Automatic
@@ -51,7 +51,7 @@
\image qtquick-debugger-settings.webp {Debugger settings section in Run Settings}
\if defined(qtcreator)
\section2 Debugging Qt Quick Applications
\section2 Debugging Qt Quick applications
To debug Qt Quick Applications:
@@ -92,7 +92,7 @@
automatically installed during \QC and Qt installation. Do not delete
them if you plan to debug QML applications.
\section2 Using Default Values
\section2 Using default values
You can enable or disable QML debugging globally in \preferences >
\uicontrol {Build & Run} > \uicontrol {Default Build Properties}.
@@ -129,10 +129,10 @@
global setting.
\endif
\section1 Starting QML Debugging
\section1 Starting QML debugging
To start the application, choose \uicontrol Debug > \uicontrol {Start Debugging}
> \uicontrol {Start Debugging of Startup Project} or press \key F5. Once the
> \uicontrol {Start Debugging of Startup Project} or select \key F5. Once the
application starts running, it behaves and performs as usual. You can then
perform the following tasks:
@@ -191,25 +191,25 @@
\endlist
\section1 Debugging JavaScript Functions
\section1 Debugging JavaScript functions
You can use the \QC \uicontrol Debug mode to inspect the state of your
application while debugging. You can interact with the debugger by:
\list
\li \l{Viewing Call Stack Trace}{Viewing call stack trace}
\li \l{Viewing call stack trace}{Viewing call stack trace}
\li \l{Setting Breakpoints}{Setting breakpoints}
\li \l{Setting breakpoints}{Setting breakpoints}
\li \l{Local Variables and Function Parameters}
\li \l{Local variables and function parameters}
{Viewing local variables and function parameters}
\li \l{Evaluating Expressions}
\li \l{Evaluating expressions}
\endlist
\section1 Inspecting Items
\section1 Inspecting items
While the application is running, you can use the \uicontrol {Locals}
view to explore the QML item structure.
@@ -237,7 +237,7 @@
double-click them and enter the new values. You can view the results in the
running application.
\section1 Inspecting User Interfaces
\section1 Inspecting user interfaces
When you debug complex applications, you can jump to the position in code
where an item is defined.
@@ -256,7 +256,7 @@
To move the application running in \QQV to the front, select
\uicontrol Debug > \uicontrol {Show Application on Top}.
\section1 Executing JavaScript Expressions
\section1 Executing JavaScript expressions
When the application is interrupted by a breakpoint, you can use the
\uicontrol {QML Debugger Console} to execute JavaScript expressions in the
@@ -274,7 +274,7 @@
the \l Properties view.
\endif
\section1 Applying QML Changes at Runtime
\section1 Applying QML changes at runtime
When you change property values in the \uicontrol {QML Debugger Console} or
in the \uicontrol Locals or \uicontrol Expression view, they are immediately

12
doc/qtcreator/src/editors/creator-code-completion.qdoc
View File

@@ -18,7 +18,7 @@
complete the code. It shows a list of suggestions to
the statement currently under your cursor.
Press \key Tab or \key Enter to accept the selected suggestion and complete
Select \key Tab or \key Enter to accept the selected suggestion and complete
the code.
\if defined(qtcreator)
@@ -29,7 +29,7 @@
\image qml-code-completion.png
\caption Suggestions for completing QML code.
To open the list of suggestions at any time, press \key {Ctrl+Space}.
To open the list of suggestions at any time, select \key {Ctrl+Space}.
If only one option is available, \QC inserts it automatically.
\section1 Summary of Available Types
@@ -107,8 +107,8 @@
\section1 Complete code snippets
Code snippets can consist of multiple variables that you specify values for.
Select an item in the list and press \key Tab or \key Enter to complete the
code. Press \key Tab to move between the variables and specify values for
Select an item in the list and select \key Tab or \key Enter to complete the
code. Select \key Tab to move between the variables and specify values for
them. When you specify a value for a variable, all instances of the variable
within the snippet are renamed.
@@ -171,7 +171,7 @@
Select the \uicontrol {Automatically split strings} check box to split
a string to two lines by adding an end quote at the cursor position when
you press \key Enter and a start quote at the beginning of the next line,
you select \key Enter and a start quote at the beginning of the next line,
before the rest of the string. In addition, pressing \key {Shift+Enter}
inserts an escape character at the cursor position and moves the rest of
the string to the next line.
@@ -182,7 +182,7 @@
closing character is added automatically at the end of the selection.
By default, the automatically inserted text is highlighted and animated,
skipped when you type, and removed when you press \key Backspace.
skipped when you type, and removed when you select \key Backspace.
\if defined(qtcreator)
\sa {Complete CMake code}, {Enclose code in brackets or quotes}, {Nim}

12
doc/qtcreator/src/editors/creator-code-indentation.qdoc
View File

@@ -16,7 +16,7 @@
When you type text or code, it is indented automatically according to the
selected text editor or code style preferences. Select a block to indent it when
you press \key Tab. Press \key {Shift+Tab} to decrease the indentation. You
you select \key Tab. Select \key {Shift+Tab} to decrease the indentation. You
can disable automatic indentation.
To fix the indentation in the file currently open in the editor,
@@ -25,16 +25,16 @@
\list
\li To automatically indent the highlighted text, select
\uicontrol {Auto-indent Selection} or press \key {Ctrl+I}.
\uicontrol {Auto-indent Selection} or select \key {Ctrl+I}.
\li To automatically format the highlighted text, select
\uicontrol {Auto-format Selection} or press \key {Ctrl+;}.
\uicontrol {Auto-format Selection} or select \key {Ctrl+;}.
\li To adjust the wrapping of the selected paragraph, select
\uicontrol {Rewrap Paragraph} or press \key {Ctrl+E}
\uicontrol {Rewrap Paragraph} or select \key {Ctrl+E}
followed by \key R.
\li To toggle text wrapping, select \uicontrol {Enable Text Wrapping}
or press \key {Ctrl+E} followed by \key {Ctrl+W}.
or select \key {Ctrl+E} followed by \key {Ctrl+W}.
\li To visualize whitespace in the editor, select
\uicontrol {Visualize Whitespace} or press \key {Ctrl+E}
\uicontrol {Visualize Whitespace} or select \key {Ctrl+E}
followed by \key {Ctrl+V}.
\li To clear all whitespace characters from the currently open file,
select \uicontrol {Clean Whitespace}.

4
doc/qtcreator/src/editors/creator-code-refactoring.qdoc
View File

@@ -25,7 +25,7 @@
\list 1
\li Place the cursor on the symbol in the editor.
\li Go to \uicontrol Tools > \uicontrol {C++} >
\uicontrol {Rename Symbol Under Cursor}, or press \key {Ctrl+Shift+R}.
\uicontrol {Rename Symbol Under Cursor}, or select \key {Ctrl+Shift+R}.
Use the keyboard shortcut to rename Python symbols.
\endlist
@@ -33,7 +33,7 @@
To rename a QML type in a project, go to \uicontrol Tools >
\uicontrol {QML/JS} > \uicontrol {Rename Symbol Under Cursor}
or press \key {Ctrl+Shift+R}.
or select \key {Ctrl+Shift+R}.
\uicontrol {Search Results} shows the location
and number of instances of the symbol in the current project.

16
doc/qtcreator/src/editors/creator-code-syntax.qdoc
View File

@@ -103,7 +103,7 @@
find common problems.
To run static checks, go to \uicontrol Tools > \uicontrol {QML/JS} >
\uicontrol {Run Checks} or press \key {Ctrl+Shift+C}.
\uicontrol {Run Checks} or select \key {Ctrl+Shift+C}.
View the results in the \uicontrol QML and \uicontrol {QML Analysis}
filters in \l Issues.
@@ -503,13 +503,13 @@
\li Error
\li This type (type name) is not supported as a root element of a
UI file (.ui.qml)
\li For more information about supported QML types, see \l{UI Files}.
\li For more information about supported QML types, see \l{UI files}.
\row
\li M221
\li Error
\li This type (type name) is not supported in a UI file (.ui.qml)
\li For more information about supported QML types, see \l{UI Files}.
\li For more information about supported QML types, see \l{UI files}.
\row
\li M222
@@ -522,26 +522,26 @@
\li M223
\li Error
\li JavaScript blocks are not supported in a UI file (.ui.qml)
\li For more information about supported features, see \l{UI Files}.
\li For more information about supported features, see \l{UI files}.
\row
\li M224
\li Error
\li Behavior type is not supported in a UI file (.ui.qml)
\li For more information about supported QML types, see \l{UI Files}.
\li For more information about supported QML types, see \l{UI files}.
\row
\li M225
\li Error
\li States are only supported in the root item in a UI file (.ui.qml)
\li For more information about supported features, see \l{UI Files}.
\li For more information about supported features, see \l{UI files}.
\row
\li M226
\li Error
\li Referencing the parent of the root item is not supported in a
UI file (.ui.qml)
\li For more information about supported features, see \l{UI Files}.
\li For more information about supported features, see \l{UI files}.
\row
\li M227
@@ -766,7 +766,7 @@
To reset the code model, select \uicontrol Tools > \uicontrol {QML/JS} >
\uicontrol {Reset Code Model}.
\sa {Check code syntax}, {Using QML Modules with Plugins}
\sa {Check code syntax}, {Using QML modules with plugins}
\if defined(qtcreator)
\sa {Analyzing Code}

4
doc/qtcreator/src/editors/creator-only/creator-code-pasting.qdoc
View File

@@ -36,7 +36,7 @@
\list 1
\li Go to \uicontrol Tools > \uicontrol {Code Pasting} >
\uicontrol {Paste Snippet} or press \key {Alt+C,Alt+P}.
\uicontrol {Paste Snippet} or select \key {Alt+C,Alt+P}.
\image qtcreator-send-to-codepaster.webp {Send to Codepaster dialog}
\li In \uicontrol Protocol, select the code pasting service to use.
\li In \uicontrol {Expires after}, specify the time to keep
@@ -59,7 +59,7 @@
\list 1
\li Go to \uicontrol Tools > \uicontrol {Code Pasting} >
\uicontrol {Fetch Snippet} or press \key {Alt+C,Alt+F}.
\uicontrol {Fetch Snippet} or select \key {Alt+C,Alt+F}.
\li Select the snippet to fetch from the list.
\endlist

62
doc/qtcreator/src/editors/creator-only/creator-coding-edit-mode.qdoc
View File

@@ -162,13 +162,13 @@
\li To format the duplicated lines as a comment, go to
\uicontrol {Duplicate Selection and Comment}.
\li To turn selected text into lowercase, go to
\uicontrol {Lowercase Selection} or press \key {Alt+U}.
\uicontrol {Lowercase Selection} or select \key {Alt+U}.
\li To turn selected text into uppercase, go to
\uicontrol {Uppercase Selection} or press \key {Alt+Shift+U}.
\uicontrol {Uppercase Selection} or select \key {Alt+Shift+U}.
\li To sort selected lines alphabetically, go to
\uicontrol {Sort Selected Lines} or press \key {Alt+Shift+S}.
\uicontrol {Sort Selected Lines} or select \key {Alt+Shift+S}.
\li To add a cursor at the next occurrence of selected text for multi-cursor
editing, go to \uicontrol {Add Next Occurrence to Selection} or press \key {Ctrl+D}
editing, go to \uicontrol {Add Next Occurrence to Selection} or select \key {Ctrl+D}
\endlist
\sa {Edit Code}{How To: Edit Code},
@@ -205,7 +205,7 @@
open project using the locator:
\list 1
\li Press \key {Ctrl+K} to activate the locator.
\li Select \key {Ctrl+K} to activate the locator.
\li Start typing the filename.
\image qtcreator-locator-open.webp {List of files in the locator}
\li Use the arrow keys to move to the filename in the list and press
@@ -217,7 +217,7 @@
Filters locating files also accept paths, such as \c {tools/*main.cpp}.
If the path to a file is very long, it might not fit into the locator
window. To view the full path, press \key Alt when the filename is selected
window. To view the full path, select \key Alt when the filename is selected
or drag the right edge of the locator to make it wider.
If the locator does not find some files, see \l{Specify project contents}
@@ -249,12 +249,12 @@
Use keyboard shortcuts:
\list
\li To quickly move between currently open files, press \key Ctrl+Tab.
\li To move forward in the location history, press \key {Alt+Right}
\li To quickly move between currently open files, select \key Ctrl+Tab.
\li To move forward in the location history, select \key {Alt+Right}
(\key {Cmd+Opt+Right} on \macos).
\li To move backward, press \key {Alt+Left} (\key {Cmd+Opt+Left} on \macos).
\li To move backward, select \key {Alt+Left} (\key {Cmd+Opt+Left} on \macos).
For example, after you use the \uicontrol Locator
to jump to a symbol in the same file, press \key {Alt+Left} to jump
to jump to a symbol in the same file, select \key {Alt+Left} to jump
back to your original location in that file.
\endlist
@@ -292,7 +292,7 @@
\list 1
\li Press \key {Ctrl+K} to activate the locator.
\li Select \key {Ctrl+K} to activate the locator.
\li Enter a colon (:) followed by a space and the upper case letters in
the symbol name (here, \c {QGuiApplication}):
@@ -313,7 +313,7 @@
\section1 Move to symbol definition or declaration
To move directly to the definition or declaration of a symbol in the
\uicontrol Edit mode, move the cursor on the symbol and press \key {F2}.
\uicontrol Edit mode, move the cursor on the symbol and select \key {F2}.
Or, hold the \key Ctrl key (\key Cmd on \macos) and click
the symbol. If you have multiple splits opened, open the link in the next
@@ -343,7 +343,7 @@
\section2 Switch between function definition and decalaration
To switch between the definition and declaration of a function, place the
cursor on either and press \key {Shift+F2} or right-click and go to
cursor on either and select \key {Shift+F2} or right-click and go to
\uicontrol {Switch Between Function Declaration/Definition} or
\uicontrol {Open Function Declaration/Definition in Next Split}.
For example, this allows you to navigate from anywhere within a function
@@ -357,7 +357,7 @@
\section2 Open links in another split
Links open in the same split by default. To open them in the next
split, press \key {Ctrl+E} first. For example, press \key {Ctrl+E,F2} to
split, select \key {Ctrl+E} first. For example, select \key {Ctrl+E,F2} to
follow the symbol into the next split. If necessary, the view is
automatically split.
@@ -477,7 +477,7 @@
\title Insert multiple cursors
To apply a change to several places simultaneously in the editor in the
\uicontrol Edit mode, press and hold \key Alt, and click to place cursors
\uicontrol Edit mode, select and hold \key Alt, and click to place cursors
in several places in the file. Any changes you make are applied
simultaneously at all the cursor positions.
@@ -486,14 +486,14 @@
To manage cursors:
\list
\li Press the arrow keys to move all the cursors up and down.
\li Press the \key Home and \key End key to move all the cursors
\li Select the arrow keys to move all the cursors up and down.
\li Select the \key Home and \key End key to move all the cursors
to the beginning or to the end of the line.
\li Press and hold \key Alt and double-click strings to select
\li Select and hold \key Alt and double-click strings to select
several strings simultaneously.
\li Press \key {Alt+Shift+I} to create cursors at the ends of
\li Select \key {Alt+Shift+I} to create cursors at the ends of
selected lines.
\li Press \key Esc to remove all the cursors and selections.
\li Select \key Esc to remove all the cursors and selections.
\endlist
\sa {Edit Code}{How To: Edit Code}, {Editing Selected Lines}, {Edit Mode}
@@ -517,7 +517,7 @@
\list
\li To split the editor view into a top and bottom view, go to
\uicontrol Window > \uicontrol Split, press \key {Ctrl+E, 2}, or
\uicontrol Window > \uicontrol Split, select \key {Ctrl+E, 2}, or
select the \inlineimage icons/splitbutton_horizontal.png
(\uicontrol Split) button and then select \uicontrol Split.
@@ -532,7 +532,7 @@
The \uicontrol {Split Side by Side} command creates views to the right
of the currently active editor view.
\li To open the editor in a detached window, press \key {Ctrl+E, 4}, or
\li To open the editor in a detached window, select \key {Ctrl+E, 4}, or
go to \uicontrol Window > \uicontrol {Open in New Window}.
The new window behaves in the same way as the editor area
@@ -554,7 +554,7 @@
\list
\li Place the cursor within the view you want to remove and go to
\uicontrol Window > \uicontrol {Remove Current Split}.
\li Press \key {Ctrl+E, 0}.
\li Select \key {Ctrl+E, 0}.
\li Select the \inlineimage icons/splitbutton_closetop.png
(\uicontrol {Remove Split}) button.
\endlist
@@ -563,7 +563,7 @@
\list
\li Go to \uicontrol Window > \uicontrol {Remove All Splits}.
\li Press \key {Ctrl+E, 1}.
\li Select \key {Ctrl+E, 1}.
\endlist
\sa {Edit Code}{How To: Edit Code}, {Detach views}, {Edit Mode}
@@ -583,9 +583,9 @@
\li Right-click the line number and select \uicontrol {Toggle Bookmark}.
\li Press \key Shift and click the left margin at a line.
\li Select \key Shift and click the left margin at a line.
\li Press \key {Ctrl+M} when the cursor is on a line.
\li Select \key {Ctrl+M} when the cursor is on a line.
\endlist
@@ -598,7 +598,7 @@
\list
\li Go to \uicontrol Tools > \uicontrol Bookmarks >
\uicontrol {Edit Bookmark}.
\li Press \key {Ctrl+Shift+M}.
\li Select \key {Ctrl+Shift+M}.
\li Right-click a bookmark and go to \uicontrol {Edit Bookmark}
in the context menu.
\endlist
@@ -610,7 +610,7 @@
To move to the previous bookmark in the current session, go to
\uicontrol Tools > \uicontrol Bookmarks > \uicontrol {Previous Bookmark}
or press \key {Ctrl+,}.
or select \key {Ctrl+,}.
To move to the next bookmark in the current session, go to \uicontrol Tools >
\uicontrol Bookmarks > \uicontrol {Previous Bookmark} or press
@@ -618,7 +618,7 @@
\section2 Locate bookmarks
To use the locator to go to a bookmark, press \key {Ctrl+K} (or \key {Cmd+K}
To use the locator to go to a bookmark, select \key {Ctrl+K} (or \key {Cmd+K}
on \macos) to open the locator. Enter \e b and a space to display a list of
bookmarks. To filter the bookmarks by line number or a text string, enter
the number or string after the space. Double-click a bookmark in the list to
@@ -635,7 +635,7 @@
\image qtcreator-bookmarks-view.webp {Listing bookmarks in Bookmarks view}
To move bookmarks up and down, select \uicontrol {Move Up} or
\uicontrol {Move Down} in the context menu or press \key {Ctrl+Alt+,} or
\uicontrol {Move Down} in the context menu or select \key {Ctrl+Alt+,} or
\key {Ctrl+Alt+.}.
To list bookmarks alphabetically by the name of the file where you set them,
@@ -702,7 +702,7 @@
To view information about the C++ code model in the
\uicontrol {C++ Code Model Inspector} dialog and write it to a log file,
select \uicontrol Tools > \uicontrol {Debug \QC } >
\uicontrol {Inspect C++ Code Model} or press \key {Ctrl+Shift+F12}.
\uicontrol {Inspect C++ Code Model} or select \key {Ctrl+Shift+F12}.
\image qtcreator-code-model-inspector.webp {Code Model Inspector dialog}

4
doc/qtcreator/src/editors/creator-only/creator-copilot.qdoc
View File

@@ -89,9 +89,9 @@
the \key Tab key.
To apply a suggestion word-by-word, select \uicontrol {Apply Word}
or press \key {Alt+Right}.
or select \key {Alt+Right}.
To reject a suggestion, press \key Esc or the arrow keys.
To reject a suggestion, select \key Esc or the arrow keys.
\section1 Turn suggestions on and off

6
doc/qtcreator/src/editors/creator-only/creator-fakevim.qdoc
View File

@@ -11,18 +11,18 @@
To run the main editor in a manner similar to the Vim editor, go to
\uicontrol Edit > \uicontrol Advanced and select \uicontrol {Use FakeVim},
or press \key {Alt+Y,Alt+Y}.
or select \key {Alt+Y,Alt+Y}.
\section1 Escape FakeVim mode
To temporarily escape FakeVim mode to access the normal \QC keyboard
shortcuts like \key {Ctrl-R} for \uicontrol Run, press the comma
shortcuts like \key {Ctrl-R} for \uicontrol Run, select the comma
key (\key {,}) before pressing the shortcut.
\section1 Quit FakeVim mode
To quit the FakeVim mode, go to \uicontrol Edit > \uicontrol Advanced and
clear \uicontrol {Use FakeVim}, or press \key {Alt+Y,Alt+Y}.
clear \uicontrol {Use FakeVim}, or select \key {Alt+Y,Alt+Y}.
\sa {FakeVim Modes and Commands}, {FakeVim}, {Change editor colors}
*/

2
doc/qtcreator/src/editors/creator-only/creator-how-to-find-symbols.qdoc
View File

@@ -20,7 +20,7 @@
\li Place the cursor on the symbol in the editor.
\li Go to \uicontrol Tools > \uicontrol {C++} >
\uicontrol {Find References to Symbol Under Cursor},
or press \key {Ctrl+Shift+U}.
or select \key {Ctrl+Shift+U}.
\image qtcreator-find-references-to-symbol-under-cursor.webp {Found symbols in the Search Results view}
\endlist

10
doc/qtcreator/src/editors/creator-only/creator-locator.qdoc
View File

@@ -21,7 +21,7 @@
\list
\li Press \key {Ctrl+K} (\key {Cmd+K} on \macos).
\li Select \key {Ctrl+K} (\key {Cmd+K} on \macos).
\li Go to \uicontrol Tools, and then select \uicontrol Locate.
@@ -53,8 +53,8 @@
execute.
\li Select a locator filter in the filter list to use it. Press
the up and down arrow keys or press \key Ctrl+P and \key Ctrl+N
to move up and down the list, and then press \key Enter to use the
the up and down arrow keys or select \key Ctrl+P and \key Ctrl+N
to move up and down the list, and then select \key Enter to use the
selected filter.
\endlist
@@ -118,8 +118,8 @@
To create a new file and open it in the editor:
\list 1
\li Type \c f followed by \key Space, followed by path and file name
\li Press \key Enter or select \uicontrol {Create and Open File}.
\li Enter \c f followed by \key Space, followed by path and file name
\li Select \key Enter or select \uicontrol {Create and Open File}.
\endlist
To create a directory, select \uicontrol {Create Directory}.

4
doc/qtcreator/src/editors/creator-only/creator-markdown-editor.qdoc
View File

@@ -41,8 +41,8 @@
\li Place the cursor on the link.
\li Then, do one of the following:
\list
\li Press \key {Ctrl+Click} (or \key {Cmd+Click} on \macos).
\li Press \key F2.
\li Select \key {Ctrl+Click} (or \key {Cmd+Click} on \macos).
\li Select \key F2.
\li Go to \uicontrol {Follow Symbol Under Cursor} in the context
menu.
\endlist

20
doc/qtcreator/src/editors/creator-only/creator-modeling.qdoc
View File

@@ -131,28 +131,28 @@
\list
\li Select \uicontrol {Zoom In} toolbar button.
\li Press \key Ctrl++.
\li Press \key Ctrl and roll the mouse wheel up.
\li Select \key Ctrl++.
\li Select \key Ctrl and roll the mouse wheel up.
\endlist
To zoom out of diagrams:
\list
\li Select \uicontrol {Zoom Out}.
\li Press \key Ctrl+-.
\li Press \key Ctrl and roll the mouse wheel down.
\li Select \key Ctrl+-.
\li Select \key Ctrl and roll the mouse wheel down.
\endlist
To reset the diagram size to 100%:
\list
\li Select \uicontrol {Reset Zoom}.
\li Press \key Ctrl+0.
\li Select \key Ctrl+0.
\endlist
\section2 Printing Diagrams
To print diagrams, press \key Ctrl+C when no elements are selected in
To print diagrams, select \key Ctrl+C when no elements are selected in
the editor to copy all elements to the clipboard by using 300 dpi. Then
paste the diagram to an application that can print images.
@@ -340,14 +340,14 @@
associations.
\li To create \e {sampling points} that divide a relation into two
connected lines, select a relation and press \key Shift and click
connected lines, select a relation and select \key Shift and click
on the relation line.
If possible, the end point of a relation is moved automatically
to draw the line to the next sampling point either vertically or
horizontally.
\li To remove a sampling point, press \key Ctrl and click the sampling
\li To remove a sampling point, select \key Ctrl and click the sampling
point.
\li To group elements, drag a \uicontrol Boundary element to
@@ -500,9 +500,9 @@
\section2 Add and delete points
To add more points, press \key Shift and click a relation.
To add more points, select \key Shift and click a relation.
To delete a point, press \key Ctrl and click a point.
To delete a point, select \key Ctrl and click a point.
\section2 Specify members

10
doc/qtcreator/src/editors/creator-only/creator-scxml.qdoc
View File

@@ -71,12 +71,12 @@
\uicontrol {Zoom Out}
\li Zooms into or out of the whole state chart in the state editor.
You can also press \key Ctrl and use the mouse wheel.
You can also select \key Ctrl and use the mouse wheel.
\row
\li \inlineimage icons/pan.png
\li \uicontrol Panning
\li Pans the state chart. To increase the pace of panning, press down the
\key Shift key.
\li Pans the state chart. To increase the pace of panning, select
\key {Shift}.
\row
\li \inlineimage icons/fittoview.png
\li \uicontrol {Fit to View}
@@ -85,7 +85,7 @@
\li \inlineimage icons/zoom.png
\li \uicontrol {Magnifier Tool}
\li Zooms into a part of the state chart. To move the magnifier tool
faster, press down the \key Alt key.
faster, select and hold \key {Alt}.
\row
\li \inlineimage icons/navigator.png
\li \uicontrol {Navigator}
@@ -180,7 +180,7 @@
Drag states on top of other states to create compound states. You can also
drag child states out of their parent state. To move child states
within their parent, press down the \key Ctrl key while dragging them.
within their parent, select and hold \key Ctrl while dragging them.
\section1 Aligning and Editing States

8
doc/qtcreator/src/editors/creator-only/creator-text-editing-macros.qdoc
View File

@@ -21,11 +21,11 @@
\list 1
\li Go to \uicontrol Tools > \uicontrol {Text Editing Macros} >
\uicontrol {Record Macro} or press \key {Alt+[}.
\li Press keyboard keys.
\uicontrol {Record Macro} or select \key {Alt+[}.
\li Select keyboard keys.
\li To stop recording, go to \uicontrol Tools >
\uicontrol {Text Editing Macros} > \uicontrol {Stop Recording Macro}
or press \key {Alt+]}.
or select \key {Alt+]}.
\endlist
\note The macro recorder does not support code completion.
@@ -37,7 +37,7 @@
\list
\li Go to \uicontrol Tools > \uicontrol {Text Editing Macros} >
\uicontrol {Play Last Macro}.
\li Press \key {Alt+R}.
\li Select \key {Alt+R}.
\li Enter \c rm in the locator.
\endlist

2
doc/qtcreator/src/editors/creator-preferences-text-editor-behavior.qdoc
View File

@@ -80,7 +80,7 @@
\uicontrol Unindents.
You can specify whether the \key Tab key automatically indents text when you
press it. To automatically indent text, select \uicontrol Always in the
select it. To automatically indent text, select \uicontrol Always in the
\uicontrol {Tab key performs auto-indent} field. To only indent text when
the cursor is located within leading white space, select \uicontrol {In
Leading White Space}.

2
doc/qtcreator/src/editors/creator-quick-fixes.qdoc
View File

@@ -33,7 +33,7 @@
quick fix.
\endlist
Or, press \key {Alt+Enter} to open a context menu that has
Or, select \key {Alt+Enter} to open a context menu that has
quick fixes available in the current cursor position.
By default, the refactored files are saved automatically. To turn off

8
doc/qtcreator/src/editors/creator-search.qdoc
View File

@@ -21,7 +21,7 @@
\list 1
\li Press \key {Ctrl+F} or go to \uicontrol Edit >
\li Select \key {Ctrl+F} or go to \uicontrol Edit >
\uicontrol {Find/Replace} > \uicontrol {Find/Replace}.
\li In \uicontrol Find, enter the text you are looking for.
@@ -32,10 +32,10 @@
type.
\li To go to the next occurrence, select \inlineimage icons/next.png
(\uicontrol {Find Next}), or press \key F3.
(\uicontrol {Find Next}), or select \key F3.
\li To go to the previous occurrence, select \inlineimage icons/prev.png
(\uicontrol {Find Previous}), or press \key {Shift+F3}.
(\uicontrol {Find Previous}), or select \key {Shift+F3}.
\li To select all found occurrences in a file, select
\uicontrol {Select All}.
@@ -146,7 +146,7 @@
\section1 Search in all projects
\list 1
\li Press \key {Ctrl+Shift+F} or go to \uicontrol Edit >
\li Select \key {Ctrl+Shift+F} or go to \uicontrol Edit >
\uicontrol {Find/Replace} > \uicontrol {Advanced Find} >
\uicontrol {Open Advanced Find}.
\li In \uicontrol Scope, select \uicontrol {All Projects}.

6
doc/qtcreator/src/editors/creator-semantic-highlighting.qdoc
View File

@@ -126,12 +126,12 @@
Use keyboard shortcuts to move within and between code blocks:
\list
\li To go to block end, press \key {Ctrl+]}.
\li To go to block start, press \key {Ctrl+[}.
\li To go to block end, select \key {Ctrl+]}.
\li To go to block start, select \key {Ctrl+[}.
\endlist
To also select the lines from the cursor position to the end
or beginning of the block, press \key {Ctrl+Shift+]} and
or beginning of the block, select \key {Ctrl+Shift+]} and
\key {Ctrl+Shift+[}, respectively.
\endif

42
doc/qtcreator/src/external-resources/external-resources-qds.qdoc
View File

@@ -3,19 +3,15 @@
/*!
\externalpage https://doc.qt.io/qtdesignstudio/index.html
\title Qt Design Studio Manual
\title Qt Design Studio documentation
*/
/*!
\externalpage https://doc.qt.io/qtdesignstudio/studio-optimized-3d-scenes.html
\title Creating Optimized 3D Scenes
\title Creating optimized 3D scenes
*/
/*!
\externalpage https://doc.qt.io/qtdesignstudio/qtquick-optimizing-designs.html
\title Optimizing Designs
*/
/*!
\externalpage https://doc.qt.io/qtdesignstudio/studio-optimized-3d-scenes.html
\title Creating Optimized 3D Scenes
\title Optimizing designs
*/
/*!
\externalpage https://doc.qt.io/QtForMCUs/
@@ -105,6 +101,38 @@
\externalpage https://doc.qt.io/qt/linguist-id-based-i18n.html
\title Text ID based translations
*/
/*!
\externalpage https://doc.qt.io/qtcreator/creator-developing-mcu.html
\title Developing for MCUs
*/
/*!
\externalpage https://doc.qt.io/qtcreator/creator-how-tos.html#mcus
\title How To: Develop for MCUs
*/
/*!
\externalpage https://doc.qt.io/QtForMCUs/qtul-setup-development-host.html#prerequisites
\title MCU prerequisites for desktop
*/
/*!
\externalpage https://doc.qt.io/QtForMCUs/qtul-setup-development-host.html#qt-creator-setup
\title MCU kit for desktop
*/
/*!
\externalpage https://doc.qt.io/QtForMCUs/qtul-prerequisites.html
\title MCU target device-specific prerequisites
*/
/*!
\externalpage https://doc.qt.io/qtcreator/creator-how-to-create-mcu-kits.html
\title MCU kit for a target device
*/
/*!
\externalpage https://doc.qt.io/QtForMCUs/qtul-supported-platforms.html
\title Supported MCU target devices
*/
/*!
\externalpage https://wiki.qt.io/QtDesignStudio/MCU_FAQ
\title Qt Design Studio/MCU FAQ
*/
/*!
\externalpage https://www.qt.io/blog/qt-design-studio-4.6-released
\title Qt Design Studio 4.6 released

6
doc/qtcreator/src/howto/creator-external-tools.qdoc
View File

@@ -1,4 +1,4 @@
// Copyright (C) 2023 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
// **********************************************************************
@@ -10,8 +10,8 @@
/*!
\page creator-editor-external.html
\if defined(qtdesignstudio)
\previouspage quick-converting-ui-projects.html
\nextpage studio-on-mcus.html
\previouspage creator-vcs-git.html
\nextpage studio-accessing-output-issues-and-warnings.html
\else
\previouspage creator-how-tos.html
\endif

6
doc/qtcreator/src/howto/creator-help.qdoc
View File

@@ -27,9 +27,9 @@
symbol.
\li To show tooltips for function signatures regardless of the
cursor position in the function call, press \key {Ctrl+Shift+D}.
cursor position in the function call, select \key {Ctrl+Shift+D}.
\li To show the full help on a Qt class or function, press \key F1 or
\li To show the full help on a Qt class or function, select \key F1 or
select \uicontrol {Context Help} in the context menu.
The documentation is shown in a
view next to the code editor, or, if there is not enough vertical
@@ -305,7 +305,7 @@
\title Detach the help window
By default, context-sensitive help opens in a window next to the
code editor when you press \key F1. If there is not enough vertical
code editor when you select \key F1. If there is not enough vertical
space, the help opens in the full-screen help mode.
\if defined(qtdesignstudio)

2
doc/qtcreator/src/howto/creator-keyboard-preferences.qdoc
View File

@@ -59,7 +59,7 @@
\list 1
\li Select \uicontrol Record.
\li Press the keys to use as the keyboard shortcut.
\li Select the keys to use as the keyboard shortcut.
\li Select \uicontrol {Stop Recording} when you are done.
\endlist

2
doc/qtcreator/src/howto/creator-only/creator-autotest.qdoc
View File

@@ -421,7 +421,7 @@
To locate Qt Test data tags:
\list 1
\li Press \key {Ctrl+K} (\key {Cmd+K} on \macos) to activate the locator.
\li Select \key {Ctrl+K} (\key {Cmd+K} on \macos) to activate the locator.
\li Enter \c qdt, followed by a space.
\endlist

2
doc/qtcreator/src/howto/creator-only/creator-cli.qdoc
View File

@@ -133,7 +133,7 @@
\row
\li -presentationMode
\li Core plugin: display keyboard shortcuts as popups when you
press them. Mostly useful when presenting \QC to someone else.
select them. Mostly useful when presenting \QC to someone else.
\row
\li -theme <default | dark>

3
doc/qtcreator/src/howto/creator-only/creator-how-to-contact-qt.qdoc
View File

@@ -45,6 +45,5 @@
{#qt-creator} channel on Libera.Chat IRC, go to \uicontrol Help >
\uicontrol Contact.
\sa {Paste and fetch code snippets}, {Technical Support},
{Turn on crash reports}
\sa {Paste and fetch code snippets}, {Technical support}
*/

2
doc/qtcreator/src/howto/creator-only/creator-how-to-install.qdoc
View File

@@ -89,5 +89,5 @@
{Building Qt Creator from Git}.
\sa {Manage Kits}{How To: Manage Kits}, {Register installed Qt versions},
{Install plugins}, {Licenses and Acknowledgments}
{Install plugins}, {Licenses and acknowledgments}
*/

10
doc/qtcreator/src/howto/creator-only/qtcreator-faq.qdoc
View File

@@ -149,7 +149,7 @@
To trigger the GDB command that generates a core file while debugging,
go to \uicontrol View > \uicontrol Views > \l {Debugger Log}.
In the \uicontrol Command field, type \c gcore and press \key Enter. The
In the \uicontrol Command field, type \c gcore and select \key Enter. The
core file is created in the current working directory. You can specify
another location for the file, including a relative or absolute path, as an
argument of the command.
@@ -285,7 +285,7 @@
One common factor in many use cases is switching editors while working on a
set of open files. While working on files A and B, users sometimes need to
look at file C. They can press \key Ctrl+Tab to move between the files and
look at file C. They can select \key Ctrl+Tab to move between the files and
have the files open in the correct editor according to file type. The list
is sorted by last used.
@@ -298,9 +298,9 @@
\list
\li Press \key F4 to switch between header and source.
\li Select \key F4 to switch between header and source.
\li Press \key Alt+Left to move backwards in the navigation history.
\li Select \key Alt+Left to move backwards in the navigation history.
\li Use the locator (Ctrl+K) to simply tell \QC where to go.
@@ -319,7 +319,7 @@
With \QC, developers can type \c {Ctrl+K m AFun} to find the function.
Typically, they only need to type 3 to 4 characters of the function name.
They can then fix the problem and press \key Alt+Back to go back to where
They can then fix the problem and select \key Alt+Back to go back to where
they were.
Other locator filters include \c c for classes, \c : for all symbols, and

2
doc/qtcreator/src/howto/creator-sessions.qdoc
View File

@@ -113,7 +113,7 @@
To locate a session:
\list 1
\li Press \key {Ctrl+K} (\key {Cmd+K} on \macos) to activate the locator.
\li Select \key {Ctrl+K} (\key {Cmd+K} on \macos) to activate the locator.
\li Enter:
\list
\li \c {t} \e {<session_name>}

2
doc/qtcreator/src/linux-mobile/creator-how-to-build-on-remote-devices.qdocinc
View File

@@ -18,7 +18,7 @@
add the path to the CMake executable on the \1.
\li Go to \uicontrol {Preferences} > \uicontrol Kits >
\uicontrol {Qt Versions}, and then press \key Shift and click the
\uicontrol {Qt Versions}, and then select and hold \key Shift and select the
\uicontrol Add button to add the Qt version on the \1.
\li Go to \uicontrol {Preferences} > \uicontrol Kits >

2
doc/qtcreator/src/overview/creator-acknowledgements.qdoc
View File

@@ -17,7 +17,7 @@
\ingroup creator-reference
\title Licenses and Acknowledgments
\title Licenses and acknowledgments
\brief Licenses and third-party components in \QC.

2
doc/qtcreator/src/overview/creator-only/creator-configuring.qdoc
View File

@@ -129,7 +129,7 @@
\section2 Navigating with the Keyboard
To move between UI controls, press the the \key Tab key or the \key Left,
To move between UI controls, select the \key Tab key or the \key Left,
\key Right, \key Up, and \key Down arrow keys.
\section2 Setting Zoom Levels

4
doc/qtcreator/src/overview/creator-only/creator-getting-started.qdoc
View File

@@ -22,10 +22,10 @@
If you have not used an integrated development environment (IDE)
before, or want to know what kind of IDE \QC is, go to
\l{Overview}.
\li \b {\l{User Interface}}
\li \b {\l{User interface}}
If you have not used \QC before, and want to become familiar
with the parts of the user interface, go to \l{User Interface}.
with the parts of the user interface, go to \l{User interface}.
\li \b {\l{Configuring Qt Creator}}
To make \QC behave more like your favorite code editor or IDE,

8
doc/qtcreator/src/overview/creator-only/creator-overview.qdoc
View File

@@ -68,12 +68,12 @@
\image heartgame-start.webp {Heart Rate Game}
To create intuitive, modern-looking, fluid user interfaces (UI), use
\l{Qt Quick} and \l{Qt Design Studio Manual}{\QDS}:
\l{Qt Quick} and \l{Qt Design Studio documentation}{\QDS}:
\list
\li \l {\QMLD}
Or, enable the \QMLD plugin to visually edit \l{UI Files}{UI files}
Or, enable the \QMLD plugin to visually edit \l{UI files}
(.ui.qml).
\li \l {Converting UI Projects to Applications}
@@ -82,14 +82,14 @@
development, you have to convert them to Qt Quick
Application projects that have project configuration
files (CMakeLists.txt or .pro), .cpp, and .qrc files.
\li \l {UI Files}
\li \l {UI files}
If you switch between \QC and \QDS or cooperate with
designers on a project, you might encounter .ui.qml files.
They are intended to be edited in \QDS only, so you need
to be careful not to break the code. To visually edit the
files in \QC, enable the \QMLD plugin.
\li \l{Using QML Modules with Plugins}
\li \l{Using QML modules with plugins}
Load C++ plugins for QML to simulate data.
\endlist

2
doc/qtcreator/src/overview/creator-tech-support.qdoc
View File

@@ -19,7 +19,7 @@
\ingroup creator-reference
\title Technical Support
\title Technical support
\brief Qt support sites and other useful sites.

6
doc/qtcreator/src/projects/creator-only/creator-projects-build-run-tutorial.qdoc
View File

@@ -31,7 +31,7 @@
between the host and devices. For more information, see
\l{\B2Q: Documentation}.
If you have \l{Qt Design Studio Manual}{\QDS} installed, you can open
If you have \l{Qt Design Studio documentation}{\QDS} installed, you can open
\QDS examples from \QC in \QDS.
\list 1
@@ -72,7 +72,7 @@
\li Select \inlineimage icons/run_small.png
(\uicontrol Run) to build and run the application.
\li To see the compilation progress, press \key{Alt+4} to open
\li To see the compilation progress, select \key{Alt+4} to open
\l {Compile Output}.
If build errors occur, check that you have a Qt version, a
@@ -88,5 +88,5 @@
\sa {Manage Kits}{How To: Manage Kits}, {Open projects},
{Developing for Android}, {Developing for iOS},
{Compile Output}, {\B2Q: Documentation}, {Qt Design Studio Manual}
{Compile Output}, {\B2Q: Documentation}, {Qt Design Studio documentation}
*/

2
doc/qtcreator/src/projects/creator-only/creator-projects-building.qdoc
View File

@@ -55,7 +55,7 @@
\list
\li Select \inlineimage icons/cancel-build.png.
\li Press \key {Alt+Backspace}.
\li Select \key {Alt+Backspace}.
\li Go to \uicontrol Build > \uicontrol {Cancel Build}.
\endlist

4
doc/qtcreator/src/projects/creator-only/creator-projects-opening.qdoc
View File

@@ -39,10 +39,10 @@
\li Use the following keyboard shortcuts, depending on the mode you are
currently in:
\list
\li In all modes, press \key Ctrl+O (\key Cmd+O on \macos) to open the
\li In all modes, select \key Ctrl+O (\key Cmd+O on \macos) to open the
\uicontrol {Open File} dialog, where you can select a project file.
\li On Windows and Linux, in all modes except the \uicontrol Help mode,
press \key Ctrl+Shift+O to open the \uicontrol {Load Project} dialog.
select \key Ctrl+Shift+O to open the \uicontrol {Load Project} dialog.
\li In the \uicontrol Welcome mode, \uicontrol Projects tab, press
\key Ctrl+Shift+number (\key Cmd+Shift+number on \macos), where
the number is the number of a project in the list of recently opened

2
doc/qtcreator/src/projects/creator-only/creator-projects-qt-versions.qdoc
View File

@@ -72,7 +72,7 @@
\uicontrol {Qt Versions} > \uicontrol Add.
To add a Qt version on a remote Linux device or in Docker,
press \key Shift and click \uicontrol Add.
select \key Shift and click \uicontrol Add.
\li Select the qmake executable for the Qt version to add.

2
doc/qtcreator/src/projects/creator-only/creator-projects-settings-overview.qdoc
View File

@@ -56,7 +56,7 @@
If you selected CMake as the build system for the project, a
\e {Release with Debug Information} build configuration is also available.
It is similar to a \e profile configuration, but with
\l{Debugging Qt Quick Projects}{QML debugging and profiling} explicitly turned off.
\l{Debugging Qt Quick projects}{QML debugging and profiling} explicitly turned off.
You can also use a \e {Minimum Size Release} build configuration to create the
final installation binary package. It is a release build that makes the size
of the binary package as small as possible, even if this makes the

2
doc/qtcreator/src/projects/creator-only/creator-projects-settings-run-debug.qdoc
View File

@@ -38,7 +38,7 @@
However, you can usually leave this field empty.
\note To create a build configuration that supports debugging for a
Qt Quick application project, you also need to \l {Using Default Values}
Qt Quick application project, you also need to \l {Using default values}
{enable QML debugging} either globally or in the \uicontrol {Build Settings}
of the project.

2
doc/qtcreator/src/python/creator-tutorial-python-application-qt-widgets-ui.qdoc
View File

@@ -100,7 +100,7 @@
\b{Select me}.
\li Double-click the \uicontrol {Push Button} widget and enter the text
\b{Click me}.
\li Press \key {Ctrl+S} (or \key {Cmd+S}) to save your changes.
\li Select \key {Ctrl+S} (or \key {Cmd+S}) to save your changes.
\endlist
For more information about designing UIs with \QD, see \l{\QD Manual}.

2
doc/qtcreator/src/python/creator-tutorial-python-application-qtquick.qdoc
View File

@@ -190,7 +190,7 @@
}
\endcode
You can also use \l{Qt Design Studio Manual}{\QDS} to design Qt Quick UIs.
You can also use \l{Qt Design Studio documentation}{\QDS} to design Qt Quick UIs.
\section1 Run the application

2
doc/qtcreator/src/qtcreator-toc.qdoc
View File

@@ -17,7 +17,7 @@
\li \l{Getting Started}
\list
\li \l{Overview}
\li \l{User Interface}
\li \l{User interface}
\li \l{Configuring Qt Creator}
\endlist
\li \l{Creating Projects}

2
doc/qtcreator/src/qtquick/creator-only/creator-mobile-app-tutorial.qdoc
View File

@@ -202,7 +202,7 @@
\uicontrol {Always allow from this computer} check box, and then select
\uicontrol OK.
\li To run the application on the device, press \key {Ctrl+R}.
\li To run the application on the device, select \key {Ctrl+R}.
\endlist
*/

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

@@ -27,7 +27,7 @@
For more examples, see \l{Qt Quick Examples and Tutorials}.
You can use a visual editor to develop Qt Quick applications in \QDS. For
more information, see \l{Qt Design Studio Manual}.
more information, see \l{Qt Design Studio documentation}.
\include qtquick-tutorial-create-empty-project.qdocinc qtquick empty application
@@ -149,7 +149,7 @@
\skipto import
\printuntil /^\ {0}\}/
Press \key {Ctrl+R} to run the application, and click the rectangles to
Select \key {Ctrl+R} to run the application, and click the rectangles to
move the Qt logo from one rectangle to another.
\section1 Animate transitions
@@ -180,6 +180,6 @@
\printuntil /^\ {0}\}/
Press \key {Ctrl+R} to run the application, and click the rectangles to
Select \key {Ctrl+R} to run the application, and click the rectangles to
view the animated transitions.
*/

4
doc/qtcreator/src/qtquick/creator-only/qtquick-designer-plugin.qdoc
View File

@@ -13,7 +13,7 @@
Use wizards to create Qt Quick projects that have boiler-plate code. Change
the code in the \uicontrol Edit mode or use a separate visual editor,
\l{Qt Design Studio Manual}{\QDS} to open and edit \l{UI Files}{UI files}
\l{Qt Design Studio documentation}{\QDS} to open and edit \l{UI files}
(.ui.qml).
Don't edit UI files in the \uicontrol Edit mode because it is easy
@@ -43,7 +43,7 @@
{QML types}, see the Qt reference documentation available online and
in the \uicontrol Help mode.
For more information about using \QMLD, see \l{Qt Design Studio Manual}.
For more information about using \QMLD, see \l{Qt Design Studio documentation}.
\sa {Create Qt Quick Applications}, {Create Qt Quick UI Prototypes},
{Enable and disable plugins}

17
doc/qtcreator/src/qtquick/creator-only/qtquick-from-qmlproject-to-pro.qdoc Normal file
View File

@@ -0,0 +1,17 @@
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
\page quick-converting-ui-projects.html
\nextpage creator-editor-external.html
\previouspage creator-reference.html
\ingroup creator-reference-ui-design
\title Converting UI Projects to Applications
\brief Converting a project that has a .qmlproject file to one that has a
.pro file.
\include qtquick-converting-ui-projects-to-applications.qdocinc {converting-ui-projects-to-applications} {Qt Quick UI Prototype}
*/

178
doc/qtcreator/src/qtquick/qtquick-converting-ui-projects-to-applications.qdocinc Normal file
View File

@@ -0,0 +1,178 @@
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
//! [converting-ui-projects-to-applications]
\1 projects are useful for creating user interfaces. To
use them for application development in Qt Creator you have to add:
\list
\li A project configuration file (CMakeLists.txt or a .pro file)
\li C++ code (.cpp)
\li Resource files
\li Code needed for deploying applications to \l{glossary-device}
{devices}
\endlist
For more information about integrating QML and C++, see
\l{Overview - QML and C++ Integration}.
\note Since \QDS 2.3.0, \QDS project wizard templates generate projects that
can be built with CMake. You can open the \e CMakeLists.txt project file in
Qt Creator to continue developing the project. Also, you can use Qt Creator
to create a Qt Quick Application project that you can open in \QDS.
\target wizard-template-note
\note Since \QDS 3.9.0, \QDS project wizard templates generate projects that
automatically check out and build the Qt Quick Studio Components from
\l{https://code.qt.io/cgit/qt-labs/qtquickdesigner-components.git/} {Qt Code Review},
using CMake. To turn off this feature, use the option \e BUILD_QDS_COMPONENTS
in the CMake configuration.
\if defined(qtcreator)
For more information about using \QDS to create projects, see
\l{Qt Design Studio documentation}.
\endif
To use qmake as the build system, use a Qt Creator
wizard template to create a Qt Quick application that is built using the
qmake build system and then copy the source files from the Qt UI Quick
project to the application project.
You can use the \c RESOURCES option in the project configuration file to
automatically add all the QML files and related assets to a
\l{The Qt Resource System}{Qt resource collection file (.qrc)}. However,
large files should be included as external binary resources instead of
compiling them into the binary.
The wizard automatically adds the \c QML_IMPORT_PATH option to the project
file for specifying the required \l{QML Import Path}{QML import path}. The
path is only needed if more than one subdirectory has QML files.
Then you can use the \l QQuickView class in the main C++ source file to
show the main QML file when the application starts.
\if defined(qtcreator)
The \e {Qt Quick Designer Components} module is installed when you
install \QDS. If you use Qt Quick Studio Components or Effects
from the module in a project that you want to edit in Qt Creator,
you have to build the module and install it to your Qt to be able to
build your project. For more information, see
\l{Adding Qt Quick Designer Components to Qt Installations}.
The \l{Qt Quick Timeline} module is installed when you install \QDS.
If you only install Qt Creator and Qt, remember to also select the
Qt Quick Timeline module for installation. If your Qt is older than
5.14, you must build the Qt Quick Timeline module and install it to
your Qt to be able to build your project.
\section1 Converting into qmake Projects
To convert a project that has a .qmlproject file to one that has a .pro
file:
\list 1
\li Select \uicontrol File > \uicontrol {New Project} >
\uicontrol {Application (Qt)} > \uicontrol {Qt Quick Application} >
\uicontrol Choose.
\li In the \uicontrol {Build system} field, select \l qmake as the build
system to use for building and running the project, and then select
\uicontrol Next (or \uicontrol Continue on \macos).
\li Follow the instructions of the wizard to create the project.
\li In the file explorer, copy the source files from the Qt Quick UI
project directory to a subdirectory in the application
project directory. For the purpose of these instructions, the
directory is called \c qml.
\li Open the application project file, and edit the value of the
\c RESOURCES option to add the following line:
\badcode
RESOURCES += \
$$files(qml/*)
\endcode
\li Also edit the value of the \c QML_IMPORT_PATH option to specify the
QML import path:
\badcode
QML_IMPORT_PATH = qml/imports
\endcode
Where \c {qml/imports} is the import path.
\li Select \uicontrol Build > \uicontrol {Run qmake} to apply the
\c RESOURCES option to the build configuration.
\li Open the \e {main.cpp} file and replace the QQmlApplicationEngine
object with a QQuickView object:
\quotefromfile progressbar/main.cpp
\skipto QQuickView view;
\printuntil view.show()
Where \c {qrc:/qml/imports} is the import path and
\c {qrc:/qml/ProgressBar.ui.qml} is the path to and the
name of the main QML file in the Qt Quick UI project.
\li Select \uicontrol Build > \uicontrol Run to build and run your
project.
\note If you get error messages related to modules, perfom the steps
described in \l{Adding Qt Quick Designer Components to Qt Installations}.
\endlist
For example, if you copy the source files of the \e ProgressBar
example from your \QDS installation (located in the
\c{\share\qtcreator\examples\ProgressBar} directory) to an empty
Qt Quick application project and make the necessary changes, the
\e {main.cpp} file should look as follows:
\quotefile progressbar/main.cpp
\endif
\if defined(qtdesignstudio)
If you only install Qt Creator and Qt, remember to also select the
Qt Quick Timeline module for installation.
\endif
\section1 Handling Large Data Files
Graphical assets used in the UI, such as images, effects, or 3D scenes
are a typical cause for performance problems in UIs. Even building the
application requires huge amounts of memory if you try to include large
asset files, such as 100-MB 3D models or 64-MB textures, into the \c .qrc
file for compiling them into the binary.
First try to optimize your assets, as described in
\l{Optimizing designs} and \l {Creating optimized 3D scenes}.
Large assets should either be loaded directly from the file system or by
using the Qt resource system dynamically. For more information, see
\l{The Qt Resource System}.
\section1 Adding Qt Quick Designer Components to Qt Installations
Since \QDS 3.9, the Qt Quick Studio Components module is installed by default
as part of the application created with \QDS. You can also install the module manually.
For example:
\list 1
\li Clone the module repository.
\badcode
git clone https://code.qt.io/qt-labs/qtquickdesigner-components.git
\endcode
\li Install the Qt Quick Designer Components module.
\badcode
mkdir build
cd build
cmake -GNinja -DCMAKE_INSTALL_PREFIX=<path_to_qt_install_directory> <path_to_qtquickdesigner-components>
cmake --build .
cmake --install .
\endcode
\note Here, \e <path_to_qt_install_directory> and \e <path_to_qtquickdesigner-components>
needs to be replaced with the real location on your local drive. For example,
\e <path_to_qt_install_directory> can be something like \e /Qt/6.3.0/msvc2019_64
and \e <path_to_qtquickdesigner-components> like this \e ../qtquickdesigner-components/
\endlist
\if defined(qtcreator)
\sa {Create Qt Quick UI Prototypes}
\endif
//! [converting-ui-projects-to-applications]
*/

194
doc/qtcreator/src/qtquick/qtquick-from-qmlproject-to-pro.qdoc
View File

@@ -1,194 +0,0 @@
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
\page quick-converting-ui-projects.html
\if defined(qtdesignstudio)
\previouspage studio-porting-projects.html
\nextpage creator-editor-external.html
\else
\previouspage creator-reference.html
\endif
\ingroup creator-reference-ui-design
\title Converting UI Projects to Applications
\brief Converting a project that has a .qmlproject file to one that has a
.pro file.
Qt Quick UI Prototype projects are useful for creating user interfaces. To
use them for application development in Qt Creator you have to add:
\list
\li Project configuration file (CMakeLists.txt or .pro)
\li C++ code (.cpp)
\li Resource files
\li Code needed for deploying applications to \l{glossary-device}
{devices}
\endlist
For more information about integrating QML and C++, see
\l{Overview - QML and C++ Integration}.
\note Since \QDS 2.3.0, \QDS project wizard templates generate projects that
can be built with CMake. You can open the \e CMakeLists.txt project file in
Qt Creator to continue developing the project. Also, you can use Qt Creator
to create a Qt Quick Application project that you can open in \QDS.
\target wizard-template-note
\note Since \QDS 3.9.0, \QDS project wizard templates generate projects that
automatically checkout and build the Qt Quick Studio Components from
\l{https://code.qt.io/cgit/qt-labs/qtquickdesigner-components.git/} {Qt Code Review},
using CMake. To turn off this feature, use the option \e BUILD_QDS_COMPONENTS
in the CMake configuration.
\if defined(qtdesignstudio)
For more information, see \l{Designer-Developer Workflow}.
\else
For more information about using \QDS to create projects, see
\l{Qt Design Studio Manual}.
\endif
If you want to use qmake as the build system, you can use a Qt Creator
wizard template to create a Qt Quick application that is built using the
qmake build system and then copy the source files from the Qt UI Quick
project to the application project.
You can use the \c RESOURCES option in the project configuration file to
automatically add all the QML files and related assets to a
\l{The Qt Resource System}{Qt resource collection file (.qrc)}. However,
large files should be included as external binary resources instead of
compiling them into the binary.
The wizard automatically adds the \c QML_IMPORT_PATH option to the project
file for specifying the required \l{QML Import Path}{QML import path}. The
path is only needed if more than one subdirectory has QML files.
Then you can use the \l QQuickView class in the main C++ source file to
show the main QML file when the application starts.
The \e {Qt Quick Designer Components} module is installed when you
install \QDS. If you use Qt Quick Studio Components or Effects
from the module in a project that you want to edit in Qt Creator,
you have to build the module and install it to your Qt to be able to
build your project. For more information, see
\l{Adding Qt Quick Designer Components to Qt Installations}.
The \l{Qt Quick Timeline} module is installed when you install \QDS.
If you only install Qt Creator and Qt, remember to also select the
Qt Quick Timeline module for installation. If your Qt is older than
5.14, you must build the Qt Quick Timeline module and install it to
your Qt to be able to build your project.
\section1 Converting into qmake Projects
To convert a project that has a .qmlproject file to one that has a .pro
file:
\list 1
\li Select \uicontrol File > \uicontrol {New Project} >
\uicontrol {Application (Qt)} > \uicontrol {Qt Quick Application} >
\uicontrol Choose.
\li In the \uicontrol {Build system} field, select \l qmake as the build
system to use for building and running the project, and then select
\uicontrol Next (or \uicontrol Continue on \macos).
\li Follow the instructions of the wizard to create the project.
\li In the file explorer, copy the source files from the Qt Quick UI
project directory to a subdirectory in the application
project directory. For the purpose of these instructions, the
directory is called \c qml.
\li Open the application project file, and edit the value of the
\c RESOURCES option to add the following line:
\badcode
RESOURCES += \
$$files(qml/*)
\endcode
\li Also edit the value of the \c QML_IMPORT_PATH option to specify the
QML import path:
\badcode
QML_IMPORT_PATH = qml/imports
\endcode
Where \c {qml/imports} is the import path.
\li Select \uicontrol Build > \uicontrol {Run qmake} to apply the
\c RESOURCES option to the build configuration.
\li Open the \e {main.cpp} file and replace the QQmlApplicationEngine
object with a QQuickView object:
\quotefromfile progressbar/main.cpp
\skipto QQuickView view;
\printuntil view.show()
Where \c {qrc:/qml/imports} is the import path and
\c {qrc:/qml/ProgressBar.ui.qml} is the path to and the
name of the main QML file in the Qt Quick UI project.
\li Select \uicontrol Build > \uicontrol Run to build and run your
project.
\note If you get error messages related to modules, perfom the steps
described in \l{Adding Qt Quick Designer Components to Qt Installations}.
\endlist
For example, if you copy the source files of the \e ProgressBar
example from your \QDS installation (located in the
\c{\share\qtcreator\examples\ProgressBar} directory) to an empty
Qt Quick application project and make the necessary changes, the
\e {main.cpp} file should look as follows:
\quotefile progressbar/main.cpp
\section1 Handling Large Data Files
Graphical assets used in the UI, such as images, effects, or 3D scenes
are a typical cause for performance problems in UIs. Even building the
application requires huge amounts of memory if you try to include large
asset files, such as 100-MB 3D models or 64-MB textures, into the \c .qrc
file for compiling them into the binary.
First try to optimize your assets, as described in \l{Optimizing Designs}
and \l {Creating Optimized 3D Scenes}.
If you really need large assets, they should either be loaded directly from
the file system or use the Qt resource system in the dynamic way. For more
information, see \l{The Qt Resource System} in the Qt documentation.
\section1 Adding Custom Fonts
\if defined(qtdesignstudio)
To \l{Using Custom Fonts}{use custom fonts}
\else
To use custom fonts
\endif
from the Qt Quick UI project, call the QFontDatabase::addApplicationFont()
function from the \e {main.cpp} file.
\section1 Adding Qt Quick Designer Components to Qt Installations
Since \QDS 3.9, the Qt Quick Studio Components module is installed by default
as part of the application. You can also install the module manually.
For example:
\list 1
\li Clone the module repository.
\badcode
git clone https://code.qt.io/qt-labs/qtquickdesigner-components.git
\endcode
\li Install the Qt Quick Designer Components module.
Enter the following commands:
\badcode
mkdir build
cd build
cmake -GNinja -DCMAKE_INSTALL_PREFIX=<path_to_qt_install_directory> <path_to_qtquickdesigner-components>
cmake --build .
cmake --install .
\endcode
\note Here, \e <path_to_qt_install_directory> and \e <path_to_qtquickdesigner-components>
needs to be replaced with the real location on your local drive. For example,
\e <path_to_qt_install_directory> can be something like \e /Qt/6.3.0/msvc2019_64
and \e <path_to_qtquickdesigner-components> like this \e ../qtquickdesigner-components/
\endlist
\if defined(qtcreator)
\sa {Create Qt Quick UI Prototypes}
\endif
*/

4
doc/qtcreator/src/qtquick/qtquick-live-preview-devices.qdoc
View File

@@ -7,7 +7,7 @@
\previouspage studio-live-preview-desktop.html
\nextpage qt-design-viewer.html
\title Previewing on Devices
\title Previewing on devices
\else
\previouspage creator-how-tos.html
@@ -49,7 +49,7 @@
\image design-studio-select-kit.webp
\endif
\li Select \uicontrol Build > \uicontrol {QML Preview} or
press \key {Alt+P}.
select \key {Alt+P}.
\endlist
\section2 On Android

8
doc/qtcreator/src/qtquick/qtquick-modules-with-plugins.qdoc
View File

@@ -18,7 +18,7 @@
\ingroup creator-reference-ui-design
\title Using QML Modules with Plugins
\title Using QML modules with plugins
\brief Using C++ plugins to expose custom components to Qt Quick
applications.
@@ -129,16 +129,16 @@
\if defined(qtdesignstudio)
\section1 Running QML Modules in Design Mode
A QML emulation layer (also called QML Puppet) is used in the
The QML Puppet is used in the
\uicontrol Design mode to render and preview images and to collect
data. To be able to render custom components correctly from QML modules,
the emulation layer must be built with the same Qt version and compiler
the QML Puppet must be built with the same Qt version and compiler
as the QML modules.
\include qtdesignstudio-qt-runtime-version.qdocinc qt-runtime-version
A plugin should behave differently depending on whether it is run by the
emulation layer or an application. For example, animations should not be run
QML Puppet or an application. For example, animations should not be run
in the \uicontrol Design mode. You can use the value of the \c QML_PUPPET_MODE
environment variable to check whether the plugin is currently being run
by an application or edited in the \uicontrol Design mode.

2
doc/qtcreator/src/qtquick/qtquick-profiler.qdoc
View File

@@ -153,7 +153,7 @@
\ingroup creator-reference-analyzer
\title Profiling QML Applications
\title Profiling QML applications
\brief Improve the performance of QML applications.

4
doc/qtcreator/src/qtquick/qtquick-ui-forms.qdoc
View File

@@ -18,7 +18,7 @@
\ingroup creator-reference-ui-design
\title UI Files
\title UI files
\brief Limitations of \QDS UI files (.ui.qml).
@@ -156,7 +156,7 @@
\l{https://doc.qt.io/qt/qml-qtqml-qt.html}{Qt QML Methods}.
\if defined(qtdesignstudio)
\section1 Using UI Files
\section1 Using UI files
You can edit the UI files in the \l {2D} and
\uicontrol {Code} views. Components that are

6
doc/qtcreator/src/user-interface/creator-how-to-view-output.qdoc
View File

@@ -41,11 +41,11 @@
\endlist
To maximize an open output view, select the \inlineimage icons/arrowup.png
(\uicontrol Maximize) button or press \key {Alt+Shift+9}.
(\uicontrol Maximize) button or select \key {Alt+Shift+9}.
To increase or decrease the output text size, select \inlineimage icons/plus.png
(\uicontrol {Zoom In}) or \inlineimage icons/minus.png
(\uicontrol {Zoom Out}), or press \key Ctrl++ or \key Ctrl+-. Zooming is
(\uicontrol {Zoom Out}), or select \key Ctrl++ or \key Ctrl+-. Zooming is
not supported in all output views.
\section1 Change text encoding
@@ -60,7 +60,7 @@
\section1 Find and filter output
To search in output, press \key {Ctrl+F} when the view is active. Enter
To search in output, select \key {Ctrl+F} when the view is active. Enter
search criteria in the \uicontrol Find field. For more information, see
\l{Search in current file}.

2
doc/qtcreator/src/user-interface/creator-only/creator-how-to-show-and-hide-main-menu.qdoc
View File

@@ -16,7 +16,7 @@
\image qtcreator-without-menubar.webp {Qt Creator without the main menu}
\caption \QC without the main menu bar.
To show the main menu again, press \key {Ctrl+Alt+M}.
To show the main menu again, select \key {Ctrl+Alt+M}.
\sa {Show and hide sidebars},{Switch between modes}
*/

2
doc/qtcreator/src/user-interface/creator-only/creator-how-to-switch-between-modes.qdoc
View File

@@ -32,7 +32,7 @@
\li \uicontrol Welcome
\li \key Ctrl+1
\li Open projects, tutorials, and examples.
\li \l{User Interface}
\li \l{User interface}
\row
\li \uicontrol Edit
\li \key Ctrl+2

4
doc/qtcreator/src/user-interface/creator-only/creator-reference-sidebar-views.qdoc
View File

@@ -84,7 +84,7 @@
\list 1
\li Right-click a class in the code editor.
\li Select \uicontrol {Open Type Hierarchy} or press \key {Ctrl+Shift+T}.
\li Select \uicontrol {Open Type Hierarchy} or select \key {Ctrl+Shift+T}.
\endlist
\image qtcreator-type-hierarchy-view.png {Type Hierarchy view}
@@ -118,7 +118,7 @@
\list 1
\li Right-click a file in the editor.
\li Select \uicontrol {Open Include Hierarchy}
or press \key {Ctrl+Shift+I}.
or select \key {Ctrl+Shift+I}.
\endlist
\image qtcreator-include-hierarchy-view.png {Include Hierarchy view}

4
doc/qtcreator/src/user-interface/creator-only/creator-reference-terminal-view.qdoc
View File

@@ -39,10 +39,10 @@
\li To select a word in a terminal, double-click it. To select the whole line,
triple-click it. To select all text, select \uicontrol {Select All}
in the context menu or press \key {Ctrl+A}.
in the context menu or select \key {Ctrl+A}.
\li To open links in a browser, files in the editor, or folders in the
\l Projects view, hover the mouse over them, and press \key Ctrl.
\l Projects view, hover the mouse over them, and select \key Ctrl.
\li To \l{Search in current file}{search} through the output, press
\key {Ctrl+F}.

2
doc/qtcreator/src/user-interface/creator-reference-output-views.qdoc
View File

@@ -54,7 +54,7 @@
To jump from one issue to the next or previous
one, select \inlineimage icons/arrowup.png
and \inlineimage icons/arrowdown.png
or press \key F6 and \key Shift+F6.
or select \key F6 and \key Shift+F6.
By default, a new build clears the \uicontrol Issues view. To keep
the issues from the previous build rounds, deselect \preferences >

2
doc/qtcreator/src/user-interface/creator-ui.qdoc
View File

@@ -11,7 +11,7 @@
\nextpage creator-configuring.html
\endif
\title User Interface
\title User interface
\if defined(qtcreator)
When you start \QC, it opens to the \uicontrol Welcome mode.

2
doc/qtcreator/src/vcs/creator-vcs-git.qdoc
View File

@@ -11,7 +11,7 @@
\page creator-vcs-git.html
\if defined(qtdesignstudio)
\previouspage studio-finding-the-qt-runtime-version.html
\nextpage studio-porting-projects.html
\nextpage creator-editor-external.html
\title Using Git
\else

8
doc/qtcreator/src/widgets/qtdesigner-app-tutorial.qdoc
View File

@@ -155,8 +155,8 @@
\image qtcreator-textfinder-objectname.png {Changing object names}
\li Press \key {Ctrl+A} (or \key {Cmd+A}) to select the widgets and
select \uicontrol{Lay out Horizontally} (or press \key {Ctrl+H} on Linux or
\li Select \key {Ctrl+A} (or \key {Cmd+A}) to select the widgets and
select \uicontrol{Lay out Horizontally} (or select \key {Ctrl+H} on Linux or
Windows or \key {Ctrl+Shift+H} on \macos) to apply a horizontal
layout (QHBoxLayout).
@@ -165,7 +165,7 @@
\li Drag a \uicontrol{Text Edit} widget (QTextEdit) to the form.
\li Select the screen area, and then select \uicontrol{Lay out Vertically}
(or press \key {Ctrl+L}) to apply a vertical layout (QVBoxLayout).
(or select \key {Ctrl+L}) to apply a vertical layout (QVBoxLayout).
\image qtcreator-textfinder-ui.png {Text Finder UI}
@@ -193,7 +193,7 @@
\endlist
\li Press \key {Ctrl+S} (or \key {Cmd+S}) to save your changes.
\li Select \key {Ctrl+S} (or \key {Cmd+S}) to save your changes.
\endlist

6
doc/qtcreator/src/widgets/qtdesigner-overview.qdoc
View File

@@ -40,7 +40,7 @@
\section1 Code Editor Integration
To switch between forms (\uicontrol Design mode) and code (\uicontrol Edit mode),
press \key Shift+F4.
select \key Shift+F4.
You can use \QC to create stub implementations of slot functions. In the
\uicontrol Design mode, right-click a widget to open a context menu, and then
@@ -58,7 +58,7 @@
To open resource files from the code editor, select
\uicontrol {Follow Symbol Under Cursor} in the context menu
or press \key F2 when the cursor is over a string literal.
or select \key F2 when the cursor is over a string literal.
\section1 Specifying Settings for \QD
@@ -81,7 +81,7 @@
\endlist
To preview the settings, select \uicontrol Tools > \uicontrol{Form Editor} >
\uicontrol Preview, or press \key Alt+Shift+R.
\uicontrol Preview, or select \key Alt+Shift+R.
\section1 Previewing Forms Using Device Profiles

278
doc/qtdesignstudio/config/qtdesignstudio-icon-macros.qdocconf Normal file
View File

@@ -0,0 +1,278 @@
macro.image3dbackgroundcolor = "\\inlineimage icons/3d-background-color.png {the Background color button}"
macro.imageactionicon = "\\inlineimage icons/action-icon.png {the Action button}"
macro.imageactioniconbinding = "\\inlineimage icons/action-icon-binding.png {the Binding button}"
macro.imageaddfile16px = "\\inlineimage icons/add-file-16px.png {the Add a file button}"
macro.imageaddmaterial = "\\inlineimage icons/add_material.png {the Add a material button}"
macro.imageaddtexture = "\\inlineimage icons/add_texture.png {the Add a texture button}"
macro.imageailogo = "\\inlineimage ai-logo.png {the Adobe Illustrator logo}"
macro.imagealias = "\\inlineimage icons/alias.png {the Alias button}"
macro.imagealignbottom = "\\inlineimage icons/align-bottom.png {the Align bottom edges button}"
macro.imagealigncameraon = "\\inlineimage icons/align-camera-on.png {the Align view to camera button}"
macro.imagealigncenterhorizontal = "\\inlineimage icons/align-center-horizontal.png {the Align horizontal centers button}"
macro.imagealigncentervertical = "\\inlineimage icons/align-center-vertical.png {the Align vertical centers button}"
macro.imagealignleft = "\\inlineimage icons/align-left.png {the Align left edges button}"
macro.imagealignright = "\\inlineimage icons/align-right.png {the Align right edges button}"
macro.imagealigntop = "\\inlineimage icons/align-top.png {the Align top edges button}"
macro.imagealignviewon = "\\inlineimage icons/align-view-on.png {the Align cameras to view button}"
macro.imageanchorbottom = "\\inlineimage icons/anchor-bottom.png {the Anchor component to the bottom button}"
macro.imageanchorcenterhorizontal = "\\inlineimage icons/anchor-center-horizontal.png {the Anchor component horizontally button}"
macro.imageanchorcentervertical = "\\inlineimage icons/anchor-center-vertical.png {the Anchor component vertically button}"
macro.imageanchorfill = "\\inlineimage icons/anchor-fill.png {the Fill parent component button}"
macro.imageanchorleft = "\\inlineimage icons/anchor-left.png {the Anchor component to the left button}"
macro.imageanchorrigh = "\\inlineimage icons/anchor-right.png {the Anchor component to the right button}"
macro.imageanchortop = "\\inlineimage icons/anchor-top.png {the Anchor component to the top button}"
macro.imageanimatedimageicon16 = "\\inlineimage animated-image-icon16.png {the Animated Image component}"
macro.imageanimation = "\\inlineimage icons/animation.png {the Animation button}"
macro.imageannotation = "\\inlineimage icons/annotation.png {the Annotation button}"
macro.imageapply = "\\inlineimage icons/apply.png {the Apply button}"
macro.imagearea = "\\inlineimage icons/area.png {the Area Light component}"
macro.imagearrowleft = "\\inlineimage icons/arrowleft.png {the Arrow left button}"
macro.imagearrowright = "\\inlineimage icons/arrowright.png {the Arrow right button}"
macro.imageassign = "\\inlineimage icons/assign.png {the Assign button}"
macro.imageassigneffectcomposer = "\\inlineimage icons/assign-effect-composer.png {the Assign current composition to selected item button}"
macro.imageattractor16px = "\\inlineimage icons/attractor-16px.png {the Attractor button}"
macro.imagebackoneframe = "\\inlineimage icons/back_one_frame.png {the Previous frame button}"
macro.imagebakelights = "\\inlineimage icons/bakelights.png {the Bake Lights button}"
macro.imageblenderlogo = "\\inlineimage blender-logo.png {the Blender logo}"
macro.imageblendmode16px = "\\inlineimage icons/blend-mode-16px.png {the Blend mode button}"
macro.imageborderimageicon16 = "\\inlineimage border-image-icon16.png {the Border Image component}"
macro.imageboundingrect = "\\inlineimage icons/boundingrect.png {the Bound button}"
macro.imagebrightnesscontrast16px = "\\inlineimage icons/brightness-contrast-16px.png {the Brightness Contrast component}"
macro.imagebrowsebutton = "\\inlineimage icons/browse-button.png {the Browse button}"
macro.imagebuild32x32 = "\\inlineimage icons/build-32x32.png {the Build icon}"
macro.imagebusyindicatoricon16 = "\\inlineimage icons/busyindicator-icon16.png {the Busy Indicator component}"
macro.imagebuttonicon16 = "\\inlineimage icons/button-icon16.png {the Button component}"
macro.imagecameraspeed = "\\inlineimage icons/camera_speed.png {the Camera speed button}"
macro.imagecanvascolor = "\\inlineimage icons/canvas-color.png {the Canvas color button}"
macro.imagecheckboxicon16 = "\\inlineimage icons/checkbox-icon16.png {the Checkbox component}"
macro.imageclearview = "\\inlineimage icons/clear-view.png {the Clear View button}"
macro.imageclose = "\\inlineimage icons/close.png {the Close button}"
macro.imagecolourize16px = "\\inlineimage icons/colourize-16px.png {the Colourize button}"
macro.imagecolumnpositionericon16px = "\\inlineimage column-positioner-icon-16px.png {the Column Positioner button}"
macro.imagecomboboxicon16 = "\\inlineimage icons/combobox-icon16.png {the Combo box component}"
macro.imagecopyformatting = "\\inlineimage icons/copy-formatting.png {the Copy Formatting button}"
macro.imagecreatecomponent = "\\inlineimage icons/create_component.png {the Create Component button}"
macro.imagecurveeditor = "\\inlineimage icons/curve_editor.png {the Curve editor button}"
macro.imagecustomborder16px = "\\inlineimage icons/custom-border-16px.png {the Border component}"
macro.imagecustomrectangle16px = "\\inlineimage icons/custom-rectangle-16px.png {the Rectangle component}"
macro.imagedelaybuttonicon16 = "\\inlineimage icons/delaybutton-icon16.png {the Delay button component}"
macro.imagedemo32x32 = "\\inlineimage icons/demo-32x32.png {the Demo icon}"
macro.imagedesaturation16px = "\\inlineimage icons/desaturation-16px.png {the Desaturation component}"
macro.imagedetachgroupicon = "\\inlineimage icons/detach-group-icon.png {the Detach Group button}"
macro.imagedialicon16 = "\\inlineimage icons/dial-icon16.png {the Dial component}"
macro.imagedirectional = "\\inlineimage icons/directional.png {the Directional light component}"
macro.imagedirectionalblur16px = "\\inlineimage icons/directional-blur-16px.png {the Directional blur component}"
macro.imagedisplace16px = "\\inlineimage icons/displace-16px.png {the Displace component}"
macro.imagedistributebottom = "\\inlineimage icons/distribute-bottom.png {the Distribute bottom button}"
macro.imagedistributecenterhorizontal = "\\inlineimage icons/distribute-center-horizontal.png {the Distribute horizontal center button}"
macro.imagedistributecentervertical = "\\inlineimage icons/distribute-center-vertical.png {the Distribute vertical center button}"
macro.imagedistributeleft = "\\inlineimage icons/distribute-left.png {the Distribute left button}"
macro.imagedistributeoriginbottomright = "\\inlineimage icons/distribute-origin-bottom-right.png {the Distribute origin bottom right button}"
macro.imagedistributeorigincenter = "\\inlineimage icons/distribute-origin-center.png {the Distribute origin center button}"
macro.imagedistributeoriginnone = "\\inlineimage icons/distribute-origin-none.png {the Distribute origin none button}"
macro.imagedistributeorigintopleft = "\\inlineimage icons/distribute-origin-top-left.png {the Distribute origin top left button}"
macro.imagedistributeright = "\\inlineimage icons/distribute-right.png {the Distribute right button}"
macro.imagedistributespacinghorizontal = "\\inlineimage icons/distribute-spacing-horizontal.png {the Distribute spacing horizontal button}"
macro.imagedistributespacingvertical = "\\inlineimage icons/distribute-spacing-vertical.png {the Distribute spacing vertical button}"
macro.imagedistributetop = "\\inlineimage icons/distribute-top.png {the Distribute top button}"
macro.imagedragmarkseffectcomposer = "\\inlineimage icons/dragmarks-effect-composer.png {Dragmarks}"
macro.imagedropshadow16px = "\\inlineimage icons/drop-shadow-16px.png {the Drop shadow component}"
macro.imageeasingcurvelinearicon = "\\inlineimage icons/easing-curve-linear-icon.png {the Linear easing curve button}"
macro.imageeasingcurvespline = "\\inlineimage icons/easing-curve-spline.png {the Spline easing curve button}"
macro.imageeasingcurvestepicon = "\\inlineimage icons/easing-curve-step-icon.png {the Step easing curve button}"
macro.imageeasingcurveunify = "\\inlineimage icons/easing-curve-unify.png {the Unify easing curve button}"
macro.imageedit = "\\inlineimage icons/edit.png {the Edit button}"
macro.imageeditcomponent = "\\inlineimage icons/edit_component.png {the Edit component button}"
macro.imageeditlightoff = "\\inlineimage icons/edit_light_off.png {the Edit light off button}"
macro.imageeditlighton = "\\inlineimage icons/edit_light_on.png {the Edit light on button}"
macro.imageemitburst16px = "\\inlineimage icons/emit-burst-16px.png {the Emit burst component}"
macro.imageemitter16px = "\\inlineimage icons/emitter-16px.png {the Emitter component}"
macro.imageerror = "\\inlineimage icons/error.png {the Error button}"
macro.imageexamples32x32 = "\\inlineimage icons/examples-32x32.png {the Examples icon}"
macro.imageexport = "\\inlineimage icons/export.png {the Export component}"
macro.imageexportjsontranslations = "\\inlineimage icons/export-json-translations.png {the Export JSON translations button}"
macro.imageexporttranslations = "\\inlineimage icons/export-translations.png {the Export translations button}"
macro.imageexportunchecked = "\\inlineimage icons/export_unchecked.png {the Export unchecked button}"
macro.imageeyeopen = "\\inlineimage icons/eye_open.png {the Eye button}"
macro.imagefastblur16px = "\\inlineimage icons/fast-blur-16px.png {the Fast blur component}"
macro.imagefigmabindingreset = "\\inlineimage figma-binding-reset.png {the Figma binding reset button}"
macro.imagefigmalogo = "\\inlineimage figma-logo.png {the Figma logo}"
macro.imagefiltericon = "\\inlineimage icons/filtericon.png {the Filter Tree button}"
macro.imagefitselected = "\\inlineimage icons/fit_selected.png {the Fit Selected button}"
macro.imageflickableicon16 = "\\inlineimage flickable-icon16.png {the Flickable component}"
macro.imageflowactionicon = "\\inlineimage icons/flow-action-icon.png {the Flow Action component}"
macro.imageflowdecisionicon = "\\inlineimage icons/flow-decision-icon.png {the Flow decision component}"
macro.imageflowpositionericon16px = "\\inlineimage flow-positioner-icon-16px.png {the Flow Positioner button}"
macro.imageflowwildcardicon = "\\inlineimage icons/flow-wildcard-icon.png {the Flow Wildcard component}"
macro.imagefocusscopeicon16 = "\\inlineimage focusscope-icon16.png {the Focus Scope component}"
macro.imageforwardoneframe = "\\inlineimage icons/forward_one_frame.png {the Next frame button}"
macro.imageframeicon16 = "\\inlineimage icons/frame-icon16.png {the Frame component}"
macro.imagegammaadjust16px = "\\inlineimage icons/gamma-adjust-16px.png {the Gamma adjust component}"
macro.imagegaussianblur16px = "\\inlineimage icons/gaussian-blur-16px.png {the Gaussian blur component}"
macro.imagegeneratetranslationfiles = "\\inlineimage icons/generate-translation-files.png {the Generate translation files button}"
macro.imagegettingstarted = "\\inlineimage icons/getting-started.png {the Getting Started icon}"
macro.imageglobal = "\\inlineimage icons/global.png {the Global orientation button}"
macro.imageglobalrecordkeyframes = "\\inlineimage icons/global_record_keyframes.png {the Record global keyframes button}"
macro.imageglow16px = "\\inlineimage icons/glow-16px.png {the Glow component}"
macro.imagegravity16px = "\\inlineimage icons/gravity-16px.png {the Gravity component}"
macro.imagegridpositionericon16px = "\\inlineimage grid-positioner-icon-16px.png {the Grid Positioner button}"
macro.imagegridviewicon16 = "\\inlineimage gridview-icon16.png {the Grid View component}"
macro.imagegroup16px = "\\inlineimage icons/group-16px.png {the Group component}"
macro.imagegroupboxicon16 = "\\inlineimage icons/groupbox-icon16.png {the Group box component}"
macro.imagehome = "\\inlineimage icons/home.png {the Home button}"
macro.imagehuesaturation16px = "\\inlineimage icons/hue-saturation-16px.png {the Hue saturation component}"
macro.imageimageicon16 = "\\inlineimage image-icon16.png {the Image component}"
macro.imageimport = "\\inlineimage icons/import.png {the Import button}"
macro.imageimportjsontranslations = "\\inlineimage icons/import-json-translations.png {the Import JSON translations button}"
macro.imageinnershadow16px = "\\inlineimage icons/inner-shadow-16px.png {the Inner shadow component}"
macro.imageinstallation = "\\inlineimage icons/installation.png {the Installation icon}"
macro.imageisoicons16px = "\\inlineimage icons/iso-icons-16px.png {the ISO Icon component}"
macro.imageitemarc16px = "\\inlineimage icons/item-arc-16px.png {the Arc component}"
macro.imageitemdelegateicon16 = "\\inlineimage icons/itemdelegate-icon16.png {the Item delegate component}"
macro.imageitemellipse16px = "\\inlineimage icons/item-ellipse-16px.png {the Ellipse component}"
macro.imageitemflippable16px = "\\inlineimage icons/item-flippable-16px.png {the Flipable component}"
macro.imageitempie16px = "\\inlineimage icons/item-pie-16px.png {the Pie component}"
macro.imageitempolygon16px = "\\inlineimage icons/item-polygon-16px.png {the Polygon component}"
macro.imageitemsvg16px = "\\inlineimage icons/item-svg-16px.png {the SVG path item component}"
macro.imageitemtriangle16px = "\\inlineimage icons/item-triangle-16px.png {the Triangle component}"
macro.imagejumptocode16px = "\\inlineimage icons/jump-to-code-16px.png {the Jump to code button}"
macro.imagekeyframe = "\\inlineimage icons/keyframe.png {the Keyframe marker}"
macro.imagekeyframeautobezieractive = "\\inlineimage icons/keyframe_autobezier_active.png {the Autobezier keyframe marker}"
macro.imagekeyframelinearactive = "\\inlineimage icons/keyframe_linear_active.png {the Linear keyframe marker}"
macro.imagekeyframelineartobezieractive = "\\inlineimage icons/keyframe_lineartobezier_active.png {the Linear to bezier keyframe marker}"
macro.imagekeyframemanualbezieractive = "\\inlineimage icons/keyframe_manualbezier_active.png {the Manual bezier keyframe marker}"
macro.imagelabelicon16 = "\\inlineimage icons/label-icon16.png {the Label component}"
macro.imagelcandoperator16px = "\\inlineimage icons/lc-and-operator-16px.png {the And component}"
macro.imagelcbidirectionalbinding16px = "\\inlineimage icons/lc-bidirectional-binding-16px.png {the Bi Direct. Binding component}"
macro.imagelcminmax16px = "\\inlineimage icons/lc-min-max-16px.png {the Min Max Mapper component}"
macro.imagelcnotoperator16px = "\\inlineimage icons/lc-not-operator-16px.png {the Not operator component}"
macro.imagelcoroperator16px = "\\inlineimage icons/lc-or-operator-16px.png {the Or operator component}"
macro.imagelcrangemapper16px = "\\inlineimage icons/lc-range-mapper-16px.png {the Range Mapper component}"
macro.imagelcstringmapper16px = "\\inlineimage icons/lc-string-mapper-16px.png {the String Mapper component}"
macro.imagelevels16px = "\\inlineimage icons/levels-16px.png {the Level Adjust component}"
macro.imagelineparticles16px = "\\inlineimage icons/line-particles-16px.png {the Line Particle component}"
macro.imagelistviewicon16 = "\\inlineimage listview-icon16.png {the List View component}"
macro.imagelivepreview = "\\inlineimage icons/live_preview.png {the Live Preview button}"
macro.imagelocalrecordkeyframes = "\\inlineimage icons/local_record_keyframes.png {the Record local keyframes button}"
macro.imagelockoff = "\\inlineimage icons/lockoff.png {the Lock off button}"
macro.imagelockon = "\\inlineimage icons/lockon.png {the Lock on button}"
macro.imagemaskblur16px = "\\inlineimage icons/mask-blur-16px.png {the Masked blur component}"
macro.imagemayalogo = "\\inlineimage maya-logo.png {the Maya logo}"
macro.imageminus = "\\inlineimage icons/minus.png {the Minus button}"
macro.imagemodelblendparticle16px = "\\inlineimage icons/model-blend-particle-16px.png {the Model Blend Particle component}"
macro.imagemodelparticle16px = "\\inlineimage icons/model-particle-16px.png {the Model Particle component}"
macro.imagemodelshape16px = "\\inlineimage icons/model-shape-16px.png {the Model Shape component}"
macro.imagemorebutton = "\\inlineimage icons/more-button.png {the More button}"
macro.imagemouseareaicon16 = "\\inlineimage mouse-area-icon16.png {the Mouse Area component}"
macro.imagemoveoff = "\\inlineimage icons/move_off.png {the Move button}"
macro.imagenavigatorarrowdown = "\\inlineimage icons/navigator-arrowdown.png {the Arrow down button}"
macro.imagenavigatorarrowup = "\\inlineimage icons/navigator-arrowup.png {the Arrow up button}"
macro.imagenext = "\\inlineimage icons/next.png {the Next button}"
macro.imagenextkeyframe = "\\inlineimage icons/next_keyframe.png {the Next Keyframe button}"
macro.imagenosnapping = "\\inlineimage icons/no_snapping.png {the No Snapping button}"
macro.imageopacitymask16px = "\\inlineimage icons/opacity-mask-16px.png {the Opacity Mask component}"
macro.imageorthographiccamera = "\\inlineimage icons/orthographic_camera.png {the Orthographic camera button}"
macro.imageoutput = "\\inlineimage icons/output.png {the Output button}"
macro.imagepageicon16 = "\\inlineimage icons/page-icon16.png {the Page component}"
macro.imagepageindicatoricon16 = "\\inlineimage icons/pageindicator-icon16.png {the Page Indicator component}"
macro.imagepaneicon16 = "\\inlineimage icons/pane-icon16.png {the Pane component}"
macro.imageparticleanimationoff = "\\inlineimage icons/particle-animation-off.png {the Particle animation off button}"
macro.imageparticleanimationon = "\\inlineimage icons/particle-animation-on.png {the Particle animation on button}"
macro.imageparticlepause = "\\inlineimage icons/particle-pause.png {the Pause button}"
macro.imageparticleplay = "\\inlineimage icons/particle-play.png {the Play button}"
macro.imageparticlerestart = "\\inlineimage icons/particle-restart.png {the Restart button}"
macro.imageparticleshape16px = "\\inlineimage icons/particle-shape-16px.png {the Particle Shape component}"
macro.imageparticlesseek = "\\inlineimage icons/particles-seek.png {the Particle Seek slider}"
macro.imageparticlesystem16px = "\\inlineimage icons/particle-system-16px.png {the Particle System component}"
macro.imagepasteformatting = "\\inlineimage icons/paste-formatting.png {the Paste Formatting button}"
macro.imagepathviewicon16 = "\\inlineimage pathview-icon16.png {the Path View component}"
macro.imagepathviewicon16 = "\\inlineimage pathview-icon16.png {the Path View component}"
macro.imagepathviewicon16 = "\\inlineimage pathview-icon16.png {the Path View component}"
macro.imagepauseicon = "\\inlineimage icons/pause-icon.png {the Pause button}"
macro.imageperspectivecamera = "\\inlineimage icons/perspective_camera.png {the Perspective camera button}"
macro.imagepin = "\\inlineimage icons/pin.png {the Pin button}"
macro.imageplus = "\\inlineimage icons/plus.png {the Plus button}"
macro.imagepoint = "\\inlineimage icons/point.png {the Point Light component}"
macro.imagepointrotator16px = "\\inlineimage icons/point-rotator-16px.png {the Point Rotator component}"
macro.imageprev = "\\inlineimage icons/prev.png {the Previous button}"
macro.imagepreviouskeyframe = "\\inlineimage icons/previous_keyframe.png {the Previous Keyframe button}"
macro.imageprogressbaricon16 = "\\inlineimage icons/progressbar-icon16.png {the Progress Bar component}"
macro.imageprojecttranslationtest = "\\inlineimage icons/project-translation-test.png {the Project Translation Test button}"
macro.imagepslogo = "\\inlineimage ps-logo.png {the PS logo}"
macro.imageqmldesigneronlyselectitemswithcontent = "\\inlineimage icons/qmldesigner-only-select-items-with-content.png {the Select Items with Content button}"
macro.imageqmltranslationtest = "\\inlineimage icons/qml-translation-test.png {the QML Translation Test button}"
macro.imageqt3dslogo = "\\inlineimage qt-3ds-logo.png {the Qt 3DS logo}"
macro.imageqtcreatoranchorsreseticon = "\\inlineimage icons/qtcreator-anchors-reset-icon.png {the Reset Anchors button}"
macro.imageqtcreatorresetpositionicon = "\\inlineimage icons/qtcreator-reset-position-icon.png {the Reset position button}"
macro.imageqtcreatorresetsizeicon = "\\inlineimage icons/qtcreator-reset-size-icon.png {the Reset size button}"
macro.imageradialblur16px = "\\inlineimage icons/radial-blur-16px.png {the Radial Blur component}"
macro.imageradiobuttonicon16 = "\\inlineimage icons/radiobutton-icon16.png {the Radio Button component}"
macro.imagerangeslidericon16 = "\\inlineimage icons/rangeslider-icon16.png {the Range Slider component}"
macro.imagerecordfill = "\\inlineimage icons/recordfill.png {the Record Fill button}"
macro.imagerecticon16 = "\\inlineimage rect-icon16.png {the Rectangle component}"
macro.imagerecursiveblur16px = "\\inlineimage icons/recursive-blur-16px.png {the Recursive Blur component}"
macro.imagerepeller16px = "\\inlineimage icons/repeller-16px.png {the Repeller component}"
macro.imagereset = "\\inlineimage icons/reset.png {the Reset button}"
macro.imagereverseorder = "\\inlineimage icons/reverse_order.png {the Reverse Order button}"
macro.imagerotateoff = "\\inlineimage icons/rotate_off.png {the Rotate button}"
macro.imagerotationcursor = "\\inlineimage icons/rotation-cursor.png {the rotation cursor}"
macro.imageroundbuttonicon16 = "\\inlineimage icons/roundbutton-icon16.png {the Round Button component}"
macro.imagerowpositionericon16px = "\\inlineimage row-positioner-icon-16px.png {the Row Positioner button}"
macro.imagerunproject = "\\inlineimage icons/run_project.png {the Run Project button}"
macro.imagerunsmall = "\\inlineimage icons/run_small.png {the Run button}"
macro.imagesaveaseffectcomposer = "\\inlineimage icons/save-as-effect-composer.png {the Save effect as button}"
macro.imagesaveeffectcomposer = "\\inlineimage icons/save-effect-composer.png {the Save effect button}"
macro.imagescaleaffector16px = "\\inlineimage icons/scale-affector-16px.png {the Scale Affector component}"
macro.imagescaleoff = "\\inlineimage icons/scale_off.png {the Scale button}"
macro.imagescrollviewicon16 = "\\inlineimage icons/scrollview-icon16.png {the Scroll View component}"
macro.imageselectgroup = "\\inlineimage icons/select_group.png {the Select Group button}"
macro.imageselectitem = "\\inlineimage icons/select_item.png {the Select Item button}"
macro.imageselectlanguages = "\\inlineimage icons/select-languages.png {the Select languages button}"
macro.imagesettings = "\\inlineimage icons/settings.png {the Settings button}"
macro.imagesketchlogo = "\\inlineimage sketch-logo.png {the Sketch logo}"
macro.imageslidericon16 = "\\inlineimage icons/slider-icon16.png {the Slider component}"
macro.imagesnapping = "\\inlineimage icons/snapping.png {the Snapping button}"
macro.imagesnapping3d = "\\inlineimage icons/snapping-3d.png {the 3D Snapping button}"
macro.imagesnapping3dconf = "\\inlineimage icons/snapping-3d-conf.png {the 3D Snap Configuration button}"
macro.imagesnappingandanchoring = "\\inlineimage icons/snapping_and_anchoring.png {the Snapping and Anchoring button}"
macro.imagespinboxicon16 = "\\inlineimage icons/spinbox-icon16.png {the Spin Box component}"
macro.imagesplitview = "\\inlineimage icons/split-view.png {the Split View button}"
macro.imagespot = "\\inlineimage icons/spot.png {the Spot Light component}"
macro.imagespriteparticle16px = "\\inlineimage icons/sprite-particle-16px.png {the Sprite Particle component}"
macro.imagespritesequence16px = "\\inlineimage icons/sprite-sequence-16px.png {the Sprite Sequence component}"
macro.imagestackviewicon16 = "\\inlineimage icons/stackview-icon16.png {the Stack View component}"
macro.imagestartplayback = "\\inlineimage icons/start_playback.png {the Start Playback button}"
macro.imagestudiocleareffectstack = "\\inlineimage icons/studio-clear-effect-stack.png {the Clear the Effect Stack button}"
macro.imageswipeviewicon16 = "\\inlineimage icons/swipeview-icon16.png {the Swipe View component}"
macro.imageswitchicon16 = "\\inlineimage icons/switch-icon16.png {the Switch component}"
macro.imagetargetdirection16px = "\\inlineimage icons/target-direction-16px.png {the Target Direction component}"
macro.imagetextareaicon16 = "\\inlineimage icons/textarea-icon16.png {the Text Area component}"
macro.imagetextediticon16 = "\\inlineimage text-edit-icon16.png {the Text Edit component}"
macro.imagetextfieldicon16 = "\\inlineimage icons/textfield-icon16.png {the Text Field component}"
macro.imagetexticon16 = "\\inlineimage text-icon16.png {the Text component}"
macro.imagetextinputicon16 = "\\inlineimage text-input-icon16.png {the Text Input component}"
macro.imagethreshold16px = "\\inlineimage icons/threshold-16px.png {the Threshold Mask component}"
macro.imagetofirstframe = "\\inlineimage icons/to_first_frame.png {the First frame button}"
macro.imagetolastframe = "\\inlineimage icons/to_last_frame.png {the Last frame button}"
macro.imagetoolbaricon16 = "\\inlineimage icons/toolbar-icon16.png {the Tool Bar component}"
macro.imagetoolbuttonicon16 = "\\inlineimage icons/toolbutton-icon16.png {the Tab Button component}"
macro.imagetoolseparatoricon16 = "\\inlineimage icons/toolseparator-icon16.png {the Tool Separator component}"
macro.imagetrailemitter16px = "\\inlineimage icons/trail-emitter-16px.png {the Trail Emitter component}"
macro.imagetransparent = "\\inlineimage icons/transparent.png {the Transparent button}"
macro.imagetransparenticon = "\\inlineimage icons/transparent-icon.png {the Transparent button}"
macro.imagetumblericon16 = "\\inlineimage icons/tumbler-icon16.png {the Tumbler component}"
macro.imagetutorials = "\\inlineimage icons/tutorials.png {the Tutorials icon}"
macro.imageunlocked = "\\inlineimage icons/unlocked.png {the Unlocked button}"
macro.imagevectordirection16px = "\\inlineimage icons/vector-direction-16px.png {the Vector Direction component}"
macro.imagevisibilityoff = "\\inlineimage icons/visibility-off.png {the Visibility off button}"
macro.imagevisibilityon = "\\inlineimage icons/visibilityon.png {the Visibility on button}"
macro.imagewander16px = "\\inlineimage icons/wander-16px.png {the Wander component}"
macro.imagewarning = "\\inlineimage icons/warning.png {the Warning button}"
macro.imagexdlogo = "\\inlineimage xd-logo.png {the Adobe XD logo}"
macro.imagezoomall = "\\inlineimage icons/zoomAll.png {the Zoom All button}"
macro.imagezoombig = "\\inlineimage icons/zoom_big.png {the Zoom Big button}"
macro.imagezoomblur16px = "\\inlineimage icons/zoom-blur-16px.png {the Zoom Blur component}"
macro.imagezoomin = "\\inlineimage icons/zoomIn.png {the Zoom In button}"
macro.imagezoomout = "\\inlineimage icons/zoomOut.png {the Zoom Out button}"
macro.imagezoomselection = "\\inlineimage icons/zoomSelection.png {the Zoom Selection button}"
macro.imagezoomsmall = "\\inlineimage icons/zoom_small.png {the Zoom Small button}"

238
doc/qtdesignstudio/config/style/qt5-sidebar.html
View File

@@ -1,34 +1,34 @@
<div class="sectionlist normallist">
<ul>
<li><a href="qtdesignstudio-toc.html">View All Topics</a></li>
<li><a href="qtdesignstudio-toc.html">View All topics</a></li>
</ul>
</div>
<div class="sectionlist normallist">
<ul>
<li><a href="whats-new.html">What's New in Qt Design Studio</a></li>
<li><a href="whats-new.html">What's new in Qt Design Studio</a></li>
</ul>
</div>
<div class="sectionlist normallist">
<div class="heading">
<h2>Getting Started</h2>
<h2>Getting started</h2>
</div>
<ul>
<li><a href="studio-getting-started.html">Overview</a></li>
<li><a href="studio-installation.html">Installing Qt Design Studio</a></li>
<li><a href="studio-projects.html">Creating Projects</a></li>
<li><a href="creator-quick-tour.html">User Interface</a></li>
<li><a href="studio-projects.html">Creating projects</a></li>
<li><a href="creator-quick-tour.html">User interface</a></li>
</ul>
</div>
<div class="sectionlist normallist">
<div class="heading">
<h2>Key Concepts</h2>
<h2>Key concepts</h2>
</div>
<ul>
<li><a href="quick-animation-overview.html">Animation Techniques</a></li>
<li><a href="studio-exporting-and-importing.html">Creating Assets with Other Tools</a></li>
<li><a href="qtquick-creating-ui-logic.html">Creating UI Logic</a></li>
<li><a href="quick-animation-overview.html">Animation techniques</a></li>
<li><a href="studio-exporting-and-importing.html">Creating assets with other tools</a></li>
<li><a href="qtquick-creating-ui-logic.html">Creating UI logic</a></li>
<li><a href="quick-components.html">Components</a></li>
<li><a href="studio-designer-developer-workflow.html">Designer-Developer Workflow</a></li>
<li><a href="studio-designer-developer-workflow.html">Designer-developer workflow</a></li>
<li><a href="studio-on-mcus.html">Qt Design Studio on MCUs</a></li>
</ul>
</div>
@@ -38,30 +38,30 @@
<h2>Working with</h2>
</div>
<ul>
<li><a>2D Assets</a>
<li><a>2D assets</a>
<ul>
<li><a href="qtbridge-ai.html">Adobe Illustrator Assets</a></li>
<li><a href="psqtbridge.html">Adobe Photoshop Assets</a></li>
<li><a href="xdqtbridge.html">Adobe XD Assets</a></li>
<li><a href="figmaqtbridge.html">Figma Assets</a></li>
<li><a href="qtbridge-figma-template.html">Figma Bridge Template</a></li>
<li><a href="qtbridge-ai.html">Adobe Illustrator assets</a></li>
<li><a href="psqtbridge.html">Adobe Photoshop assets</a></li>
<li><a href="xdqtbridge.html">Adobe XD assets</a></li>
<li><a href="figmaqtbridge.html">Figma assets</a></li>
<li><a href="qtbridge-figma-template.html">Figma Bridge template</a></li>
<li><a href="quick-images.html">Images</a></li>
<li><a href="studio-importing-2d.html">Importing 2D Assets</a></li>
<li><a href="sketchqtbridge.html">Sketch Assets</a></li>
<li><a href="studio-importing-2d.html">Importing 2D assets</a></li>
<li><a href="sketchqtbridge.html">Sketch assets</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>3D Assets</a>
<ul>
<li><a href="exporting-3d-assets.html">Exporting 3D Assets</a></li>
<li><a href="exporting-3d-assets.html">Exporting 3D assets</a></li>
<li><a href="exporting-from-blender.html">Exporting from Blender</a></li>
<li><a href="exporting-from-maya.html">Exporting from Maya</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>3D Scenes</a>
<li><a>3D scenes</a>
<ul>
<li><a href="studio-3d-camera.html">Cameras</a></li>
<li><a href="studio-3d-lights.html">Lights</a></li>
@@ -72,12 +72,12 @@
<ul>
<li><a>Animations</a>
<ul>
<li><a href="studio-timeline.html">Creating Timeline Animations</a></li>
<li><a href="qtquick-editing-easing-curves.html">Editing Easing Curves</a></li>
<li><a href="studio-3d-morph-target.html">Morph Animations</a></li>
<li><a href="studio-skeletal-components.html">Skeletal Animations</a></li>
<li><a href="qtquick-transition-editor.html#animating-transitions-between-states">Transitions between States</a></li>
<li><a href="qtquick-curve-editor.html#editing-animation-curves">Editing Animation Curves</a></li>
<li><a href="studio-timeline.html">Creating timeline animations</a></li>
<li><a href="qtquick-editing-easing-curves.html">Editing easing curves</a></li>
<li><a href="studio-3d-morph-target.html">Morph animations</a></li>
<li><a href="studio-skeletal-components.html">Skeletal animation</a></li>
<li><a href="qtquick-transition-editor.html#animating-transitions-between-states">Transitions between states</a></li>
<li><a href="qtquick-curve-editor.html#editing-animation-curves">Editing animation curves</a></li>
</ul>
</li>
</ul>
@@ -85,7 +85,7 @@
<li><a>Code</a>
<ul>
<li><a href="qtquick-text-editor.html">Code</a></li>
<li><a href="creator-jump-to-the-code.html">Jump to Code</a></li>
<li><a href="creator-jump-to-the-code.html">Jump to the Code</a></li>
</ul>
</li>
</ul>
@@ -93,38 +93,38 @@
<li><a>Components</a>
<ul>
<li><a href="quick-components.html">Overview</a></li>
<li><a href="qtquick-annotations.html">Annotating Designs</a></li>
<li><a href="quick-components-view.html#adding-and-removing-modules">Adding and Removing Modules</a></li>
<li><a href="quick-component-instances.html">Creating Component Instances</a></li>
<li><a href="quick-components-creating.html">Creating Custom Components</a></li>
<li><a href="studio-3d-group.html">Grouping Components</a></li>
<li><a href="qtquick-properties.html">Specifying Component Properties</a></li>
<li><a href="quick-dynamic-properties.html">Specifying Custom Properties</a></li>
<li><a href="qtquick-annotations.html">Annotating designs</a></li>
<li><a href="quick-components-view.html#adding-and-removing-modules">Adding and removing modules</a></li>
<li><a href="quick-component-instances.html">Creating component instances</a></li>
<li><a href="quick-components-creating.html">Creating custom components</a></li>
<li><a href="studio-3d-group.html">Grouping components</a></li>
<li><a href="qtquick-properties.html">Specifying component properties</a></li>
<li><a href="quick-dynamic-properties.html">Specifying custom properties</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Connections</a>
<ul>
<li><a href="quick-property-bindings.html">Adding Bindings Between Properties</a></li>
<li><a href="quick-signals.html">Connecting Components to Signals</a></li>
<li><a href="quick-property-bindings.html">Adding bindings between properties</a></li>
<li><a href="quick-signals.html">Connecting components to signals</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Data</a>
<ul>
<li><a href="studio-model-editor.html">Data Models</a></li>
<li><a href="quick-data-models.html">Lists and Other Data Models</a></li>
<li><a href="qtquick-placeholder-data.html">Loading Placeholder Data</a></li>
<li><a href="studio-javascript.html">Simulating Application Logic</a></li>
<li><a href="studio-simulink.html">Simulating Dynamic Systems</a></li>
<li><a href="quick-data-models.html">Lists and other data models</a></li>
<li><a href="qtquick-placeholder-data.html">Loading placeholder data</a></li>
<li><a href="studio-javascript.html">Simulating application logic</a></li>
<li><a href="studio-simulink.html">Simulating dynamic systems</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Debugging and Profiling</a>
<li><a>Debugging and profiling</a>
<ul>
<li><a href="studio-accessing-output-issues-and-warnings.html">Accessing output, issue, and warning messages</a></li>
<li><a href="creator-qml-debugging-example.html">Debugging Qt Quick Applications</a></li>
<li><a href="creator-debugging-qml.html">Debugging Qt Quick Projects</a></li>
<li><a href="creator-qml-performance-monitor.html">Profiling QML Applications</a></li>
@@ -135,21 +135,20 @@
<li><a>Effects</a>
<ul>
<li><a href="working-with-effects.html">Overview</a></li>
<li><a href="quick-2d-effects.html">2D Effects</a></li>
<li><a href="studio-3d-effects.html">3D Effects</a></li>
<li><a href="studio-3d-custom-effects-materials.html">Custom Effects and Materials</a></li>
<li><a href="quick-2d-effects.html">2D effects</a></li>
<li><a href="studio-3d-effects.html">3D effects</a></li>
<li><a href="studio-3d-custom-effects-materials.html">Custom effects in Qt 5</a></li>
<li><a href="quick-design-effects.html">Design Effects</a></li>
<li><a href="qtquick-effect-composer-view.html">Effect Composer</a></li>
<li><a href="studio-3d-particles.html">Particles</a></li>
<li><a href="studio-content-library.html#adding-an-effect-to-your-project">Using Content Library Effects</a></li>
<li><a href="qt-using-effect-maker-effects.html">Using Qt Quick Effect Maker Effects</a></li>
<li><a href="studio-content-library.html#adding-an-effect-to-your-project">Using the Content Library effects</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>External Tools</a>
<li><a>External tools</a>
<ul>
<li><a href="creator-editor-external.html">Using External Tools</a></li>
<li><a href="creator-editor-external.html">Using external tools</a></li>
</ul>
</li>
</ul>
@@ -170,43 +169,43 @@
<ul>
<li><a>Layouts</a>
<ul>
<li><a href="qtquick-positioning.html">Scalable Layouts</a></li>
<li><a href="qtquick-positioning.html">Scalable layouts</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Logical Helpers</a>
<li><a>Logical helpers</a>
<ul>
<li><a href="quick-logic-helpers.html">Logical Helpers</a></li>
<li><a href="quick-logic-helpers.html">Logical helpers</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Materials</a>
<ul>
<li><a href="studio-3d-custom-effects-materials.html">Custom Effects and Materials</a></li>
<li><a href="studio-material-editor.html">Materials</a></li>
<li><a href="studio-3d-materials.html">Materials and Shaders</a></li>
<li><a href="studio-content-library.html#adding-a-material-to-your-project">Using Content Library Materials</a></li>
<li><a href="studio-3d-materials.html">Materials and shaders</a></li>
<li><a href="studio-content-library.html#adding-a-material-to-your-project">Using the Content Library materials</a></li>
<li><a href="studio-3d-custom-effects-materials.html">Custom materials in Qt 5</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Previewing</a>
<ul>
<li><a href="studio-live-preview-desktop.html">Previewing on Desktop</a></li>
<li><a href="creator-live-preview-devices.html">Previewing on Devices</a></li>
<li><a href="qt-design-viewer.html">Sharing Applications Online</a></li>
<li><a href="qt-ui-viewer.html">Viewing Applications on Android</a></li>
<li><a href="studio-live-preview-desktop.html">Previewing on desktop</a></li>
<li><a href="creator-live-preview-devices.html">Previewing on devices</a></li>
<li><a href="qt-design-viewer.html">Sharing applications online</a></li>
<li><a href="qt-ui-viewer.html">Viewing applications on Android</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Projects</a>
<ul>
<li><a href="studio-projects.html">Creating Projects</a></li>
<li><a href="studio-designer-developer-workflow.html">Designer-Developer Workflow</a></li>
<li><a href="studio-packaging.html">Packaging Applications</a></li>
<li><a href="studio-projects.html">Creating projects</a></li>
<li><a href="studio-designer-developer-workflow.html">Designer-developer workflow</a></li>
<li><a href="studio-packaging.html">Packaging applications</a></li>
</ul>
</li>
</ul>
@@ -215,25 +214,25 @@
<ul>
<li><a href="studio-on-mcus.html">Overview</li>
<li><a href="studio-connecting-mcus-with-creator.html">Connecting MCUs with Qt Creator</a></li>
<li><a href="studio-projects-for-mcus.html">Creating Projects for MCUs</a></li>
<li><a href="studio-projects-for-mcus.html">Creating projects for MCUs</a></li>
<li><a href="studio-creating-uis-for-mcus.html">Creating UIs for MCUs</a></li>
<li><a href="studio-developing-apps-for-mcus.html">Developing Applications for MCUs</a></li>
<li><a href="studio-developing-apps-for-mcus.html">Developing applications for MCUs</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Rendering</a>
<ul>
<li><a href="studio-3d-instancing.html">Instanced Rendering</a></li>
<li><a href="studio-3d-repeater-3d.html">The Repeater3D Component</a></li>
<li><a href="studio-3d-loader-3d.html">The Loader3D Component</a></li>
<li><a href="studio-3d-instancing.html">Instanced rendering</a></li>
<li><a href="studio-3d-repeater-3d.html">The Repeater3D component</a></li>
<li><a href="studio-3d-loader-3d.html">The Loader3D component</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Shaders</a>
<ul>
<li><a href="studio-3d-custom-shaders.html">Custom Shaders</a></li>
<li><a href="studio-3d-custom-shaders.html">Custom shaders</a></li>
</ul>
</li>
</ul>
@@ -241,7 +240,7 @@
<li><a>States</a>
<ul>
<li><a href="quick-states.html">States</li>
<li><a href="qtquick-transition-editor.html#animating-transitions-between-states">Transition between states</a></li>
<li><a href="qtquick-transition-editor.html#animating-transitions-between-states">Transitions between states</a></li>
</ul>
</li>
</ul>
@@ -249,34 +248,34 @@
<li><a>Textures</a>
<ul>
<li><a href="studio-texture-editor.html">Textures</a></li>
<li><a href="studio-3d-texture.html">The Texture Component</a></li>
<li><a href="studio-content-library.html#adding-a-texture-or-environment-to-your-project">Using Content Library Textures</a></li>
<li><a href="studio-3d-texture.html">The Texture component</a></li>
<li><a href="studio-content-library.html#adding-a-texture-or-environment-to-your-project">Using Content Library textures</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>UI Controls and Elements</a>
<li><a>UI controls and elements</a>
<ul>
<li><a href="quick-shapes.html">Shapes</a></li>
<li><a href="quick-text.html">Text</a></li>
<li><a href="quick-controls.html">UI Controls</a></li>
<li><a href="quick-controls.html">UI controls</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>User Data</a>
<ul>
<li><a href="collecting-usage-statistics.html">Collecting Usage Statistics</a></li>
<li><a href="studio-user-feedback.html">Collecting User Feedback</a></li>
<li><a href="creator-telemetry.html">Managing Data Collection</a></li>
<li><a href="studio-crashpad.html">Reporting Crashes</a></li>
<li><a href="studio-collecting-usage-statistics.html">Collecting usage statistics</a></li>
<li><a href="studio-user-feedback.html">Collecting user feedback</a></li>
<li><a href="studio-telemetry.html">Managing data collection</a></li>
<li><a href="studio-crashpad.html">Reporting crashes</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>User Interaction</a>
<ul>
<li><a href="quick-user-interaction-methods.html">User Interaction Methods</a></li>
<li><a href="quick-user-interaction-methods.html">User interaction methods</a></li>
</ul>
</li>
</ul>
@@ -284,29 +283,21 @@
<div class="sectionlist normallist">
<div class="heading">
<h2>Best Practices</h2>
<h2>Best practices</h2>
</div>
<ul>
<li><a>Graphics</a>
<ul>
<li><a href="best-practices-glow.html">Creating Glow and Bloom Effects</a></li>
<li><a href="best-practices-glow.html">Creating the glow and the bloom effects</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Performance</a>
<ul>
<li><a href="studio-optimized-3d-scenes.html">Creating an Optimized 3D Scenes</a></li>
<li><a href="qtquick-optimizing-designs.html">Optimizing Designs</a></li>
<li><a href="qtquick-production-quality-animation.html">Production Quality</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Projects</a>
<ul>
<li><a href="studio-porting-projects.html">Converting Qt 5 Projects into Qt 6 Projects</a></li>
<li><a href="quick-converting-ui-projects.html">Converting UI Projects to Applications</a></li>
<li><a href="studio-optimized-3d-scenes.html">Creating optimized 3D scenes</a></li>
<li><a href="qtquick-optimizing-designs.html">Optimizing designs</a></li>
<li><a href="qtquick-production-quality-animation.html">Production quality</a></li>
</ul>
</li>
</ul>
@@ -318,17 +309,17 @@
</div>
<ul>
<li><a href="gstutorials.html">Overview</a></li>
<li><a href="multilanguage-tutorial.html">Adding Multi-lanugage support to Your Project</a></li>
<li><a href="state-transition-animations.html">Animated State Transitions</a></li>
<li><a href="robotarm-example.html">Creating a C++ Backend for a Qt Design Studio Application</a></li>
<li><a href="qtdesignstudio-loginui1-example.html">Log In UI - Components</a></li>
<li><a href="qtdesignstudio-loginui2-example.html">Log In UI - Positioning</a></li>
<li><a href="qtdesignstudio-loginui3-example.html">Log In UI - States</a></li>
<li><a href="qtdesignstudio-loginui4-example.html">Log In UI - Timeline</a></li>
<li><a href="fire-particle-effect.html">Particle System: Fire Effect</a></li>
<li><a href="rain-snow-particle-effect.html">Particle System: Rain and Snow Effect</a></li>
<li><a href="3d-scene-tutorial.html">Setting up a 3D Scene</a></li>
<li><a href="animation-tutorial.html">Timeline Animation Tutorial</a></li>
<li><a href="multilanguage-tutorial.html">Adding multi-language support to your project</a></li>
<li><a href="state-transition-animations.html">Animated state transitions</a></li>
<li><a href="robotarm-example.html">Creating a C++ backend for a Qt Design Studio application</a></li>
<li><a href="qtdesignstudio-loginui1-example.html">Login UI: Components</a></li>
<li><a href="qtdesignstudio-loginui2-example.html">Login UI: Positioning</a></li>
<li><a href="qtdesignstudio-loginui3-example.html">Login UI: States</a></li>
<li><a href="qtdesignstudio-loginui4-example.html">Login UI: Timeline</a></li>
<li><a href="fire-particle-effect.html">Particle System: The fire effect</a></li>
<li><a href="rain-snow-particle-effect.html">Particle System: The rain and the snow effects</a></li>
<li><a href="3d-scene-tutorial.html">Setting up a 3D scene</a></li>
<li><a href="animation-tutorial.html">Timeline animation</a></li>
</ul>
</div>
@@ -339,14 +330,15 @@
<ul>
<li><a href="studioexamples.html">Overview</a></li>
<li><a href="qtdesignstudio-coffeemachine-example.html">Coffee Machine</a></li>
<li><a href="design-effect-example.html">Design Effects Demo</a></li>
<li><a href="qtdesignstudio-ebikedesign-example.html">E-Bike Design</a></li>
<li><a href="effect-composer-example.html">Effect Composer Example</a></li>
<li><a href="fresnel-effect-example.html">Fresnel Example</a></li>
<li><a href="material-bundle-example.html">Material Bundle</a></li>
<li><a href="qtdesignstudio-optimal3dscene-example.html">Optimal 3D Scene</a></li>
<li><a href="qtdesignstudio-progressbar-example.html">Progress Bar</a></li>
<li><a href="qtdesignstudio-sidemenu-example.html">Side Menu</a></li>
<li><a href="qtdesignstudio-simplekeyboard-example.html">Simple Keyboard</a></li>
<li><a href="qtdesignstudio-simplekeyboard-example.html">Simple keyboard</a></li>
<li><a href="effect-composer-example.html">The Effect Composer example</a></li>
<li><a href="fresnel-effect-example.html">Fresnel properties on materials</a></li>
<li><a href="qtdesignstudio-washingmachineui-example.html">Washing Machine UI</a></li>
<li><a href="qtdesignstudio-webinardemo-example.html">Webinar Demo</a></li>
</ul>
@@ -357,36 +349,36 @@
<h2>Reference</h2>
</div>
<ul>
<li><a>2D Components</a>
<li><a>The 2D components</a>
<ul>
<li><a href="quick-preset-components.html#2d-components">Overview</a></li>
<li><a href="quick-animations.html">Animations</a></li>
<li><a href="quick-design-effects.html">Design Effects</a></li>
<li><a href="quick-2d-effects.html">Effects</a></li>
<li><a href="quick-images.html">Images</a></li>
<li><a href="quick-data-models.html">Lists and Other Data Models</a></li>
<li><a href="quick-logic-helpers.html">Logical Helpers</a></li>
<li><a href="quick-data-models.html">Lists and other data models</a></li>
<li><a href="quick-logic-helpers.html">Logical helpers</a></li>
<li><a href="quick-shapes.html">Shapes</a></li>
<li><a href="quick-text.html">Text</a></li>
<li><a href="quick-user-interaction-methods.html">User Interaction Methods</a></li>
<li><a href="quick-controls.html">UI Controls</a></li>
<li><a href="quick-user-interaction-methods.html">User interaction methods</a></li>
<li><a href="quick-controls.html">UI controls</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>3D Components</a>
<li><a>3D components</a>
<ul>
<li><a href="quick-preset-components.html#3d-components">Overview</a></li>
<li><a href="studio-3d-camera.html">Cameras</a></li>
<li><a href="studio-3d-custom-effects-materials.html">Custom Effects and Materials</a></li>
<li><a href="studio-3d-custom-shaders.html">Custom Shaders</a></li>
<li><a href="studio-3d-custom-effects-materials.html">Custom effects and materials in Qt 5</a></li>
<li><a href="studio-3d-custom-shaders.html">Custom shaders</a></li>
<li><a href="studio-3d-effects.html">Effects</a></li>
<li><a href="studio-3d-group.html">Group</a></li>
<li><a href="studio-3d-instancing.html">Instanced Rendering</a></li>
<li><a href="studio-3d-instancing.html">Instanced rendering</a></li>
<li><a href="studio-3d-lights.html">Lights</a></li>
<li><a href="studio-3d-loader-3d.html">Loader3D</a></li>
<li><a href="studio-3d-materials-types.html">Materials</a></li>
<li><a href="studio-3d-materials.html">Materials and Shaders</a></li>
<li><a href="studio-3d-materials.html">Materials and shaders</a></li>
<li><a href="studio-3d-model.html">Models</a></li>
<li><a href="studio-3d-morph-target.html">Morph Target</a></li>
<li><a href="studio-3d-view.html">Views</a></li>
@@ -394,7 +386,7 @@
<li><a href="studio-3d-particles.html">Particles</a></li>
<li><a href="studio-3d-repeater-3d.html">Repeater3D</a></li>
<li><a href="studio-3d-scene-environment.html">Scene Environments</a></li>
<li><a href="studio-skeletal-components.html">Skeletal Animation</a></li>
<li><a href="studio-skeletal-components.html">Skeletal animation</a></li>
<li><a href="studio-3d-texture.html">Textures</a></li>
</ul>
</li>
@@ -402,25 +394,25 @@
<ul>
<li><a>Files</a>
<ul>
<li><a href="creator-quick-ui-forms.html">UI Files</a></li>
<li><a href="creator-quick-ui-forms.html">UI files</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Help</a>
<ul>
<li><a href="studio-terms.html">Concept and Terms</a></li>
<li><a href="studio-keyboard-shortcuts.html">Keyboard Shortcuts</a></li>
<li><a href="creator-how-to-get-help.html">Getting Help</a></li>
<li><a href="studio-platforms.html">Supported Platforms</a></li>
<li><a href="studio-terms.html">Concepts and terms</a></li>
<li><a href="studio-keyboard-shortcuts.html">Keyboard shortcuts</a></li>
<li><a href="creator-how-to-get-help.html">Getting help</a></li>
<li><a href="studio-platforms.html">Supported platforms</a></li>
</ul>
</li>
</ul>
<ul>
<li><a>Qt Design Studio on MCUs</a>
<ul>
<li><a href="studio-features-on-mcu-projects.html">Supported Features</a></li>
<li><a href="studio-compatibility-with-mcu-sdks.html">Version Compatibility</a></li>
<li><a href="studio-features-on-mcu-projects.html">Supported features</a></li>
<li><a href="studio-compatibility-with-mcu-sdks.html">Version compatibility</a></li>
</ul>
</li>
</ul>

27
doc/qtdesignstudio/examples/doc/3DsceneTutorial.qdoc
View File

@@ -1,18 +1,18 @@
// Copyright (C) 2023 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
\page 3d-scene-tutorial.html
\ingroup gstutorials
\title Setting up a 3D Scene
\title Setting up a 3D scene
\sa {Content Library}
\brief Illustrates how to set up a 3D scene with, for example, lights, models, and materials in
\QDS.
\image 3d-scene-tutorial.webp
The \e {Setting up a 3D Scene} tutorial illustrates how you can set up and improve a 3D
The \e {Setting up a 3D scene} tutorial illustrates how you can set up and improve a 3D
scene with the following:
\list
\li 3D models
@@ -30,10 +30,9 @@
Download the completed project from
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/3Dscene%20tutorial/Completed/}{here}.
This tutorial requires that you know the basics of \QDS, see
\l{Getting Started}.
To learn the basics of \QDS required to complete this tutorial, see \l{Getting started}.
\section1 The Starting Project
\section1 The starting project
The starting project consists of an animated 3D model of a ball bearing. Control the animations
with a slider and a switch in the user interface.
@@ -43,9 +42,9 @@
\include run-tutorial-project.qdocinc
\section1 Adding Materials to the 3D Models
\section1 Adding materials to the 3D models
First, use materials from the \uicontrol {Content Library} view on the ball bearing.
First, use materials from the \uicontrol {Content Library} view on the ball bearing:
\list 1
\li In the \uicontrol 3D view, right-click the ball bearing and select
@@ -70,10 +69,12 @@
When you run the application or live preview, notice that you don't see much of the materials.
The next step is to set up the environmental light.
\section1 Adding Environmental Lighting to the Scene
\section1 Adding environmental lighting to the scene
Environmental lighting is a good way to create a realistic light for your scene.
To add environmental lighting:
\list 1
\li In the \uicontrol {Content Library} view, go to the \uicontrol Environments tab.
\li Right-click the image \e BasicLights3_4k.hdr and select \uicontrol {Add Light Probe}.
@@ -85,8 +86,8 @@
When you run the application, notice an improvement in the scene lighting.
Next, adjust the environmental light. As you will add a background image to the scene later,
you don't want to use the skybox.
As you will add a background image to the scene later, you need to disable the use of skybox:
\list 1
\li In the \uicontrol Navigator view, select \e sceneEnvironment.
\li Go to the \uicontrol {Scene Environment} tab in \uicontrol Properties and set \uicontrol
@@ -96,9 +97,9 @@
You also want to increase the brightness of the light a bit. Go to the \uicontrol {Image Based
Lighting} tab in \uicontrol Properties and set \uicontrol Exposure to \e 10.
\section2 Adding a Background Image to the Scene
\section2 Adding a background image to the scene
In the final step of this tutorial, you add a background image to your scene.
In the final step of this tutorial, you add a background image to your scene:
\list 1
\li Go to the \uicontrol Textures tab in the \uicontrol {Content Library} view.

21
doc/qtdesignstudio/examples/doc/DesignEffect.qdoc
View File

@@ -5,12 +5,12 @@
\page design-effect-example.html
\ingroup studioexamples
\title Design Effect
\brief Illustrates how to use the \QDS design effect.
\title Design Effects Demo
\brief Illustrates how to use the \QDS Design Effects.
\image studio-design-effects-demo-gallery.webp
The \e{Design Effects Demo Gallery} example illustrates the use cases of the
The \e{Design Effects Demo} example illustrates various use cases of the
design effects in \QDS. Learn more about design effects
\l {https://doc.qt.io/qtdesignstudio/quick-design-effects.html}{here}.
@@ -18,7 +18,7 @@
principles:
\table
\header
\li Design Effect
\li Design effect
\li Description
\row
\li Neumorphism
@@ -39,7 +39,7 @@
Watch this video tutorial to learn how to create these effects using \QDS design effects:
\youtube h0p27_HScxc
\section1 Using Neumorphism Example
\section1 Using the Neumorphism example
\image studio-neumorphism.webp
@@ -57,7 +57,7 @@
accurately they translate into \QDS design effects.
The animation gives a real-time animated Neumorphism design effect in \QDS.
\section1 Using Skeuomorphism Example
\section1 Using the Skeuomorphism example
\image studio-skeuomorphism.webp
@@ -79,7 +79,7 @@
these buttons to test different stages of the Skeuomorphism effect.
\section1 Using Glassmorphism Example
\section1 Using the Glassmorphism example
\image studio-glassmorphism.webp
@@ -97,7 +97,7 @@
part of the image hidden behind it would become blurred.
\endlist
\section1 Using the Design Effect Demo Project
\section1 Using the Design Effect Demo project
\image studio-design-effects-demo-project.webp
@@ -114,7 +114,7 @@
To change the theme of the calculator between light and dark, select \uicontrol DARK.
\section2 Using Shadow or Blur Effects
\section2 Using shadow or blur effects
To change the direction of the shadows on the calculator, drag \uicontrol {SHADOW DIR}
up or down.
@@ -127,8 +127,7 @@
To turn the design effects on or off in the calculator, select \uicontrol FX.
\section2 Using Music or Sound Effects
\section2 Using music or sound effects
To play sound or music in the calculator:
\list
\li To play music in a loop, select \uicontrol CHRD, \uicontrol TECH, or

30
doc/qtdesignstudio/examples/doc/FireParticles.qdoc
View File

@@ -1,4 +1,4 @@
// Copyright (C) 2022 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
@@ -6,13 +6,14 @@
\ingroup gstutorials
\sa Particles
\title Particle System: Fire Effect
\title Particle System: The fire effect
\brief Illustrates how to create a fire effect with the \QDS
particle system.
\image fire-particles.png
The \e{Fire Effect} tutorial illustrates how you can add a fire effect to
\e{The fire effect} tutorial illustrates how you can add a fire effect to
your scene using the \QDS particle system.
In this tutorial, you create a project from the beginning. You can download
@@ -20,10 +21,9 @@
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/fire-particles}
{here}.
This tutorial requires that you know the basics of \QDS, see
\l{Getting Started}.
To learn the basics of \QDS required to complete this tutorial, see \l{Getting Started}.
\section1 Tutorial Assets
\section1 Tutorial assets
You need the following assets to complete this tutorial:
\list
@@ -35,9 +35,9 @@
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/fire-particles/FireParticles/content/images}
{here}.
\section1 Creating a Fire Effect
\section1 Creating a fire effect
\section2 Creating a Project
\section2 Creating a project
To create a new project:
@@ -67,13 +67,13 @@
\uicontrol {Properties}, set \uicontrol {Fill Color} to #000000.
\endlist
\section2 Adding a Particle System to Your Scene
\section2 Adding a Particle System to your scene
To add a particle system, you first need to import the QtQuick3D.Particles3D
module to your project:
\list 1
\li In the \uicontrol Components view, select \inlineimage icons/plus.png
\li In the \uicontrol Components view, select \imageplus
.
\li Find QtQuick3D.Particles3D, and select it to add it to your project.
\endlist
@@ -95,7 +95,7 @@
You now have the particle system in place. To preview it, select
\key Alt + \key{P}. You can also preview the particle system in
the \uicontrol{3D} view by using the \l {Particle Editor} tools.
the \uicontrol{3D} view by using the \l {Particle editor} tools.
\section2 Adding Sprites and Sprite Animations
@@ -108,7 +108,7 @@
(\e{fire-sprites.png}) to use for the fire:
\list 1
\li In the \uicontrol {Assets} view, select \inlineimage icons/plus.png
\li In the \uicontrol {Assets} view, select \imageplus
.
\li In the \uicontrol {Add Assets} dialog, find and select \e {fire-sprites.png}.
\endlist
@@ -166,7 +166,7 @@
\image fire-particles-sprite-textures.png
\section2 Adjusting the Particle Emitter
\section2 Adjusting the particle emitter
The next step is to adjust the particle emitter properties:
@@ -218,7 +218,7 @@
\endlist
\section1 Running the Project
\section1 Running the project
Now, the fire effect is ready. Before you run it, position the camera to show the effect
from a suitable perspective:
@@ -235,7 +235,7 @@
\image fire-particles-camera.png
Now, run the project by selecting \key Ctrl + \key{R} or the
\inlineimage icons/run_project.png
\imagerunproject
button in the top toolbar.
*/

107
doc/qtdesignstudio/examples/doc/FresnelExample.qdoc
View File

@@ -5,39 +5,81 @@
\page fresnel-effect-example.html
\ingroup studioexamples
\title Fresnel Example
\brief Illustrates how to work with the fresnel effect.
\title Fresnel properties on materials
\brief Illustrates how to work with Fresnel.
\sa {Material Editor and Browser}, {Setting image-based lighting}, {Directional Light},
{3D models}, {Content Library}
\image fresnel-example.webp
The \e{Fresnel} example illustrates how to add and adjust a fresnel effect on
a 3D model.
The \e {Fresnel properties on materials} example illustrates how to add Fresnel to a material
and use the material on a 3D model.
The fresnel effect affects how materials reflect light at different viewing angles. Imagine the
Fresnel affects how materials reflect light at different viewing angles. Imagine the
water on a lake. If you look down at the water from straight above, you can see through the
water, but if you look from a lower angle, the reflections are stronger.
\image fresnel-angle.webp
\section1 Running the Example
\section1 Running the example
To run the example in \QDS, go to the \uicontrol Welcome screen and select the example
from the \uicontrol Examples tab.
\section1 The 3D Scene
\section1 The 3D scene
The example project consists of a basic 3D scene with the following components:
The 3D scene of the example project consists of the following models:
\list
\li A 3D model.
\li A directional light.
\li An HDR image used to light the scene (image-based lighting).
\li Monkey head (\e {monkeyModel})
\li Sphere (\e {sphere})
\li Plane (\e {mirror})
\endlist
\section1 The Material
The 3D scene uses a directional light and an HDR image (image-based lighting) to light
the scene.
The material on the 3D model in this example is a principled material with a
clearcoat.
Use the example UI controls to manipulate the scene.
\table
\header
\li Control
\li Description
\row
\li \uicontrol {Rotate background}
\li Rotates the background to see the models from different angles.
\row
\li \uicontrol {Move camera} or \uicontrol {Move model}
\li Switches between moving the monkey head model and the camera.
\row
\li \uicontrol {Reset camera}
\li Resets the camera.
\row
\li \uicontrol {Reset monkey}
\li Resets the monkey.
\endtable
Navigate the scene with your keyboard using the \uicontrol {Camera controls} listed in
the example.
\section1 The materials
The following materials are used in this example.
\table
\header
\li Material
\li Description
\row
\li Monkey Material
\li A yellow principled material with a clearcoat.
\row
\li Green Material
\li A green principled material with a clearcoat.
\row
\li Mirror
\li A ready-made material from \uicontrol {Content Library}.
\endtable
\section2 Clearcoat
@@ -47,9 +89,9 @@
You adjust clearcoat properties independently from the base material.
\section2 Fresnel Properties
\section2 The Fresnel properties
The following properties affect how the fresnel effect renders. These properties are
The following properties affect how Fresnel renders. These properties are
available both for the base material and the clearcoat layer. Adjusting the settings for the
clearcoat has a bigger visual effect.
@@ -58,33 +100,50 @@
\li Property
\li Description
\row
\li Fresnel power
\li Increasing the fresnel power decreases the head-on reflections (steep viewing angle)
\li Fresnel Power
\li Increasing the Fresnel power decreases the head-on reflections (steep viewing angle)
while maintaining the reflections seen from more shallow viewing angles.
\row
\li Enable scale and bias
\li Takes the scale and bias properties into account.
\row
\li Scale
\li Fresnel Scale
\li Determines the rate of change in reflection intensity as the viewing angle varies. A
large scale value results in a gentler transition between weak and strong reflections, while
a smaller scale creates a more abrupt shift in reflection intensity.
\row
\li Bias
\li Controls the offset for the fresnel power property and determines how quickly the
\li Fresnel Bias
\li Controls the offset for the Fresnel power property, which determines how quickly the
reflection transitions from weak to strong as the viewing
angle changes. A larger bias value shifts the transition point toward steeper angles.
\endtable
\section3 Adjusting the Fresnel Settings
\section2 Adjusting the Fresnel properties
To adjust the settings:
To adjust the Fresnel properties, use the sliders in the example UI.
To improve performance, select a lower reflection detail from the
\uicontrol {Reflection detail} dropdown menu.
To reset the Fresnel properties, select \uicontrol {Reset fresnel}.
\section1 Getting started with Fresnel
To edit an existing material:
\list 1
\li In \uicontrol {Material Browser}, double-click \e {Monkey Material}.
\li In \uicontrol {Material Browser}, double-click a material.
\li In \uicontrol {Material Editor}, find the properties under
\uicontrol {Clearcoat} and \uicontrol {Fresnel} respectively.
\endlist
\note You see the changes live as you edit them in the \uicontrol 2D view.
To create a new material with Fresnel:
\list 1
\li In \uicontrol {Material Editor}, select \imageplus.
\li Edit the properties under \uicontrol {Clearcoat} and \uicontrol {Fresnel} respectively.
\endlist
*/

2
doc/qtdesignstudio/examples/doc/Optimal3DScene.qdoc
View File

@@ -10,6 +10,6 @@
\image studio-kitchen-combined.png
The \e {Optimal 3D Scene} example contains the source files for the Optimal
3D Scene described in \l {Creating Optimized 3D Scenes}.
3D Scene described in \l {Creating optimized 3D scenes}.
*/

28
doc/qtdesignstudio/examples/doc/StateTransitions.qdoc
View File

@@ -1,18 +1,18 @@
// Copyright (C) 2022 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
\page state-transition-animations.html
\ingroup gstutorials
\sa States, {Transitions}, {Working with States}
\sa States, {Transitions}, {Working with states}
\title Animated State Transitions
\title Animated state transitions
\brief Illustrates how to create animated state transitions.
\image animated-state-transitions.jpg
The \e{Animated State Transitions} tutorial illustrates how you can animate
the transition between \l{Working with States}{states}.
The \e{Animated state transitions} tutorial illustrates how you can animate
the transition between \l{Working with states}{states}.
The starting point of this tutorial is the Car Demo project, you can
download it from
@@ -24,15 +24,15 @@
{here}.
This tutorial requires that you know the basics of \QDS, see
\l{Getting Started}.
\l{Getting started}.
\section1 Tutorial Assets
\section1 Tutorial assets
All assets you need for this tutorial are included in the Car Demo project.
\include run-tutorial-project.qdocinc
\section1 Creating States
\section1 Creating states
First, you create the different states. In this tutorial, you create four
different states with different views of the car in the scene:
@@ -45,7 +45,7 @@
To create the first state:
\list 1
\li In the \l States view, select \inlineimage icons/plus.png
\li In the \l States view, select \imageplus
.
\li Change the name of the new state to \e{side}.
\endlist
@@ -72,7 +72,7 @@
\image animated-state-transitions-states.png
\section1 Creating State Transitions
\section1 Creating state transitions
With the states created, you need a way to move between the states in the
UI. In this tutorial, you create buttons arranged in a column to do this.
@@ -123,13 +123,13 @@
\list 1
\li Go to the \uicontrol Connections view.
\li In \uicontrol{Navigator}, select \e button_side and in
\uicontrol {Connections}, select the \inlineimage icons/plus.png
\uicontrol {Connections}, select the \imageplus
button to open the connection setup options.
\li Set \uicontrol Signal to \c clicked, \uicontrol Action to
\c {Change State}, \uicontrol {State Group} to \c rectangle and
\uicontrol State to \c side in the respective
drop-down menus.
\li Select the \inlineimage icons/close.png
\li Select the \imageclose
button to close the connection setup options.
\li Repeat steps 2 to 4 for the next three buttons and set them to go to
their corresponding states.
@@ -142,13 +142,13 @@
To preview, select \key Alt + \key{P}.
\section1 Animating State Transitions
\section1 Animating state transitions
The final step of this tutorial is to create animations between the states:
\list 1
\li Go to \l{Transitions}.
\li Select \inlineimage icons/plus.png
\li Select \imageplus
.
\li In the upper right corner of \uicontrol {Transitions}, change
the number 2000 to 1000.

51
doc/qtdesignstudio/examples/doc/animationTutorial.qdoc
View File

@@ -1,6 +1,6 @@
/****************************************************************************
**
** Copyright (C) 2022 The Qt Company Ltd.
** Copyright (C) 2024 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Design Studio documentation.
@@ -26,22 +26,22 @@
/*!
\page animation-tutorial.html
\ingroup gstutorials
\sa {Creating Timeline Animations}
\sa {Creating timeline animations}
\title Timeline Animation Tutorial
\title Timeline animation
\brief Illustrates how to create timeline animations and bind them to
properties in \QDS.
\image animation-tutorial.gif
The \e{Timeline Animation} tutorial illustrates how to create timeline animations
The \e{Timeline animation} tutorial illustrates how to create timeline animations
and bind them to properties in \QDS. First you create a keyframe animation
which you control the running state of with a switch in the UI. Next, you
create another keyframe animation where you use a slider in the UI to
control the position of the playhead.
The starting point of this tutorial is the Animation Tutorial project,
you can download it from
which you can download from
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/animation-tutorial/AnimationTutorial/Start}
{here}.
@@ -49,23 +49,22 @@
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/animation-tutorial/AnimationTutorial/Completed}
{here}.
This tutorial requires that you know the basics of \QDS, see
\l{Getting Started}.
To learn the basics of \QDS required to complete this tutorial, see \l{Getting started}.
\include run-tutorial-project.qdocinc
\section1 Creating a Timeline Animation
\section1 Creating a timeline animation
First, you create an animation where the ball bearing continuously rotates
around its Y axis.
\section2 Adding a Timeline and an Animation
\section2 Adding a timeline and an animation
To add a timeline to your project:
\list 1
\li In the \uicontrol Timeline view, select
\inlineimage icons/plus.png
\imageplus
.
This creates a timeline and one animation.
\li On the \uicontrol {Animation Settings} tab in the
@@ -73,7 +72,7 @@
\list
\li Set \uicontrol Duration to 7500.
This sets the duration of the animation in milliseconds.
\li Select \uicontrol {Contiunous}.
\li Select \uicontrol {Continuous}.
This sets the animation to start over again when it reaches the
end.
\endlist
@@ -84,14 +83,14 @@
You can see the timeline in the \uicontrol Timeline and
\uicontrol Navigator views.
\section2 Adding Keyframes
\section2 Adding keyframes
Next, you add keyframes to animate the rotation of the ball bearing:
\list 1
\li In the \uicontrol Navigator view, select \e {ballbearing1}.
\li In the \uicontrol Properties view, select
\inlineimage icons/action-icon.png (Actions)
\imageactionicon (Actions)
next to \uicontrol Rotation > \uicontrol {Y}.
\li Select \uicontrol {Insert Keyframe}.
\image animation-tutorial-insert-keyframe.png
@@ -109,7 +108,7 @@
timeline.
\endlist
\section2 Controlling the Running State of the Animation
\section2 Controlling the running state of the animation
There is a toggle switch in the UI of this project. To use this switch to
control the running state of the animation:
@@ -117,7 +116,7 @@
\list 1
\li In the \uicontrol Navigator view, select \e {timelineAnimation}.
\li In the \uicontrol Connections view, go to the \uicontrol Bindings tab.
\li Select \inlineimage icons/plus.png
\li Select \imageplus
to create a binding.
\li For the binding you created, set:
\list
@@ -131,23 +130,23 @@
You can preview the animation and try the toggle switch in the live preview.
To run the live preview, select \key Alt + \key{P}.
\section1 Creating a Timeline and Binding it to a Property
\section1 Creating a timeline and binding it to a property
Next, you create the exploded view animation of the ball bearing. You don't
want this animation to run automatically but instead you want to control it
with a slider in the UI.
\section2 Adding a Timeline Inside a Component
\section2 Adding a timeline inside a component
You create this animation inside the ball bearing component, to do this:
To create this animation inside the ball bearing component:
\list 1
\li In the \uicontrol Navigator view, select \e {ballBearing1}.
\li Select \key {F2} to go into the component.
\li In the \uicontrol Timeline view, select
\inlineimage icons/plus.png
\imageplus
to add a timeline and open the \uicontrol {Timeline Settings} dialog.
\li Select \inlineimage icons/minus.png
\li Select \imageminus
next to the \uicontrol {Animation Settings} tab to remove the animation
in this timeline.
You do not need an animation when you bind the timeline to a property.
@@ -156,14 +155,14 @@
\image animation-tutorial-timeline-2.png
\section2 Adding Keyframes
\section2 Adding keyframes
Now, you add keyframes for the different parts of the ball bearing:
\list 1
\li In the \uicontrol{Navigator} view, select \e{inner_race}.
\li In the \uicontrol Properties view, select
\inlineimage icons/action-icon.png (Actions)
\imageactionicon (Actions)
next to \uicontrol Translation > \uicontrol Y.
\li Select \uicontrol {Insert Keyframe}.
\li In the \uicontrol Timeline view, select the
@@ -190,7 +189,7 @@
You can preview the animation by dragging the playhead in the
\uicontrol Timeline view.
\section2 Controlling the Animation with a Slider
\section2 Controlling the animation with a slider
Now, you use the slider on the main screen to control the exploded
view animation that you created.
@@ -200,7 +199,7 @@
\list 1
\li In the \uicontrol Navigator view, select \e Node.
\li On the \uicontrol Properties tab in the \uicontrol Connections view,
select \inlineimage icons/plus.png
select \imageplus
.
\li In the \uicontrol {Property Type} field, enter \e {Item}.
This field is a drop-down list, but you can also type text.
@@ -213,7 +212,7 @@
\list 1
\li In the \uicontrol {Timeline} view, select
\inlineimage icons/animation.png
\imageanimation
.
\li In the \uicontrol {Expression binding field}, enter
\c {property0.value}.
@@ -229,7 +228,7 @@
\li In the \uicontrol {Navigator} view, select \e {ballbearing1}.
\li In the \uicontrol {Connections} view, go to the
\uicontrol {Bindings} tab.
\li Select \inlineimage icons/plus.png
\li Select \imageplus
.
\li For the binding you just created:
\list

22
doc/qtdesignstudio/examples/doc/coffeemachine.qdoc
View File

@@ -1,4 +1,4 @@
// Copyright (C) 2021 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
@@ -21,7 +21,7 @@
the viewport and the timeline to animate the \l{glossary-transition}
{transitions} between and on the screens.
\section1 Application Flow
\section1 Application flow
On the startup screen, \e {AnimationFlowForm.ui.qml}, users can select
from several types of coffee to fill the empty cup. The selection
@@ -88,11 +88,11 @@
is triggered. It sets the application flow status to \c "reset", so
that the application returns to the startup screen.
\section1 Using Timelines to Animate Transitions
\section1 Using timelines to animate transitions
The Coffee Machine application screens for choosing coffee, empty cup, and
brewing each use custom components specified in separate \l{UI Files}
{UI files} (ui.qml).
brewing each use custom components specified in separate \l{UI files}
(ui.qml).
We use the \l Timeline view to animate the transitions between the screens
during the application flow in \e {ApplicationFlowForm.ui.qml}.
@@ -100,15 +100,15 @@
\image coffee-machine-timeline.png
Our viewport contains 200 frames, so we select the
\inlineimage icons/plus.png "Plus button"
\imageplus
button to add a 1200-frame timeline to the root component.
We use the default values for all other fields.
To start recording the transition from the startup screen to the coffee
selection screen on the timeline, we select \e choosingCoffee in
\l Navigator. We check that the playhead is at frame 0, and then
select the \inlineimage icons/recordfill.png
(\uicontrol {Auto Key (K)}) button (or press \key k).
select the \imagerecordfill
(\uicontrol {Auto Key (K)}) button (or select \key K).
At frame 0, we set the X coordinate to 0 in \l Properties >
\uicontrol {Geometry - 2D} > \uicontrol Position. We then move the
@@ -120,9 +120,9 @@
new timeline appears in the view.
For more information about using the timeline, see
\l {Creating Timeline Animations}.
\l {Creating timeline animations}.
\section1 Using States to Move Between Screens
\section1 Using states to move between screens
We use the \l States view to determine the contents of the
viewport. The animations are run when moving from one state to another.
@@ -137,7 +137,7 @@
\c {"settings"} and \c {"selection"} states.
We then return to the \uicontrol Timeline view and select
\inlineimage icons/animation.png "Timeline Settings button"
\imageanimation
to open the \uicontrol {Timeline Settings} dialog. We select
the \uicontrol Add button to create animations for each part
of the timeline. Therefore, the start and end frame of each

16
doc/qtdesignstudio/examples/doc/ebikedesign.qdoc
View File

@@ -1,4 +1,4 @@
// Copyright (C) 2021 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
@@ -27,21 +27,21 @@
viewport, and the timeline to animate the \l{glossary-transition}
{transitions} between and on the screens.
\section1 Using Timelines to Animate Transitions
\section1 Using timelines to animate transitions
We use the \l Timeline view to animate the transitions between
the screens in \e {Screen01.ui.qml}.
Our viewport contains 1000 frames, so we select the
\inlineimage icons/plus.png "Plus button"
\imageplus
button to add a 5000-frame timeline to the root component.
We use the default values for all other fields.
To start recording the transitions between the Standard screen and the
Trip and Navigator screens on the timeline, we select \e screenCanvas in
the \l Navigator view. We check that the playhead is at frame 0, and then
select the \inlineimage icons/recordfill.png
(\uicontrol {Auto Key (K)}) button (or press \key k).
select the \imagerecordfill
(\uicontrol {Auto Key (K)}) button (or select \key K).
\image ebikedesign-timeline.png "Timeline view"
@@ -69,9 +69,9 @@
speedometer grow and shrink in size depending on its current position.
For more information about using the timeline, see
\l {Creating Timeline Animations}.
\l {Creating timeline animations}.
\section1 Using States to Move Between Screens
\section1 Using states to move between screens
We use the \l States view to determine the contents of the viewport.
The animations are run in a particular state or when moving from one state
@@ -92,7 +92,7 @@
ToBig, and FromBig.
We then return to the \uicontrol Timeline view and select
\inlineimage icons/animation.png "Timeline Settings button"
\imageanimation
to open the \uicontrol {Timeline Settings} dialog. We select
the \uicontrol Add button to create animations for each part
of the timeline. Therefore, the start and end frame of each

20
doc/qtdesignstudio/examples/doc/effectComposerExample.qdoc
View File

@@ -5,12 +5,12 @@
\page effect-composer-example.html
\ingroup studioexamples
\title Effect Composer Example
\title Effect Composer example
\brief Illustrates how to work with the Effect Composer effects.
\image effect-composer-example.webp {The Effect Composer example project}
The \e {Effect Composer Example} illustrates how to work with the \uicontrol {Effect Composer}
The \e {Effect Composer} example illustrates how to work with the \uicontrol {Effect Composer}
effects. Use the example project to experiment with effects and get familiar with
\uicontrol {Effect Composer}. To learn more, see \l {Effect Composer}.
@@ -22,18 +22,18 @@
The example project has a scalable design. When you resize the window to fit your screen, some
components will adjust automatically.
\section1 Running the Example
\section1 Running the example
To run the example in \QDS, go to the \uicontrol Welcome screen and select the example
from the \uicontrol Examples tab.
\section1 The Effects
\section1 The effects
The following table introduces the effects in this example.
\table
\header
\li Effect Name
\li Effect name
\li Description
\row
\li \uicontrol {Displace}
@@ -49,14 +49,14 @@
\li A weather effect, a combination of a rain effect and a thunder effect.
\endtable
\section1 The Structure of the Example
\section1 The structure of the example
In addition to the effects, the example project also includes the following components:
\list
\li A \l {3D} scene
\list
\li \l {Importing 3D Assets}{A 3D model}
\li \l {Importing 3D assets}{A 3D model}
\li \l {Lights}{A directional light}
\li \l {Cameras}{A scene camera}
\li \l {OrbitCameraController}
@@ -64,11 +64,11 @@
\li \l {Text} components
\li \l {Rectangle} components
\li \l {Shapes#Border}{Border} components
\li \l {Creating Buttons}{Custom Buttons}
\li \l {Creating Custom Components}{Custom Sliders}
\li \l {Creating buttons}{Custom buttons}
\li \l {Creating custom components}{Custom sliders}
\endlist
The example project also uses \uicontrol States and \uicontrol Transitions. To learn more, see
\l {Working with States} and \l {Transitions}.
\l {Working with states} and \l {Transitions}.
*/

BIN
doc/qtdesignstudio/examples/doc/images/fresnel-example.webp
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 61 KiB

After

Width:  |  Height:  |  Size: 39 KiB

75
doc/qtdesignstudio/examples/doc/loginui1.qdoc
View File

@@ -4,15 +4,14 @@
/*!
\example Loginui1
\ingroup gstutorials
\nextpage {Log In UI - Positioning}
\nextpage {Login UI: Positioning}
\title Log In UI - Components
\title Login UI: Components
\brief Illustrates how to use wizard templates to create a simple UI
that contains a text label, images, and push buttons.
\image loginui1.webp
\e{Log In UI - Components} is the first tutorial in a series of tutorials
\e{Login UI: Components} is the first tutorial in a series of tutorials
that describes how to use the \QDS wizard templates to create a project and
a button UI control, and how to modify the files generated by the wizard
templates to design the UI.
@@ -20,12 +19,12 @@
You can download the completed project from
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui1}{here}.
\section1 Creating the UI Project
\section1 Creating the UI project
For the purposes of this tutorial, you will use the empty wizard template.
Wizard templates are available also for creating UIs that are optimized for
mobile platforms and for launcher applications. For more information about
the options you have, see \l {Creating Projects}.
the options you have, see \l {Creating projects}.
To create a project:
@@ -63,7 +62,7 @@
Remove the button and the text component from the UI to have a clean workspace. Later
in this tutorial, you will add and modify them as you need.
To remove this button, select it and press \key {Backspace}. Repeat for the
To remove this button, select it and select \key {Backspace}. Repeat for the
text component.
Next, you will edit the values of the properties of the component instances
@@ -93,7 +92,7 @@
To add the assets:
\list 1
\li Select \uicontrol Assets > \inlineimage icons/plus.png
\li Select \uicontrol Assets > \imageplus
(Select \uicontrol View > \uicontrol Views > \uicontrol Assets to enable it,
if you can't find it).
\image loginui1-add-assets.webp "The Assets view."
@@ -104,7 +103,7 @@
\endlist
To preview the changes that you make, select the \uicontrol {Live Preview} button
or press \key {Alt+P}.
or select \key {Alt+P}.
The \e Screen01.ui.qml file that the wizard template created for you should
be open. If it is not, you can double-click it in the \uicontrol Projects view
@@ -141,7 +140,7 @@
white (\e #ffffff).
\image loginui1-properties-text.webp "Text properties."
\endlist
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -164,8 +163,8 @@
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
\l {Creating Scalable Buttons and Borders}.
more information, see \l {Creating buttons} and
\l {Creating scalable buttons and borders}.
To create a push button by using the wizard template:
@@ -187,7 +186,7 @@
Next, you will change the appearance of the EntryField component by
modifying its properties.
\section1 Styling the Button
\section1 Styling the button
You can now modify the properties of the EntryField component to your
liking. To make the changes apply to all the EntryField instances, you
@@ -217,7 +216,7 @@
\li In \uicontrol Properties > \uicontrol Rectangle, set:
\list
\li \uicontrol {Fill color} to transparent light gray (\e #28e7e7e7).
You can also use the \l{Picking Colors}{color picker} to set the color.
You can also use the \l{Picking colors}{color picker} to set the color.
\li \uicontrol {Border color} to white (\e #ffffff).
\li \uicontrol Radius to \e 50 to give the button rounded corners.
\endlist
@@ -239,7 +238,7 @@
\li In the \uicontrol States view, select the \e normal state and
repeat the changes in the background color and text properties,
as necessary. Repeat for the \e down state.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -254,9 +253,9 @@
Next, you will add instances of the \e EntryField component to the
\e Screen01 component and modify their properties.
\section1 Adding Entry Fields to the UI
\section1 Adding entry fields to the UI
You will now add EntryField instances to the UI and modify their properties.
You will now add two entry fields to the UI and modify their properties:
\list 1
\li Double-click \e Screen01.ui.qml in \uicontrol Projects
@@ -280,11 +279,11 @@
to another position in the \uicontrol {2D} view. Use the
guidelines to align the button instances below the tag line:
\image loginui1-align-entry-fields.webp "Aligned entry fields."
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
\section1 Creating Another Button
\section1 Creating another button
We want to center-align the text of two additional push buttons and use
brighter colors for them, so we create a second button component as
@@ -329,7 +328,7 @@
turn the button background green when the button is pressed down.
Also, in \uicontrol Text > \uicontrol Character >
\uicontrol {Text color}, keep the text color as white (\e #ffffff).
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -337,9 +336,9 @@
\image loginui1-button-styled.webp "Modified push button in the 2D view."
\section1 Adding Push Buttons to the UI
\section1 Adding push buttons to the UI
You will now add PushButton instances to the UI and modify their properties.
You will now add two buttons to the UI and modify their properties:
\list 1
\li Double-click \e Screen01.ui.qml in \uicontrol Projects
@@ -362,7 +361,7 @@
\li Select the second PushButton instance, and change its ID to
\e createAccount and text label to \e {Create Account}. Again,
mark the text translatable.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -371,11 +370,11 @@
\image loginui1-ready.webp "The finished UI in the 2D view and live preview."
\section1 Learn More
\section1 Learn more
The \e {Learn More} sections provide additional information about the
tasks performed by the wizards and about other basic tasks and concepts.
\section2 Projects and Files
\section2 Projects and files
\QDS creates a set of files and folders that you need to create
a UI. The files are listed in the \l{File System} view.
@@ -388,7 +387,7 @@
\li The \e {loginui1.qml} file defines the functionality of
the UI. For the time being, it does not do anything.
\li The \e {Screen01.ui.qml} file is a custom component created by
the wizard template. For more information, see \l {UI Files}.
the wizard template. For more information, see \l {UI files}.
By default, this is the main file in the project, but you can
change that in the .qmlproject file. While the custom component
@@ -410,11 +409,11 @@
\e EventListSimulator.qml files are not used in this example, so
you can ignore them for now.
\endlist
\l{UI Files}{UI files} define a hierarchy of components with a
highly-readable, structured layout. Every UI file consists of two parts:
an imports section and an component declaration section. The components and
functionality most common to UIs are provided in the \c QtQuick import. You
can view the code of a \e .ui.qml file in the \l{Code} view.
\l{UI files} define a hierarchy of components with a highly-readable,
structured layout. Every UI file consists of two parts: an imports section
and a component declaration section. The components and functionality most
common to UIs are provided in the \c QtQuick import. You can view the code
of a \e .ui.qml file in the \l{Code} view.
\section2 Components
@@ -448,7 +447,7 @@
descriptions of all components, see \l{All QML Types} in the Qt reference
documentation.
\section3 Regtangle Properties
\section3 Regtangle properties
The default \l {basic-rectangle}{Rectangle} component is used for drawing
shapes with four sides and four corners. You can fill rectangles either with
@@ -462,7 +461,7 @@
component. It is available in \uicontrol Components
> \uicontrol {Qt Quick Studio Components}.
\section3 Text Properties
\section3 Text properties
The \l Text component is used for adding static text to the UI, such as
titles and labels. You can select the font to use and specify extensive
@@ -472,19 +471,19 @@
If you want to create a label with a background, use the \l Label component
from the \uicontrol {Qt Quick Controls} module instead of the text component.
\section3 Image Properties
\section3 Image properties
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 Assets, select
\inlineimage icons/plus.png
\imageplus
, and then select the image file.
If you need to display animated images, use the \l {Animated Image}
component, also available in \uicontrol Components >
\uicontrol {Default Components} > \uicontrol Basic.
\section2 UI Controls
\section2 UI controls
The \e {Custom Button} wizard template creates a button component
based on the \l {Button} control in the \l {Qt Quick Controls} module. It
@@ -510,11 +509,11 @@
For more information, see \l{The id Attribute}.
\section1 Next Steps
\section1 Next steps
To learn how to add more UI controls and position them on the page using
anchors and layouts so that the UI is scalable, see the next tutorial in
the series, \l {Log In UI - Positioning}.
the series, \l {Login UI: Positioning}.
For a more advanced example of creating a menu button and using it to
construct a button bar, see \l {Side Menu}.

87
doc/qtdesignstudio/examples/doc/loginui2.qdoc
View File

@@ -4,16 +4,16 @@
/*!
\example Loginui2
\ingroup gstutorials
\previouspage {Log In UI - Components}
\nextpage {Log In UI - States}
\previouspage {Login UI - Components}
\nextpage {Login UI: States}
\title Log In UI - Positioning
\title Login UI: Positioning
\brief Illustrates how to position UI components on pages using anchors and
positioners.
\image loginui2.webp "Log In UI"
\image loginui2.webp "Login UI"
\e{Log In UI - Positioning} is the second in a series of tutorials that build
\e{Login UI: Positioning} is the second in a series of tutorials that build
on each other to illustrate how to use \QDS to create a simple UI with
some basic UI components, such as pages, buttons, and entry fields. The
second tutorial in the series describes how to position the UI components
@@ -24,23 +24,23 @@
with different screen sizes, you will use anchors and positioners.
The starting point for this tutorial is the completed
\l{Log In UI - Components} project. You can download the project
\l{Login UI: Components} project. You can download the project
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui1}{here}.
Additionally, you can download the completed project of this tutorial
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui2}{here}.
The \e {Learn More} sections provide additional information about the
The \e {Learn more} sections provide additional information about the
task at hand.
\section1 Anchoring UI Components
\section1 Anchoring UI components
First, you will \l {Setting Anchors and Margins}{anchor} the
First, you will \l {Setting anchors and margins}{anchor} the
static page elements, background image (\e adventurePage), logo
(\e qt_logo_green_128x128px), and tag line (\e tagLine), to the page.
To preview the changes that you make, select the \uicontrol {Live Preview} button
or press \key {Alt+P}.
or select \key {Alt+P}.
To anchor component instances on a page:
@@ -50,24 +50,24 @@
\li Select \e adventurePage in the \l Navigator view to display its
properties in the \l Properties view.
\li In \uicontrol Properties > \uicontrol Layout, select
the \inlineimage icons/anchor-fill.png
the \imageanchorfill
anchor button to anchor \e adventurePage to its
parent in the \uicontrol Target field. This attaches the background
image to the rectangle on all sides.
\note Selecting the anchor button should automatically select the
four buttons on the left side of it. If it doesn't, select
\inlineimage icons/reset.png on the \uicontrol {2D} view toolbar to refresh the
\imagereset on the \uicontrol {2D} view toolbar to refresh the
\uicontrol{2D} view.
\image loginui2-layout.png "Layout properties"
\li Select \e qt_logo_green_128x128px in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-top.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-top.png to \e parent to anchor
\li \uicontrol Anchors to \imageanchortop and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchortop to \e parent to anchor
the logo to its parent.
\li \uicontrol Margin \inlineimage icons/anchor-top.png to \e 40 and
select \inlineimage icons/anchor-top.png to anchor the logo to the top of
\li \uicontrol Margin \imageanchortop to \e 40 and
select \imageanchortop to anchor the logo to the top of
the target.
\endlist
This attaches the logo to the rectangle at the top while keeping its horizontal
@@ -76,12 +76,12 @@
\li Select \e tagLine in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-top.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-top.png to
\li \uicontrol Anchors to \imageanchortop and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchortop to
\e qt_logo_green_128x128px to anchor the tag line to the logo.
\li \uicontrol Margin \inlineimage icons/anchor-top.png to \e 40 and
select \inlineimage icons/anchor-bottom.png to anchor the tag line to the
\li \uicontrol Margin \imageanchortop to \e 40 and
select \imageanchorbottom to anchor the tag line to the
bottom of the target.
\endlist
This attaches the tag line to the bottom of the logo while keeping its horizontal
@@ -92,8 +92,8 @@
\uicontrol Target field, check that the component instance is
located in the correct place in the component hierarchy in
\uicontrol Navigator. For more information,
see \l{Arranging Components}.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
see \l{Arranging components}.
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -102,10 +102,10 @@
\image loginui2-loginpage.webp "Login page in the 2D view and live preview"
\section1 Using Column Positioners
\section1 Using column positioners
You will now position the entry fields and buttons in columns
to learn another method of \l{Using Positioners}{positioning components}.
to learn another method of \l{Using positioners}{positioning components}.
Then, you will anchor the columns to the page to enable their positions
to change when the screen size changes.
@@ -137,12 +137,12 @@
\li Select \e fields in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-top.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-top.png to
\li \uicontrol Anchors to \imageanchortop and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchortop to
\e tagLine to anchor the entry fields to the tag line.
\li \uicontrol Margin \inlineimage icons/anchor-top.png to \e 170 and
select \inlineimage icons/anchor-bottom.png to anchor the entry fields to the
\li \uicontrol Margin \imageanchortop to \e 170 and
select \imageanchorbottom to anchor the entry fields to the
bottom of the target.
\endlist
This attaches the entry fields to the bottom of the tag line while keeping its
@@ -151,18 +151,18 @@
\li Select \e buttons in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-bottom.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-bottom.png to
\li \uicontrol Anchors to \imageanchorbottom and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchorbottom to
\e parent to anchor the entry fields to the rectangle.
\li \uicontrol Margin \inlineimage icons/anchor-bottom.png to \e 50 and
select \inlineimage icons/anchor-bottom.png to anchor the entry fields to the
\li \uicontrol Margin \imageanchorbottom to \e 50 and
select \imageanchorbottom to anchor the entry fields to the
bottom of the target.
\endlist
This attaches the buttons to the bottom of the rectangle while keeping its
horizontal center aligned with that of the rectangle.
\image loginui2-buttons-properties.webp "Properties of buttons"
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -171,7 +171,7 @@
\image loginui2-loginpage-ready.webp "Login page in the 2D view and live preview"
\section1 Learn More
\section1 Learn more
\section2 Anchors
In an anchor-based layout, each component instance can be thought of as
having a set of invisible \e anchor lines: top, bottom, left, right, fill,
@@ -183,20 +183,21 @@
component instance changes, the instances that are anchored to it will
adjust automatically to maintain the anchoring.
For more information, see \l{Positioning with Anchors}.
For more information, see \l{Positioning with Anchors}{Positioning with anchors}.
\section2 Positioners
For many use cases, the best positioner to use is a simple grid, row, or
column, and \QDS provides components that will position children in these
formations in the most efficient manner possible. For more information
about using preset positioners, see \l {Using Positioners}.
about using preset positioners, see \l {Using positioners}.
For more complicated UI designs, you can use components from the
\l {Using Layouts}{Qt Quick Layouts module}.
\l {Using layouts}{Qt Quick Layouts module}.
\section1 Next Steps
\section1 Next steps
To learn how to add a second page and move to it from the main page, see
the next tutorial in the series, \l {Log In UI - States}.
the next tutorial in the series, \l {Login UI: States}.
*/

40
doc/qtdesignstudio/examples/doc/loginui3.qdoc
View File

@@ -5,14 +5,14 @@
\example Loginui3
\ingroup gstutorials
\title Log In UI - States
\title Login UI: States
\brief Illustrates how to use states to create a second UI page.
\previouspage {Log In UI - Positioning}
\nextpage {Log In UI - Timeline}
\previouspage {Login UI: Positioning}
\nextpage {Login UI: Timeline}
\image loginui3.gif "Log In UI"
\image loginui3.gif "Login UI"
\e{Log In UI - States} is the third in a series of tutorials that build
\e{Login UI: States} is the third in a series of tutorials that build
on each other to illustrate how to use \QDS to create a simple UI with
some basic UI components, such as pages, buttons, and entry fields. The
third tutorial in the series describes how to use \e states to add a
@@ -25,7 +25,7 @@
when a user selects the \e {Create Account} button.
The starting point for this tutorial is the completed
\l{Log In UI - Positioning} project. You can download the project
\l{Login UI: Positioning} project. You can download the project
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui2}{here}.
Additionally, you can download the completed project of this tutorial
@@ -33,14 +33,14 @@
For more information, see \l{Working with states} and \l{Signal and Handler Event System}.
\section1 Adding UI Components
\section1 Adding UI components
You will add another entry field for verifying the password that users
enter to create an account. You are already familiar with the tasks in
this section from the previous \e {Login UI} tutorials.
To preview the changes that you make, select the \uicontrol {Live Preview} button
or press \key {Alt+P}.
or select \key {Alt+P}.
To add the entry field needed on the second page to the \e Screen01
component:
@@ -59,7 +59,7 @@
enter \e {Repeat Password} and select \uicontrol tr to mark the text
translatable.
\image loginui3-new-entryfield-properties.webp "Entryfield properties"
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -73,13 +73,13 @@
the login page and the \e {Create Account} button on the account creation
page.
\section1 Using States to Simulate Page Changes
\section1 Using states to simulate page changes
You will now add \l{Working with States}{states} to the UI to show and hide UI
You will now add \l{Working with states}{states} to the UI to show and hide UI
components in the \uicontrol {2D} view, depending on the current page:
\list 1
\li In the \l States view, select \inlineimage icons/plus.png
\li In the \l States view, select \imageplus
.
\li Enter \e login as the state name.
\image loginui3-login-state.webp "States view"
@@ -98,7 +98,7 @@
\li In \uicontrol Visibility, clear the \uicontrol Visible checkbox
to hide the \e {Create Account} button in the account creation
state.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -114,7 +114,7 @@
\e {Create Account} button on the login page triggers a
transition to the account creation page.
\section1 Connecting Buttons to States
\section1 Connecting buttons to states
Components have predefined signals that are emitted when users interact
with the UI. The \e PushButton component contains a \l{Mouse Area} component
@@ -122,25 +122,25 @@
is clicked within the area.
You will now use the \l {Connections} view to
\l{Connecting Components to Signals}{connect} the clicked signal of the
\l{Connecting components to signals}{connect} the clicked signal of the
\e createAccount button to \e createAccount state:
\list 1
\li Select \uicontrol View > \uicontrol Views >
\uicontrol {Connections} to open the \uicontrol Connections view.
\li Select \e createAccount in \uicontrol Navigator.
\li In the \uicontrol Connections tab, select the \inlineimage icons/plus.png
\li In the \uicontrol Connections tab, select the \imageplus
button to open the connection setup options.
\li Set \uicontrol Signal to \c clicked, \uicontrol Action to
\c {Change State}, \uicontrol {State Group} to \c rectangle, and
\uicontrol State to \c createAccount in the respective
drop-down menus.
\li Select the \inlineimage icons/close.png
\li Select the \imageclose
button to close the connection setup options.
\image loginui3-connections.webp "Connections tab"
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\note Alternatively, right-click the \e createAccount button in
@@ -154,9 +154,9 @@
\image loginui3.gif "Moving between login page and account creation page"
\section1 Next Steps
\section1 Next steps
To learn how to use a timeline to animate the transition between the login
and account creation pages, see the next tutorial in the series,
\l {Log In UI - Timeline}.
\l {Login UI: Timeline}.
*/

109
doc/qtdesignstudio/examples/doc/loginui4.qdoc
View File

@@ -5,14 +5,14 @@
\example Loginui4
\ingroup gstutorials
\title Log In UI - Timeline
\title Login UI: Timeline
\brief Illustrates how to use the timeline and states to animate UI
components.
\previouspage {Log In UI - States}
\previouspage {Login UI: States}
\image loginui4.gif "Log In UI"
\image loginui4.gif "Login UI"
\e{Log In UI - Timeline} is the fourth in a series of tutorials that build
\e{Login UI: Timeline} is the fourth in a series of tutorials that build
on each other to illustrate how to use \QDS to create a simple UI with
some basic UI components, such as pages, buttons, and entry fields. The
fourth part of the tutorial describes how to use the timeline and states
@@ -20,25 +20,24 @@
to the preceding animation, where you can navigate to the account creation
page by clicking the \e {Create Account} button.
In \l {Log In UI - States}, you learned how to use states to simulate page
In \l {Login UI: States}, you learned how to use states to simulate page
changes in a UI and connections to provide user interaction with it. In
this part, you will now learn another way of animating the UI by creating
\l{Creating Timeline Animations}{timeline animations} that you bind
\l{Creating timeline animations}{timeline animations} that you bind
to states.
The starting point for this tutorial is the completed
\l{Log In UI - States} project. You can download the project
\l{Login UI: States} project. You can download the project
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui3}{here}.
Additionally, you can download the completed project of this tutorial
\l{https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/tutorial%20projects/Loginui4}{here}.
For more information, see \l {Creating timeline animations}.
For more information, see \l {Creating Timeline Animations}.
\section1 Animating UI components
\section1 Animating UI Components
In \l {Log In UI - States}, you changed the visibility property in different
In \l {Login UI: States}, you changed the visibility property in different
states to simulate changing pages. To make sure that those changes won't
interfere with the changes to the opacity property you will make next, you
will first remove the states.
@@ -52,41 +51,41 @@
column component and anchor them to the rectangle and to each other instead.
To preview the changes that you make, select the \uicontrol {Live Preview} button
or press \key {Alt+P}.
or select \key {Alt+P}.
\section2 Replacing Columns with Anchors
\section2 Replacing columns with anchors
First, prepare the \e Screen01 component for adding animation:
\list 1
\li Double-click \e Screen01.ui.qml in \l Projects to open it
in the \l {2D} view.
\li In the \l States view, select \e login > \inlineimage icons/more-button.png
\li In the \l States view, select \e login > \imagemorebutton
> \uicontrol Delete to remove the state. Repeat for the \e createAccount state.
\li Select \e username in \l Navigator, and then select:
\list
\li \inlineimage icons/arrowleft.png to move \e username into the parent
\li \imagearrowleft to move \e username into the parent
rectangle.
\li \inlineimage icons/navigator-arrowup.png to move \e username below
\li \imagenavigatorarrowup to move \e username below
\e tagLine in \uicontrol Navigator to preserve the
\l{Arranging Components}{component hierarchy}.
\l{Arranging components}{component hierarchy}.
\endlist
\li Repeat the previous step for \e password and \e repeatPassword.
\li Select \e fields in \uicontrol Navigator and press \key Delete to
\li Select \e fields in \uicontrol Navigator and select \key Delete to
delete it.
\image loginui4-hierarchy.webp "The hierarchy of the components."
\li Select \e username in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-top.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-top.png to
\li \uicontrol Anchors to \imageanchortop and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchortop to
\e tagLine to anchor \e username to the tag line.
\li \uicontrol Margin \inlineimage icons/anchor-top.png to \e 170 and
select \inlineimage icons/anchor-bottom.png to anchor \e username to the
\li \uicontrol Margin \imageanchortop to \e 170 and
select \imageanchorbottom to anchor \e username to the
bottom of the target.
\note Selecting the anchor button should automatically update the
\uicontrol {2D} view. If it doesn't, select \inlineimage icons/reset.png
\uicontrol {2D} view. If it doesn't, select \imagereset
on the \uicontrol {2D} view toolbar to refresh the \uicontrol{2D} view.
\endlist
This attaches \e username to the bottom of the tag line while keeping its
@@ -95,12 +94,12 @@
\li Select \e password in \uicontrol Navigator.
\li In \uicontrol Properties > \uicontrol Layout, set:
\list
\li \uicontrol Anchors to \inlineimage icons/anchor-top.png and
\inlineimage icons/anchor-center-horizontal.png.
\li \uicontrol Target \inlineimage icons/anchor-top.png to
\li \uicontrol Anchors to \imageanchortop and
\imageanchorcenterhorizontal.
\li \uicontrol Target \imageanchortop to
\e username to anchor \e password to \e username.
\li \uicontrol Margin \inlineimage icons/anchor-top.png to \e 20 and
select \inlineimage icons/anchor-bottom.png to anchor \e password to the
\li \uicontrol Margin \imageanchortop to \e 20 and
select \imageanchorbottom to anchor \e password to the
bottom of the target.
\endlist
This attaches \e password to the bottom of \e username while keeping its
@@ -109,7 +108,7 @@
\li Repeat the previous step to anchor the top of \e repeatPassword
to the bottom of \e password with a margin of \e 20 and to
anchor it horizontally to its parent.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -117,16 +116,16 @@
\image loginui4-base-state.webp "UI with all the buttons and fields"
\section2 Adding a Timeline
\section2 Adding a timeline
You are now ready to add the \l{Creating Timeline Animations}{timeline}.
You are now ready to add the \l{Creating timeline animations}{timeline}.
To add a timeline with settings for running the animation:
\list 1
\li Select \uicontrol View > \uicontrol Views >
\uicontrol Timeline to open the \l Timeline view.
\li In \uicontrol Timeline, select \inlineimage icons/plus.png
\li In \uicontrol Timeline, select \imageplus
to add a 1000-frame timeline and define settings for running the animation.
\li In the \uicontrol {Animation ID} field, enter
\e toCreateAccountState.
@@ -141,7 +140,7 @@
Next, you will record the animation in \uicontrol Timeline.
\section2 Inserting Keyframes
\section2 Inserting keyframes
To insert keyframes and record property changes in \uicontrol Timeline:
@@ -149,13 +148,13 @@
\li Select \e repeatPassword in \uicontrol Navigator to display its
properties in \uicontrol Properties.
\li In \uicontrol Visibility > \uicontrol Opacity, select
\inlineimage icons/action-icon.png
\imageactionicon
> \uicontrol {Insert Keyframe} to insert a keyframe for the
opacity property of the component.
\image loginui4-keyframe-opacity.png "Inserting keyframe for opacity property"
\li In \uicontrol Timeline, check that the playhead is in
frame \e 0, select the small arrow next to \e repeatPassword
keyframe to expand it, and then select the \inlineimage icons/recordfill.png
keyframe to expand it, and then select the \imagerecordfill
(\uicontrol {Per Property Recording}) button for the
\uicontrol opacity property of \e repeatPassword to start
recording property changes.
@@ -165,7 +164,7 @@
to show the button.
Alternatively, you can fine-tune the value of a keyframe by right-clicking the
keyframe marker \inlineimage icons/keyframe_linear_active.png
keyframe marker \imagekeyframelinearactive
, and selecting \uicontrol {Edit Keyframe}.
\image loginui4-timeline.webp "Recording the opacity property"
\li Select the record button again to stop recording property changes.
@@ -176,7 +175,7 @@
property of the button and to record changes for it. However, this
time the opacity value needs to be \e 1 in frame \e 0 and \e 0 in frame \e 1000.
\image loginui4-timeline-opacity.webp "Recorded timeline for the opacity properties"
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -186,7 +185,7 @@
You will now animate the top anchor margin of the \e {Repeat Password} field
to make it appear to slide down from the \e Password field.
\section2 Animating Anchors
\section2 Animating anchors
To animate the top anchor margin of the \e {Repeat Password} field:
@@ -194,15 +193,15 @@
\li Select \e repeatPassword in \uicontrol Navigator to display its
properties in \uicontrol Properties.
\li In \uicontrol Layout > \uicontrol Margin (under
\inlineimage icons/anchor-top.png
), select \inlineimage icons/action-icon.png
\imageanchortop
), select \imageactionicon
> \uicontrol {Insert Keyframe} to insert a keyframe for the top
anchor margin of \e repeatPassword.
\image loginui4-keyframe-top-anchor-margin.png "Inserting keyframe for top anchor margin"
\li In \uicontrol Timeline, check that the playhead is in
frame \e 0, and select the record button for the \e anchors.topMargin
property of \e repeatPassword.
\li In \uicontrol Layout > \uicontrol Margin (under \inlineimage icons/anchor-top.png),
\li In \uicontrol Layout > \uicontrol Margin (under \imageanchortop),
set a negative value for the top anchor margin, \e -100, to place \e repeatPassword
on top of \e password.
\li Move the playhead to frame \e 1000 and change the top anchor margin
@@ -211,17 +210,17 @@
\e password.
\li Select the record button again to stop recording property changes.
\image loginui4-timeline-all.webp "Recorded timeline for repeatPassword and createAccount."
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
\section2 Adding Easing Curves
\section2 Adding easing curves
You will now add an \l{Editing Easing Curves}{easing curve} to the anchor
You will now add an \l{Editing easing curves}{easing curve} to the anchor
margin animation that will make the transition seem smoother:
\list 1
\li Click the keyframe marker \inlineimage icons/keyframe_linear_active.png
\li Click the keyframe marker \imagekeyframelinearactive
for the \e anchors.topMargin property at frame \e 1000 on the
timeline to select it.
\image loginui4-easing-curve-top-anchor-margin.webp "Top anchor margin keyframe marker"
@@ -234,8 +233,8 @@
\endlist
When you attach easing curves to keyframes, the shape of the keyframe
marker changes from \inlineimage icons/keyframe_linear_active.png
to \inlineimage icons/keyframe_manualbezier_active.png
marker changes from \imagekeyframelinearactive
to \imagekeyframemanualbezieractive
.
Your timeline should now look something like this:
@@ -245,14 +244,14 @@
Next, you will create states for the login and account creation pages and bind
them to the animation settings.
\section1 Binding Animation to States
\section1 Binding animation to states
To bring back the \l{Working with States}{states} in the
To bring back the \l{Working with states}{states} in the
\uicontrol States view and bind them to the animation settings
in \uicontrol Timeline:
\list 1
\li In \uicontrol States, select \inlineimage icons/plus.png
\li In \uicontrol States, select \imageplus
twice to add two states and name them \e login and \e createAccount. You
don't need to make any property changes this time because you'll
bind the states to property animations.
@@ -260,8 +259,8 @@
the \e login state is applied when the application starts.
\image loginui4-states.webp "Created states in the States view."
\li With the base state selected, select \uicontrol Timeline >
\inlineimage icons/settings.png (\uicontrol {Timeline Settings (S)}) on the toolbar
(or press \key S) to open the \uicontrol {Timeline Settings} dialog.
\imagesettings (\uicontrol {Timeline Settings (S)}) on the toolbar
(or select \key S) to open the \uicontrol {Timeline Settings} dialog.
\li Double-click the cell in the \uicontrol Timeline column on the
\e login row, and select \e timeline in the list.
\li Double-click the cell in the \uicontrol Timeline column on the
@@ -270,7 +269,7 @@
\e createAccount row, and select \e toCreateAccountState.
\image loginui4-timeline-settings-states.png
\li Click \uicontrol Close to save the timeline settings.
\li Select \uicontrol File > \uicontrol Save or press \key {Ctrl+S}
\li Select \uicontrol File > \uicontrol Save or select \key {Ctrl+S}
to save your changes.
\endlist
@@ -279,7 +278,7 @@
\image loginui4.gif "Moving between login page and account creation page"
\section1 Next Steps
\section1 Next steps
To continue learning about \QDS, see \l{Examples} and other \l{Tutorials}.
*/

2
doc/qtdesignstudio/examples/doc/materialbundle.qdoc
View File

@@ -1,4 +1,4 @@
// Copyright (C) 2023 The Qt Company Ltd.
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!

Some files were not shown because too many files have changed in this diff Show More