Doc: Create a Prototyping chapter

Restructure existing information and fix navigation links.

Fixes: QDS-4470
Change-Id: I4a1118a4620527b461b99bf05b8b06d947018c80
Reviewed-by: Johanna Vanhatapio <johanna.vanhatapio@qt.io>
This commit is contained in:
Leena Miettinen
2021-06-10 17:10:47 +02:00
parent 116db82720
commit a3fbc85ced
40 changed files with 292 additions and 170 deletions

View File

@@ -26,7 +26,7 @@
/*! /*!
\page creator-telemetry.html \page creator-telemetry.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage creator-editor-external.html \previouspage creator-quick-ui-forms.html
\else \else
\previouspage creator-task-lists.html \previouspage creator-task-lists.html
\endif \endif

View File

@@ -30,9 +30,9 @@
// ********************************************************************** // **********************************************************************
/*! /*!
\previouspage creator-ui-best-practices.html \previouspage adding-plugins.html
\page creator-usability.html \page creator-usability.html
\nextpage studio-qtquick-best-practices.html \nextpage creator-coding.html
\title Optimizing Applications for Mobile Devices \title Optimizing Applications for Mobile Devices

View File

@@ -46,7 +46,7 @@
\list \list
\li \l {Previewing} \li \l {Validating with Target Hardware}
You can use the QML live preview to preview a QML file or an You can use the QML live preview to preview a QML file or an
entire Qt Quick application on the desktop, as well as on entire Qt Quick application on the desktop, as well as on

View File

@@ -155,61 +155,49 @@
\li \l{Scalable Layouts} \li \l{Scalable Layouts}
\li \l{Using Custom Fonts} \li \l{Using Custom Fonts}
\li \l{Annotating Designs} \li \l{Annotating Designs}
\li \l{Loading Placeholder Data}
\li \l{UI Files} \li \l{UI Files}
\endlist \endlist
\li \l {Adding Dynamics} \li \l{Prototyping}
\list \list
\li \l{Creating Animations} \li \l{Creating UI Logic}
\li \l{Simulating Complex Experiences}
\list \list
\li \l{Editing Easing Curves} \li \l{Loading Placeholder Data}
\li \l{Using QML Modules with Plugins}
\endlist
\li \l {Dynamic Behaviors}
\list
\li \l{Adding Connections}
\list
\li \l{Connecting Components to Signals}
\li \l{Adding Bindings Between Properties}
\li \l{Specifying Dynamic Properties}
\li \l{Managing C++ Backend Objects}
\endlist
\li \l {Adding States}
\endlist \endlist
\li \l{Adding Connections}
\list
\li \l{Connecting Components to Signals}
\li \l{Adding Bindings Between Properties}
\li \l{Specifying Dynamic Properties}
\li \l{Managing C++ Backend Objects}
\endlist
\li \l {Adding States}
\endlist
\li \l{Editing 3D Scenes}
\list
\li \l {Exporting 3D Assets} \li \l {Exporting 3D Assets}
\list \list
\li \l{Exporting from Blender}{Blender} \li \l{Exporting from Blender}{Blender}
\li \l{Exporting from Maya}{Maya} \li \l{Exporting from Maya}{Maya}
\endlist \endlist
\li \l{Importing 3D Assets} \li \l{Importing 3D Assets}
\li \l{Adding 3D Views} \li \l{Exporting Components}
\li \l{Using 3D Components} \endlist
\list \li \l{Motion Design}
\li \l{Setting Group Properties} \list
\li \l{Adding 3D Models} \li \l{Introduction to Animation Techniques}
\li \l{Using Materials and Shaders} \li \l{Creating Animations}
\li \l{Attaching Textures to Materials} \li \l{Editing Easing Curves}
\li \l{Using 3D Materials} \endlist
\li \l{Applying 3D Effects}
\li \l{Using Custom Shaders}
\li \l{Creating Custom Effects and Materials}
\li \l{Using Lights}
\li \l{Using Scene Camera}
\li \l{Setting Scene Environment}
\endlist
\endlist
\li \l {Browsing ISO 7000 Icons} \li \l {Browsing ISO 7000 Icons}
\li \l {Using QML Modules with Plugins}
\li \l {Converting UI Projects to Applications} \li \l {Converting UI Projects to Applications}
\li \l {Exporting Components}
\endlist \endlist
\li \l{Developing Widget Based Applications} \li \l{Developing Widget Based Applications}
\list \list
\li \l{Adding Qt Designer Plugins} \li \l{Adding Qt Designer Plugins}
\endlist \endlist
\li \l {Best Practices} \li \l{Optimizing Applications for Mobile Devices}
\list
\li \l{Optimizing Applications for Mobile Devices}
\endlist
\endlist \endlist
\li \l{Coding} \li \l{Coding}
\list \list
@@ -247,7 +235,7 @@
\endlist \endlist
\li \l{Building and Running} \li \l{Building and Running}
\list \list
\li \l{Previewing} \li \l{Validating with Target Hardware}
\list \list
\li \l{Previewing on Desktop} \li \l{Previewing on Desktop}
\li \l{Previewing on Devices} \li \l{Previewing on Devices}

View File

@@ -96,7 +96,7 @@
\row \row
\li \b {\l{Building and Running}} \li \b {\l{Building and Running}}
\list \list
\li \l{Previewing} \li \l{Validating with Target Hardware}
\li \l{Building for Multiple Platforms} \li \l{Building for Multiple Platforms}
\li \l{Running on Multiple Platforms} \li \l{Running on Multiple Platforms}
\li \l{Deploying to Devices} \li \l{Deploying to Devices}

View File

@@ -49,17 +49,26 @@
\li \l {Wireframing} \li \l {Wireframing}
Qt Quick enables you to build UIs around the behavior of Plan your UI properly. Know what elements, such as screens,
\e components and how they connect with one another. You components, and states, you need. Create a descriptive wireframe
create components using Qt Quick and QML types that are and acquire a detailed UI specification before you start to make
available in the Design mode, manage their relationships, the process of creating the UI more efficient.
and specify their properties.
\li \l {Adding Dynamics} \li \l {Prototyping}
You can animate the properties of UI components and create After your UI wireframe has been approved, you can turn it into
connections between them to enable them to communicate with an interactive prototype to ensure that you and the developers
each other. share a common vision about the UI appearance and functionality.
\li \l{Motion Design}
After the wireframing and prototyping phases, you can use the
supported motion design techniques to fine-tune your UI for
production. You can use different animation techniques for
different purposes. \QC supports common motion design techniques,
such as timeline and keyframe based animation and easing curves,
as well as screen-to-screen or state-to-state application flows
and data-driven UI logic animation.
\endlist \endlist

View File

@@ -24,7 +24,7 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage quick-property-bindings.html \previouspage quick-dynamic-properties.html
\page quick-connections-backend.html \page quick-connections-backend.html
\nextpage quick-states.html \nextpage quick-states.html

View File

@@ -26,7 +26,7 @@
/*! /*!
\page qtquick-iso-icon-browser.html \page qtquick-iso-icon-browser.html
\previouspage studio-3d-scene-environment.html \previouspage studio-3d-scene-environment.html
\nextpage creator-qml-modules-with-plugins.html \nextpage quick-converting-ui-projects.html
\title Browsing ISO 7000 Icons \title Browsing ISO 7000 Icons

View File

@@ -39,9 +39,10 @@
\image qmldesigner-states-when-condition.png \image qmldesigner-states-when-condition.png
If you add animation to the states, you can \l{Previewing}{preview} If you add animation to the states, you can
or \l{Running on Multiple Platforms}{run} the application to test \l{Validating with Target Hardware}{preview}
the animation. or \l{Running on Multiple Platforms}{run}
the application to test the animation.
//! [scxml state machines] //! [scxml state machines]
*/ */

View File

@@ -27,7 +27,7 @@
\previouspage creator-live-preview-devices.html \previouspage creator-live-preview-devices.html
\page qt-design-viewer.html \page qt-design-viewer.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\nextpage studio-advanced.html \nextpage studio-exporting-and-importing.html
\else \else
\nextpage creator-building-targets.html \nextpage creator-building-targets.html
\endif \endif

View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2020 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of the Qt Design Studio documentation. ** This file is part of the Qt Design Studio documentation.
@@ -25,16 +25,19 @@
/*! /*!
\page studio-simulation-overview.html \page studio-simulation-overview.html
\previouspage creator-editor-options-text.html \previouspage qtquick-creating-ui-logic.html
\nextpage qtquick-placeholder-data.html \nextpage qtquick-placeholder-data.html
\title Simulating Data Input \title Simulating Complex Experiences
\QDS enables you to connect UIs to different forms of data from various \QDS enables you to connect UIs to different forms of data from various
sources, such as QML-based data models, JavaScript files, and backend sources, such as QML-based data models, JavaScript files, and backend
services. You can also connect your UI to Simulink to load live data from a services.
\if definded(qtdesignstudio)
You can also connect your UI to Simulink to load live data from a
Simulink simulation. Simulink simulation.
\endif
\list \list
\li \l{Loading Placeholder Data} \li \l{Loading Placeholder Data}
@@ -43,6 +46,7 @@
you can test grid, list, or path views, even though you don't you can test grid, list, or path views, even though you don't
have access to real data. have access to real data.
\if defined(qtdesignstudio)
\li \l{Simulating Application Logic} \li \l{Simulating Application Logic}
You can use JavaScript to generate mock data for your UI. You can use JavaScript to generate mock data for your UI.
@@ -52,6 +56,7 @@
Use the Simulink connector to connect a Simulink Simulation Model to Use the Simulink connector to connect a Simulink Simulation Model to
your UI. Simulink is a MATLAB-based graphical programming environment your UI. Simulink is a MATLAB-based graphical programming environment
for modeling, simulating, and analyzing multi-domain dynamic systems. for modeling, simulating, and analyzing multi-domain dynamic systems.
\endif
\li \l{Using QML Modules with Plugins} \li \l{Using QML Modules with Plugins}

View File

@@ -25,22 +25,16 @@
/*! /*!
\page qtquick-adding-dynamics.html \page qtquick-adding-dynamics.html
\previouspage creator-quick-ui-forms.html \previouspage creator-qml-modules-with-plugins.html
\nextpage studio-timeline.html \nextpage qmldesigner-connections.html
\title Adding Dynamics \title Dynamic Behaviors
You can animate the properties of UI components and create connections Create connections between components to enable them to communicate with
between them to enable them to communicate with each other. each other. The connections can be triggered by signals that are emitted
when the values of other components or the UI state change.
\list \list
\li \l {Creating Animations}
You can use a timeline and keyframe based editor in the
\uicontrol Timeline view to animate the properties of UI
components. Animating properties enables their values to
move through intermediate values at specified keyframes
instead of immediately changing to the target value.
\li \l {Adding Connections} \li \l {Adding Connections}
You can create connections between the UI components and You can create connections between the UI components and

View File

@@ -202,7 +202,7 @@
decreased from the backend, it moves the needle animation from one decreased from the backend, it moves the needle animation from one
end of the timeline to the other. end of the timeline to the other.
For more information, see \l{Simulating Data Input}. For more information, see \l{Simulating Complex Experiences}.
\section2 Programmatic Animation \section2 Programmatic Animation

View File

@@ -27,10 +27,11 @@
\page qtquick-annotations.html \page qtquick-annotations.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage qtquick-positioning.html \previouspage qtquick-positioning.html
\nextpage qtquick-prototyping.html
\else \else
\previouspage qtquick-fonts.html \previouspage qtquick-fonts.html
\nextpage qtquick-ui-forms.html
\endif \endif
\nextpage qtquick-placeholder-data.html
\title Annotating Designs \title Annotating Designs

View File

@@ -90,10 +90,10 @@
instead of duplicating them, so the components do not need to be instead of duplicating them, so the components do not need to be
processed as completely new component types. This reduces loading processed as completely new component types. This reduces loading
and compilation time as well as the size of the binary. and compilation time as well as the size of the binary.
\li Any content that is data-driven should be \li Any content that is data-driven should be exported as a public
\l {Using UI Files}{exported as a public property} of the property (alias property) of the relevant component. For example,
relevant component. For example, a speedometer should have an \c int a speedometer should have an \c int or \c real property for speed
or \c real property for speed to which the UI is bound. to which the UI is bound.
\li Separate UI from the application logic. Designers should work with \li Separate UI from the application logic. Designers should work with
the \l{UI Files}{UI files} (.ui.qml), while developers should work the \l{UI Files}{UI files} (.ui.qml), while developers should work
on the corresponding implementation files (.qml) to define their on the corresponding implementation files (.qml) to define their

View File

@@ -24,8 +24,8 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage qtquick-editing-easing-curves.html
\page qmldesigner-connections.html \page qmldesigner-connections.html
\previouspage qtquick-adding-dynamics.html
\nextpage quick-signals.html \nextpage quick-signals.html
\title Adding Connections \title Adding Connections

View File

@@ -188,7 +188,7 @@
or the entire UI. The changes you make to the UI are instantly or the entire UI. The changes you make to the UI are instantly
visible to you in the preview. visible to you in the preview.
\li \key Alt+P (\key Opt+P on \macos) \li \key Alt+P (\key Opt+P on \macos)
\li \l{Previewing} \li \l{Validating with Target Hardware}
\row \row
\li Preview size \li Preview size
\li Displays the size of the preview dialog as a percentage. You can \li Displays the size of the preview dialog as a percentage. You can

View File

@@ -25,13 +25,8 @@
/*! /*!
\page creator-exporting-qml.html \page creator-exporting-qml.html
\if defined(qtdesignstudio)
\previouspage studio-importing-3d.html \previouspage studio-importing-3d.html
\nextpage quick-uis.html \nextpage qtquick-motion-design.html
\else
\previouspage quick-converting-ui-projects.html
\nextpage creator-using-qt-designer.html
\endif
\title Exporting Components \title Exporting Components

View File

@@ -24,9 +24,14 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage qtquick-positioning.html
\page qtquick-fonts.html \page qtquick-fonts.html
\if defined{qtdesignstudio}
\previouspage studio-importing-2d.html
\nextpage studio-importing-3d.html
\else
\previouspage qtquick-positioning.html
\nextpage qtquick-annotations.html \nextpage qtquick-annotations.html
\endif
\title Using Custom Fonts \title Using Custom Fonts

View File

@@ -26,11 +26,12 @@
/*! /*!
\page quick-converting-ui-projects.html \page quick-converting-ui-projects.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage studio-importing-3d.html \previouspage creator-vcs-git.html
\nextpage creator-editor-external.html
\else \else
\previouspage creator-qml-modules-with-plugins.html \previouspage qtquick-iso-icon-browser.html
\nextpage creator-using-qt-designer.html
\endif \endif
\nextpage creator-exporting-qml.html
\title Converting UI Projects to Applications \title Converting UI Projects to Applications

View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of the Qt Design Studio documentation. ** This file is part of the Qt Design Studio documentation.
@@ -24,17 +24,13 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\if defined(qtdesignstudio)
\previouspage studio-3d-camera.html
\else
\previouspage creator-building-running.html
\endif
\page creator-live-preview.html \page creator-live-preview.html
\previouspage quick-states.html
\nextpage creator-live-preview-desktop.html \nextpage creator-live-preview-desktop.html
\title Previewing \title Validating with Target Hardware
You can use the QML live preview to preview a QML file or the entire You can use the live preview feature to preview a UI file or the entire
UI on the desktop, as well as on Android and embedded Linux UI on the desktop, as well as on Android and embedded Linux
devices. The changes you make to the UI are instantly visible devices. The changes you make to the UI are instantly visible
to you in the preview. to you in the preview.

View File

@@ -33,11 +33,10 @@
\page creator-qml-modules-with-plugins.html \page creator-qml-modules-with-plugins.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage studio-simulink.html \previouspage studio-simulink.html
\nextpage studio-debugging.html
\else \else
\previouspage qtquick-iso-icon-browser.html \previouspage qtquick-placeholder-data.html
\nextpage quick-converting-ui-projects.html
\endif \endif
\nextpage qtquick-adding-dynamics.html
\title Using QML Modules with Plugins \title Using QML Modules with Plugins

View File

@@ -25,6 +25,7 @@
/*! /*!
\page qtquick-motion-design.html \page qtquick-motion-design.html
\previouspage creator-exporting-qml.html
\nextpage quick-animation-overview.html \nextpage quick-animation-overview.html
\title Motion Design \title Motion Design
@@ -39,6 +40,14 @@
Learn more about which animation techniques are supported by \QDS Learn more about which animation techniques are supported by \QDS
and the use cases they are most suitable for. and the use cases they are most suitable for.
\li \l {Creating Animations}
You can use a timeline and keyframe based editor in the
\uicontrol Timeline view to animate the properties of UI
components. Animating properties enables their values to
move through intermediate values at specified keyframes
instead of immediately changing to the target value.
\li Production Quality (TODO) \li Production Quality (TODO)
After the wireframing and prototyping phases, you can use the After the wireframing and prototyping phases, you can use the

View File

@@ -25,12 +25,12 @@
/*! /*!
\page qtquick-placeholder-data.html \page qtquick-placeholder-data.html
\if defined(qtdesignstudio)
\previouspage studio-simulation-overview.html \previouspage studio-simulation-overview.html
\if defined(qtdesignstudio)
\nextpage studio-javascript.html \nextpage studio-javascript.html
\else \else
\previouspage qtquick-annotations.html \nextpage creator-qml-modules-with-plugins.html
\nextpage creator-quick-ui-forms.html
\endif \endif
\title Loading Placeholder Data \title Loading Placeholder Data

View File

@@ -0,0 +1,109 @@
/****************************************************************************
**
** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Design Studio documentation.
**
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see https://www.qt.io/terms-conditions. For further
** information use the contact form at https://www.qt.io/contact-us.
**
** GNU Free Documentation License Usage
** Alternatively, this file may be used under the terms of the GNU Free
** Documentation License version 1.3 as published by the Free Software
** Foundation and appearing in the file included in the packaging of
** this file. Please review the following information to ensure
** the GNU Free Documentation License version 1.3 requirements
** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
**
****************************************************************************/
/*!
\page qtquick-prototyping.html
\if defined(qtdesignstudio)
\previouspage qtquick-annotations.html
\else
\previouspage creator-quick-ui-forms.html
\endif
\nextpage qtquick-creating-ui-logic.html
\title Prototyping
\table
\row
\li \image studio-3d-scenes.png
\li After your UI wireframe has been approved, you can turn it
into an interactive prototype to ensure that you and the
developers share a common vision about the UI appearance
and functionality. You can create the UI logic to simulate
complex experiences and add dynamic behavior. You can then
validate your design on desktop, embedded, and mobile device
platforms. In the prototyping phase, you can also import
assets from 2D and 3D content creation tools to bring your
prototype closer to the final UI.
\endtable
\list
\li \l {Creating UI Logic}
You can turn your wireframe into an interactive prototype by
adding the logic that enables your components to apply actions
or react to mock data from backend systems to simulate complex
experiences.
\li \l{Simulating Complex Experiences}
You can connect UIs to different forms of data from various
sources, such as QML-based data models, JavaScript files, and
backend services.
\if defined(qtdesignstudio)
You can also connect your UI to Simulink to load live data from
a Simulink simulation.
\endif
\li \l {Dynamic Behaviors}
You can create connections between components to enable them to
communicate with each other. The connections can be triggered by
changes in component property values or in UI states.
\if defined(qtdesignstudio)
\li \l {Validating with Target Hardware}
You can use the live preview feature to preview a UI file or the
entire UI on the desktop, as well as on Android and embedded Linux
devices. The changes you make to the UI are instantly visible
to you in the preview.
\li \l {Asset Creation with Other Tools}
Describes how to export designs containing 2D and 3D assets into
files that you can import to projects in \QDS, how to import them,
and how to export them from \QDS back to the metadata format.
\else
\li \l {Exporting 3D Assets}
You can export assets from 3D graphics applications into several
widely-used formats, such as .blend, .dae, .fbx, .glb, .gltf, .obj,
.uia, or .uip.
\li \l {Importing 3D Assets}
You can import exported assets into \QC. For a list of formats
supported by each \l{Qt Quick 3D} version, see the module
documentation.
\li \l {Exporting Components}
You can export components contained in \l{UI Files}{UI files}
(.ui.qml) to JSON metadata format and PNG assets.
\endif
\endlist
*/

View File

@@ -26,10 +26,10 @@
/*! /*!
\page quick-states.html \page quick-states.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage quick-property-bindings.html \previouspage quick-dynamic-properties.html
\nextpage creator-live-preview.html \nextpage creator-live-preview.html
\else \else
\previouspage qtbridge-figma-using.html \previouspage quick-connections-backend.html
\nextpage exporting-3d-assets.html \nextpage exporting-3d-assets.html
\endif \endif

View File

@@ -33,10 +33,11 @@
\page creator-quick-ui-forms.html \page creator-quick-ui-forms.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage qtquick-annotations.html \previouspage qtquick-annotations.html
\nextpage creator-telemetry.html
\else \else
\previouspage qtquick-placeholder-data.html \previouspage qtquick-annotations.html
\nextpage qtquick-prototyping.html
\endif \endif
\nextpage qtquick-adding-dynamics.html
\title UI Files \title UI Files

View File

@@ -216,7 +216,8 @@
100. When all our progress bar instances have been animated, we'll continue 100. When all our progress bar instances have been animated, we'll continue
by specifying easing curves for them. by specifying easing curves for them.
For more information about previewing UIs, see \l {Previewing}. For more information about previewing UIs, see
\l {Validating with Target Hardware}.
\section1 Specifying Easing Curves \section1 Specifying Easing Curves

View File

@@ -24,7 +24,7 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage studio-getting-started.html \previouspage studio-exporting-and-importing.html
\page qtbridge-overview.html \page qtbridge-overview.html
\nextpage qtbridge-ai.html \nextpage qtbridge-ai.html

View File

@@ -43,15 +43,13 @@
it mainly from the keyboard. it mainly from the keyboard.
\list \list
\li \l{Supported Platforms}
You can install and run \QC on several operating systems to design
UIs for multiple desktop, embedded, and mobile device platforms.
\li \l{UI Files} \li \l{UI Files}
Some of the wizards create projects that contain UI files Some of the wizards create projects that contain UI files
(.ui.qml). You should always edit UI files in \l{Form Editor} (.ui.qml). You should always edit UI files in \l{Form Editor}
and \l Properties, to avoid breaking the code. and \l Properties, to avoid breaking the code.
\li \l{Coding} \li \l{Coding}
You can use the code editor in the \uicontrol {Text Editor} view or You can use the code editor in the \uicontrol {Text Editor} view or
@@ -59,12 +57,6 @@
the QML language as code, not just as plain text. This enables it the QML language as code, not just as plain text. This enables it
to provide you with useful features, such as semantic highlighting, to provide you with useful features, such as semantic highlighting,
checking code syntax, code completion, and refactoring actions. checking code syntax, code completion, and refactoring actions.
\li \l{Simulating Data Input}
\QDS enables you to connect UIs to different forms of data from various
sources, such as QML-based data models, JavaScript files, and backend
services. You can also connect your UI to Simulink to load live data from a
Simulink simulation.
\li \l{Debugging and Profiling} \li \l{Debugging and Profiling}
\QDS comes with a JavaScript debugger. In the Debug mode, you \QDS comes with a JavaScript debugger. In the Debug mode, you

View File

@@ -24,11 +24,11 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage studio-getting-started.html \previouspage qt-design-viewer.html
\page studio-exporting-and-importing.html \page studio-exporting-and-importing.html
\nextpage qtbridge-overview.html \nextpage qtbridge-overview.html
\title Exporting and Importing \title Asset Creation with Other Tools
Typically, you as a designer would design a UI using imaging and design Typically, you as a designer would design a UI using imaging and design
tools, such as Adobe Photoshop, Sketch, Figma, Blender, or Maya, and then tools, such as Adobe Photoshop, Sketch, Figma, Blender, or Maya, and then
@@ -66,8 +66,8 @@
\li Animate your design in \l {Transition Editor} or \l Timeline \li Animate your design in \l {Transition Editor} or \l Timeline
and \l {Curve Editor}. and \l {Curve Editor}.
\li Create interactions in \l States and \l {Connection View}. \li Create interactions in \l States and \l {Connection View}.
\li \l{Previewing}{Preview} your design in real time, on the desktop \li \l{Validating with Target Hardware}{Preview} your design in
or on a mobile or an embedded device. real time, on the desktop or on a mobile or an embedded device.
\li Optionally, export your components back into the metadata format \li Optionally, export your components back into the metadata format
that you can import back into the design tool by using \QB. You that you can import back into the design tool by using \QB. You
can continue to iterate your design this way until it is ready. can continue to iterate your design this way until it is ready.

View File

@@ -43,8 +43,10 @@
Contains answers to some frequently asked questions about \QDS. Contains answers to some frequently asked questions about \QDS.
\li \l{Supported Platforms}
You can install and run \QC on several operating systems to design
UIs for multiple desktop, embedded, and mobile device platforms.
\endlist \endlist
*/ */

View File

@@ -26,7 +26,7 @@
/*! /*!
\previouspage studio-importing-designs.html \previouspage studio-importing-designs.html
\page studio-importing-2d.html \page studio-importing-2d.html
\nextpage studio-importing-3d.html \nextpage qtquick-fonts.html
\title Importing 2D Assets \title Importing 2D Assets

View File

@@ -60,7 +60,7 @@
Because the projects do not contain any C++ code, you do not need Because the projects do not contain any C++ code, you do not need
to build them. To test how well your designs work, you can preview the to build them. To test how well your designs work, you can preview the
UIs on the desktop or embedded Linux devices. For more UIs on the desktop or embedded Linux devices. For more
information, see \l{Previewing}. information, see \l{Validating with Target Hardware}.
\image studio-project-wizards.png "A list of project wizards" \image studio-project-wizards.png "A list of project wizards"

View File

@@ -111,22 +111,18 @@
\li \l{Scalable Layouts} \li \l{Scalable Layouts}
\li \l{Annotating Designs} \li \l{Annotating Designs}
\endlist \endlist
\li \l{Prototyping} (NEW) \li \l{Prototyping}
\list \list
\li Creating UI Logic \li \l{Creating UI Logic}
\li \l{Simulating Data Input}{Simulating Complex Experiences} \li \l{Simulating Complex Experiences}
\list \list
\li \l{Loading Placeholder Data} \li \l{Loading Placeholder Data}
\li \l{Simulating Application Logic} \li \l{Simulating Application Logic}
\li \l{Simulating Dynamic Systems} \li \l{Simulating Dynamic Systems}
\li \l{Using QML Modules with Plugins} \li \l{Using QML Modules with Plugins}
\endlist \endlist
\li \l{Adding Dynamics}{Dynamic Behaviors} \li \l{Dynamic Behaviors}
\list \list
\li \l{Creating Animations}
\list
\li \l{Editing Easing Curves}
\endlist
\li \l{Adding Connections} \li \l{Adding Connections}
\list \list
\li\l{Connecting Components to Signals} \li\l{Connecting Components to Signals}
@@ -135,34 +131,34 @@
\endlist \endlist
\li \l{Adding States} \li \l{Adding States}
\endlist \endlist
\li \l{Previewing}{Validating with Target Hardware} \li \l{Validating with Target Hardware}
\list \list
\li \l{Previewing on Desktop} \li \l{Previewing on Desktop}
\li \l{Previewing on Devices} \li \l{Previewing on Devices}
\li \l{Previewing in Browsers} \li \l{Previewing in Browsers}
\endlist \endlist
\li \l {Exporting and Importing}{Asset Creation with Other Tools} \li \l {Asset Creation with Other Tools}
\list \list
\li \l{Exporting from Design Tools} \li \l{Exporting from Design Tools}
\li \l{Exporting 2D Assets} (NEW) \li \l{Exporting 2D Assets} (NEW)
\list \list
\li \l{Exporting Designs from Adobe Illustrator} \li \l{Exporting Designs from Adobe Illustrator}
\li \l{Exporting Designs from Adobe Photoshop} \li \l{Exporting Designs from Adobe Photoshop}
\list \list
\li \l{Setting Up Qt Bridge for Adobe Photoshop} \li \l{Setting Up Qt Bridge for Adobe Photoshop}
\li \l{Using Qt Bridge for Adobe Photoshop} \li \l{Using Qt Bridge for Adobe Photoshop}
\endlist \endlist
\li \l{Exporting Designs from Sketch} \li \l{Exporting Designs from Sketch}
\list \list
\li \l{Setting Up Qt Bridge for Sketch} \li \l{Setting Up Qt Bridge for Sketch}
\li \l{Using Qt Bridge for Sketch} \li \l{Using Qt Bridge for Sketch}
\endlist \endlist
\li \l{Exporting Designs from Figma} \li \l{Exporting Designs from Figma}
\list \list
\li \l{Setting Up Qt Bridge for Figma} \li \l{Setting Up Qt Bridge for Figma}
\li \l{Using Qt Bridge for Figma} \li \l{Using Qt Bridge for Figma}
\endlist \endlist
\endlist \endlist
\li \l {Exporting 3D Assets} \li \l {Exporting 3D Assets}
\list \list
\li \l{Exporting from Blender} \li \l{Exporting from Blender}
@@ -178,12 +174,13 @@
\li \l{Importing 3D Assets} \li \l{Importing 3D Assets}
\endlist \endlist
\li \l{Exporting Components} \li \l{Exporting Components}
\li \l{To and from Qt Creator} (designer-developer workflow)
\endlist \endlist
\endlist \endlist
\li \l{Motion Design} \li \l{Motion Design}
\list \list
\li \l{Introduction to Animation Techniques} \li \l{Introduction to Animation Techniques}
\li \l{Creating Animations}
\li \l{Editing Easing Curves}
\li \l{Production Quality} (NEW) \li \l{Production Quality} (NEW)
\list \list
\li \l{Detailed Motion Design} (NEW) \li \l{Detailed Motion Design} (NEW)

View File

@@ -61,7 +61,7 @@
\row \row
\li \l{Wireframing} \li \l{Wireframing}
\li \l{Prototyping} \li \l{Prototyping}
\li \l{Exporting and Importing} \li \l{Asset Creation with Other Tools}
\li \l{Implementing Applications} \li \l{Implementing Applications}
\endtable \endtable
*/ */

View File

@@ -63,19 +63,21 @@
\li \l{Scalable Layouts} \li \l{Scalable Layouts}
\li \l{Annotating Designs} \li \l{Annotating Designs}
\endlist \endlist
\li \b {\l{Prototyping}} (NEW) \li \b {\l{Prototyping}}
\list \list
\li Creating UI Logic \li \l{Creating UI Logic}
\li \l{Simulating Data Input}{Simulating Complex Experiences} \li \l{Simulating Complex Experiences}
\li \l{Adding Dynamics}{Dynamic Behaviors} \li \l{Dynamic Behaviors}
\li \l{Previewing}{Validating with Target Hardware} \li \l{Validating with Target Hardware}
\li \l{Exporting and Importing}{Asset Creation with Other Tools} \li \l{Asset Creation with Other Tools}
\endlist \endlist
\li \b {\l{Motion Design}} \li \b {\l{Motion Design}}
\list \list
\li \l{Introduction to Animation Techniques} \li \l{Introduction to Animation Techniques}
\li \l{Creating Animations}
\li \l{Editing Easing Curves}
\li \l{Production Quality} (NEW) \li \l{Production Quality} (NEW)
\li \l{Importing for Content Creation Tools} \li \l{Importing from Content Creation Tools}
\li \l{Optimizing for Target Hardware} (NEW) \li \l{Optimizing for Target Hardware} (NEW)
\endlist \endlist
\row \row
@@ -112,7 +114,7 @@
\row \row
\li {4,1} \note To report bugs and suggestions to the \li {4,1} \note To report bugs and suggestions to the
\l{https://bugreports.qt.io/}{Qt Project Bug Tracker}, \l{https://bugreports.qt.io/}{Qt Project Bug Tracker},
select \uicontrol {Help > Report Bug} in QDS. select \uicontrol {Help > Report Bug} in \QDS.
To copy and paste detailed information about your system to the To copy and paste detailed information about your system to the
bug report, select \uicontrol Help > bug report, select \uicontrol Help >
\uicontrol {System Information}. \uicontrol {System Information}.

View File

@@ -29,7 +29,7 @@
/*! /*!
\page exporting-3d-assets.html \page exporting-3d-assets.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage \previouspage figmaqtbridge.html
\else \else
\previouspage quick-states.html \previouspage quick-states.html
\endif \endif
@@ -37,6 +37,17 @@
\title Exporting 3D Assets \title Exporting 3D Assets
\if defined(qtcreator)
\table
\row
\li \inlineimage blender-logo.png
\li \inlineimage maya-logo.png
\row
\li \l{Exporting from Blender}{Blender}
\li \l{Exporting from Maya}{Maya}
\endtable
\endif
You can import files you created using 3D graphics applications and exported You can import files you created using 3D graphics applications and exported
to several widely-used formats, such as .blend, .dae, .fbx, .glb, .gltf, to several widely-used formats, such as .blend, .dae, .fbx, .glb, .gltf,
.obj, .uia, or .uip. For a list of formats supported by each \l{Qt Quick 3D} .obj, .uia, or .uip. For a list of formats supported by each \l{Qt Quick 3D}

View File

@@ -28,7 +28,12 @@
/*! /*!
\page exporting-from-qt3ds.html \page exporting-from-qt3ds.html
\previouspage exporting-from-maya.html \previouspage exporting-from-maya.html
\if defined(qtdesignstudio)
\nextpage studio-importing-designs.html \nextpage studio-importing-designs.html
\else
\nextpage studio-importing-3d.html
\endif
\title Exporting from Qt 3D Studio \title Exporting from Qt 3D Studio
Use the following guidelines to achieve the best results when converting Use the following guidelines to achieve the best results when converting

View File

@@ -26,12 +26,11 @@
/*! /*!
\page studio-importing-3d.html \page studio-importing-3d.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage studio-importing-2d.html \previouspage qtquick-fonts.html
\nextpage creator-exporting-qml.html
\else \else
\previouspage exporting-from-maya.html \previouspage exporting-from-maya.html
\nextpage studio-3d-view.html
\endif \endif
\nextpage creator-exporting-qml.html
\title Importing 3D Assets \title Importing 3D Assets