summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorLeena Miettinen <riitta-leena.miettinen@qt.io>2020-06-26 18:08:55 +0200
committerLeena Miettinen <riitta-leena.miettinen@qt.io>2020-07-01 06:41:16 +0000
commit41a69be36650f0663ca4b263985cdf092174799e (patch)
treec0bf450faf626d45058e802cde04648a9525a79a
parent42b5aa4acac6db0a970418ffdd400966e86ebda9 (diff)
downloadqt-creator-41a69be36650f0663ca4b263985cdf092174799e.tar.gz
Doc: Clarify what happens during export and import with Qt Bridge
Fixes: QDS-2433 Change-Id: Ia30957863c7200eb0438db4e271e5c2be0208637 Reviewed-by: Vikas Pachdha <vikas.pachdha@qt.io>
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-ai.qdoc3
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-overview.qdoc20
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-ps-overview.qdoc12
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc41
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-overview.qdoc10
-rw-r--r--doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-using.qdoc31
6 files changed, 63 insertions, 54 deletions
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-ai.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-ai.qdoc
index c40b845742..4d870c8497 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-ai.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-ai.qdoc
@@ -36,7 +36,8 @@
\list
\li Place your Illustrator content into Adobe Photoshop and
- use \QBPS to export the assets to .ui.qml files.
+ use \QBPS to export the assets to \e {.metadata} format that
+ you can import to \QDS.
\li Use the Illustrator \e {export for screens workflow} to export your
assets into formats supported by \QDS, such as PNG and JPEG.
\endlist
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-overview.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-overview.qdoc
index 4fc6d2eefb..58e782c2ae 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-overview.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-overview.qdoc
@@ -30,13 +30,17 @@
\title Exporting Artwork from Design Tools
- You need to use \QB to first export 2D assets from design tools and then
- import them. When working with 3D assets, you can use the export functions
- provided by the 3D graphics tools to save the assets in widely-used 3D
- graphics formats, and then use \QB to import them. You can download \QB
- from the \l{https://marketplace.qt.io/}{Qt Marketplace}.
+ You need to use \QB to first export 2D assets from design tools and then use
+ \QB to \l{Importing Designs}{import} them into \QDS.
- For best results when importing 3D assets, follow
+ When working with 3D assets, you can use the export functions provided by
+ the 3D graphics tools to save the assets in widely-used 3D graphics formats,
+ and then use \QB to import them into \QDS.
+
+ You can use the Qt online installer to install \QB if you have a license, or
+ download \QB from the \l{https://marketplace.qt.io/}{Qt Marketplace}.
+
+ For best results when importing assets, follow
the guidelines for creating and exporting them.
\list
@@ -50,13 +54,13 @@
\li \l{Exporting Designs from Adobe Photoshop}
You can use the \QBPS export tool in Adobe Photoshop to convert
- artwork into Qt Quick files (.ui.qml) that you can import to
+ artwork into \e {.metadata} format that you can import into
projects in \QDS.
\li \l{Exporting Designs from Sketch}
You can use the \QBSK export tool in Sketch to convert artwork into
- Qt Quick files that you can import to projects in \QDS.
+ metadata that you can import into projects in \QDS.
\li \l{Exporting 3D Assets}
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-overview.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-overview.qdoc
index d6f0b8239c..26eda08a08 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-overview.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-overview.qdoc
@@ -1,6 +1,6 @@
/****************************************************************************
**
-** Copyright (C) 2019 The Qt Company Ltd.
+** Copyright (C) 2020 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Design Studio documentation.
@@ -32,7 +32,8 @@
\title Exporting Designs from Adobe Photoshop
- You can use \QBPS to export designs from Adobe Photoshop to .ui.qml files.
+ You can use \QBPS to export designs from Adobe Photoshop to \e {.metadata}
+ format that you can \l{Importing 2D Assets}{import} to projects in \QDS.
\image studio-ps-export.png
@@ -43,13 +44,12 @@
\li \l{Setting Up Qt Bridge for Adobe Photoshop}
You must install and set up the \QBPS export tool before you can use
- it to convert artwork into Qt Quick files that you can import to
- projects in \QDS.
+ it to export artwork.
\li \l{Using Qt Bridge for Adobe Photoshop}
To get the best results when you use \QBPS to export designs from
- Photoshop to Qt Quick files, you should follow the guidelines for
- working with Photoshop and organizing your assets.
+ Photoshop, you should follow the guidelines for working with
+ Photoshop and organizing your assets.
\endlist
*/
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc
index 61adb5a0ab..ff12226ab4 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-ps-using.qdoc
@@ -33,7 +33,8 @@
\section1 Organizing Assets
To get the best results when you use \QBPS to export designs from Adobe
- Photoshop to \QDS, follow these guidelines when working with Photoshop:
+ Photoshop for importing them to \QDS, follow these guidelines when working
+ with Photoshop:
\list
\li Arrange your art into artboards and organize it into groups and
@@ -55,9 +56,9 @@
when you export designs from Adobe Photoshop and import them into \QDS.
When you use \QBPS to export your designs, you will determine how you want
- each group or layer exported: as a \e component or \e child. A component is
- a single QML file that can contain other assets. A child is a single PNG
- file that you can use within QML files.
+ each group or layer exported: as a \e component or \e child. A component
+ will be imported as a single QML file that can contain other assets. A child
+ will be imported as a single PNG file that you can use within QML files.
If you plan to use pieces of your artwork as separate images in the UI,
group them on an artboard as separate layers. You can then export the group
@@ -74,7 +75,7 @@
Place different parts of the UI, such as menus and pop-ups, on separate
artboards to be able to export them as components or children and to
- import them as QML and PNG files that you can drag and drop to the
+ import them as QML and PNG files that you can drag and drop to
\uicontrol {Form Editor} in \QDS Design mode while creating a UI.
\QDS offers predefined sets of UI controls that you can modify according
@@ -85,12 +86,13 @@
However, if you want your UI controls, such as check boxes, to look exactly
like they do in Photoshop, you have to create the control in an Artboard and
use the artboard in the layers where the control instance is to be created.
- \QB exports the control as a custom QML component that you can program in
+ \QB imports the control as a custom QML component that you can program in
\QDS.
\section1 Exporting Assets
- Each artboard is exported automatically as a component. That is, a separate
+ Each artboard is exported automatically as a component, which means that it
+ will be imported as a separate
QML file that contains all the artwork on the artboard, except layers that
are set to be skipped or exported as child items. You determine how
each group or layer in an artboard is exported: as a component or a child
@@ -147,13 +149,14 @@
\li In the \uicontrol {Export As} field, select the export type for the
group or layer:
\list
- \li \uicontrol Component creates a separate QML file for the
- selected artboard, group, or layer that contains all the
- artwork in it, except layers that are set to be skipped or
- exported as child items.
- \li \uicontrol Child creates a separate PNG file for each asset
- of the selected group or layer, with references to the
- images in the component file.
+ \li \uicontrol Component exports the selected artboard, group,
+ or layer with metadata. The exported data can be used later
+ to import the component as a separate QML file that contains
+ all the artwork in it, except layers that are set to be
+ skipped or exported as child items.
+ \li \uicontrol Child exports each asset of the selected group
+ or layer as a separate PNG file, with references
+ to the images in the component file.
\li \uicontrol Merged merges the selected groups and layers into
the parent as one item.
\li \uicontrol Skipped completely skips the selected layer.
@@ -162,9 +165,9 @@
to reuse. For example, you can use an artboard to define a
component, such as a button, and reuse it in other artboards.
\li In the \uicontrol {QML Type} field, specify the QML type
- or Studio component to morph this layer into. The generated
- component will be of this type. For example, if you drew a
- rectangle, you can export it as a Rectangle Studio component.
+ or Studio component to morph this layer into. The component that is
+ generated during import will be of this type. For example, if you
+ drew a rectangle, you can export it as a Rectangle Studio component.
You can provide the import statement of the module where the QML
type is defined in the \uicontrol {Add Imports} field.
\li In the \uicontrol {Add Imports} field, enter additional
@@ -225,8 +228,8 @@
PSD Document instance. You can undo the temporary changes done in the function
\e preExport(...).
\li customDefaultQmlId(name, instance)
- The function is called for settings the default QML id of the layer. The returned value
- is used for the QML id. Return \e Falsey to use the auto generated QML id instead.
+ The function is called for setting the default QML id of the layer. The returned value
+ is used for the QML id. Return \c false to use the auto generated QML id instead.
The parameter \a name is the auto generated QML id by the plugin and \a instance is the
PSD layer instance.
\endlist
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-overview.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-overview.qdoc
index a897ab044d..a85a247310 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-overview.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-overview.qdoc
@@ -32,7 +32,8 @@
\title Exporting Designs from Sketch
- You can use \QBSK to export designs from Sketch to .ui.qml files.
+ You can use \QBSK to export designs from Sketch to \e {.metadata}
+ format that you can \l{Importing 2D Assets}{import} to projects in \QDS.
\image studio-sketch-export.png
@@ -43,13 +44,12 @@
\li \l{Setting Up Qt Bridge for Sketch}
You must install Sketch and the \QBSK export tool before you can use
- the tool to convert artwork into Qt Quick files that you can import
- to projects in \QDS.
+ the tool to export artwork.
\li \l{Using Qt Bridge for Sketch}
To get the best results when you use \QBSK to export designs from
- Sketch to Qt Quick files, you should follow the guidelines for
- working with Sketch and organizing your assets.
+ Sketch, you should follow the guidelines for working with Sketch and
+ organizing your assets.
\endlist
*/
diff --git a/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-using.qdoc b/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-using.qdoc
index 82b9c0b807..677c1c610e 100644
--- a/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-using.qdoc
+++ b/doc/qtdesignstudio/src/qtbridge/qtbridge-sketch-using.qdoc
@@ -77,10 +77,10 @@
The relationships between artboards and layers are preserved when you export
designs from Sketch and import them into \QDS.
- An artboard can only be exported as a component or skipped. A component is
- a separate QML file that contains all the artwork on the artboard, except
- layers that are set to be skipped or exported as child items. The child
- items can contain graphical assets or text.
+ An artboard can only be exported as a component or skipped. A component will
+ be imported as a separate QML file that contains all the artwork on the
+ artboard, except layers that are set to be skipped or exported as child
+ items. The child items can contain graphical assets or text.
To use the contents of an artboard as a single image in the UI, you can
merge the groups and layers when you export them. During import, the
@@ -149,23 +149,24 @@
\li In the \uicontrol {Export As} field, select the export type for the
group or layer:
\list
- \li \uicontrol Component creates a separate QML file for the
- selected symbol that contains all the artwork in it, except
- layers or groups that are set to be skipped or exported as
- child items.
- \li \uicontrol Child creates a separate file for each asset
- of the selected group or layer, with references to the
- images in the component file. You select the image format
- in the \uicontrol {Asset Format} field.
+ \li \uicontrol Component exports the selected symbol with
+ metadata. The exported data can be used later to import
+ the component as a separate QML file that contains all
+ the artwork in it, except layers or groups that are set
+ to be skipped or exported as child items.
+ \li \uicontrol Child exports each asset of the selected group
+ or layer a separate PNG file, with references
+ to the images in the component file. You select the image
+ format in the \uicontrol {Asset Format} field.
\li \uicontrol Merged merges the selected groups and layers into
the parent artboard or group as one item.
\li \uicontrol Skipped completely skips the selected layer.
\endlist
\li In the \uicontrol {QML Type} field, specify the QML type or
\l {Studio Components}{Qt Quick Studio Component} to morph this
- layer into. The generated component will be of this type. For
- example, if you drew a rectangle, you can export it as a
- \l Rectangle component.
+ layer into. The component that is generated during import will be
+ of this type. For example, if you drew a rectangle, you can export
+ it as a \l Rectangle component.
You can provide the import statement of the module where the QML
type is defined in the \uicontrol {QML Imports} field.
\li In the \uicontrol {QML Imports} field, enter