forked from qt-creator/qt-creator
Doc: export to QML scripts
Reviewed-by: jbache
This commit is contained in:
Leena Miettinen
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 122 KiB |
+143
-1
@@ -106,6 +106,7 @@
|
||||
\o \l {Creating Screens}
|
||||
\o \l {Animating Screens}
|
||||
\o \l {Adding User Interaction Methods}
|
||||
\o \l {Exporting Designs from Graphics Software}
|
||||
\o \l {Implementing Application Logic}
|
||||
\endlist
|
||||
\o \l{Developing Widget Based Applications}
|
||||
@@ -7399,6 +7400,7 @@
|
||||
\o \l {Creating Screens}
|
||||
\o \l {Animating Screens}
|
||||
\o \l {Adding User Interaction Methods}
|
||||
\o \l {Exporting Designs from Graphics Software}
|
||||
\o \l {Implementing Application Logic}
|
||||
|
||||
\endlist
|
||||
@@ -8065,7 +8067,7 @@
|
||||
\contentspage index.html
|
||||
\previouspage quick-animations.html
|
||||
\page quick-user-interaction.html
|
||||
\nextpage quick-application-logic.html
|
||||
\nextpage quick-export-to-qml.html
|
||||
|
||||
\title Adding User Interaction Methods
|
||||
|
||||
@@ -8092,6 +8094,146 @@
|
||||
|
||||
\contentspage index.html
|
||||
\previouspage quick-user-interaction.html
|
||||
\page quick-export-to-qml.html
|
||||
\nextpage quick-application-logic.html
|
||||
|
||||
\title Exporting Designs from Graphics Software
|
||||
|
||||
You can export designs from graphics software, such as Adobe Photoshop and GIMP,
|
||||
to QML files. Each scene is converted into a single QML file with an Image or a
|
||||
Text element for each layer and saved on the development PC. Top-level layer
|
||||
groups are converted into merged QML Image elements.
|
||||
|
||||
Note: GIMP does not support grouping, and therefore, each layer is exported as
|
||||
an item in GIMP.
|
||||
|
||||
The following rules apply to the conversions:
|
||||
|
||||
\list
|
||||
|
||||
\o Layer names are used as element names. Spaces and hash marks (#) are
|
||||
replaced with underscore characters to create valid ids for the elements.
|
||||
|
||||
\o Layer styles, such as drop shadows, are converted to images.
|
||||
|
||||
\o Offset, size, ordering and opacity are preserved.
|
||||
|
||||
\o Text layers are converted to Text elements, unless you specify that they
|
||||
be converted to Image elements.
|
||||
|
||||
\o Hidden layers can be exported, and their visibility is set to hidden.
|
||||
|
||||
\o PNG images are copied to the images subirectory.
|
||||
|
||||
\endlist
|
||||
|
||||
You can open the QML file in Qt Creator for editing. If you edit the file in Adobe
|
||||
Photoshop and export it to the same directory again, any changes you made in Qt
|
||||
Creator are overwritten. However, you can re-export graphical assets without
|
||||
recreating the QML code.
|
||||
|
||||
If you create vector graphics with other tools that have an Adobe Photoshop export
|
||||
option,such as Adobe Illustrator, you can export them first to Photoshop and then
|
||||
to QML.
|
||||
|
||||
\section1 Exporting from Adobe Photoshop to QML
|
||||
|
||||
\image qml-export-photoshop.png
|
||||
|
||||
The script has been tested to work on Adobe Photoshop CS 4 and 5, but it might also
|
||||
work on other versions.
|
||||
|
||||
\list 1
|
||||
|
||||
\o Download the export script, \e{Export QML.jx}, from
|
||||
\l{http://qt.gitorious.org/qt-labs/photoshop-qmlexporter/trees/master}{Gitorious}.
|
||||
|
||||
\note Read the README.txt file in the repository for latest information about
|
||||
the script.
|
||||
|
||||
\o Double-click the export script to add the export command to the \gui Scripts
|
||||
menu. You can also copy the script file to the Adobe Photoshop scripts directory
|
||||
(typically, \c{\Presets\Scripts} in the Photoshop installation directory).
|
||||
|
||||
\o In Adobe Photoshop, choose \gui {File > Scripts > Export to QML} to export the
|
||||
scene to a QML file.
|
||||
|
||||
\o In the \gui {Export Document to QML} dialog, enter a name and location for the
|
||||
QML file.
|
||||
|
||||
\o Select the \gui {Rasterize text} check box to export text layers as images,
|
||||
not as Text elements.
|
||||
|
||||
\o Select the \gui {Group layers} check box to export each top-level group as a
|
||||
merged QML Image element.
|
||||
|
||||
\o Select the \gui {Export hidden} check box to export hidden layers and to set
|
||||
their visibility property to hidden.
|
||||
|
||||
\o Deselect the \gui {Export QML} check box if you have modified the QML document
|
||||
in Qt Creator, but still want to re-export graphical assets.
|
||||
|
||||
\o Click \gui Export.
|
||||
|
||||
\endlist
|
||||
|
||||
The QML file is saved to the location that you specified.
|
||||
In Qt Creator, choose \gui {File > Open File or Project} to open the QML file.
|
||||
|
||||
\note Existing files are replaced without warning.
|
||||
|
||||
\section1 Exporting from GIMP to QML
|
||||
|
||||
\image qml-export-gimp.png
|
||||
|
||||
The script has been tested to work on GIMP 2. You can download GIMP 2 from
|
||||
\l{http://www.gimp.org/downloads/}{GIMP Downloads}.
|
||||
|
||||
To use the export script on Microsoft Windows, you also need to install the
|
||||
GIMP Python extension (Python, PyCairo, PyGobject, PyGTK). However, GIMP is
|
||||
not officially supported on Windows, so we cannot guarantee that this will
|
||||
work.
|
||||
|
||||
\list 1
|
||||
|
||||
\o On Microsoft Windows, you must first add Python support to your GIMP
|
||||
installation, as instructed in
|
||||
\l {http://www.gimpusers.com/tutorials/install-python-for-gimp-2-6-windows}{Tutorial: Installing Python for GIMP 2.6 (Windows)}.
|
||||
|
||||
\o Download the export script, \e qmlexporter.py, from
|
||||
\l{http://qt.gitorious.org/qt-labs/gimp-qmlexporter/trees/master}{Gitorious}.
|
||||
|
||||
\note Read the INSTALL.txt in the repository for latest information about the
|
||||
script.
|
||||
|
||||
\o Copy the export script to the plug-ins directory in the GIMP installation
|
||||
directory.
|
||||
|
||||
\o Check the properties of the file to make sure that it is executable.
|
||||
|
||||
On Linux, run the following command: \c {chmod u+rx}
|
||||
|
||||
\o Restart GIMP to have the export command added to the \gui File menu.
|
||||
|
||||
\o Choose \gui {File > Export to QML} to export the design to a QML file.
|
||||
|
||||
\o In the \gui {Export Layers to a QML Document} dialog, enter a name and
|
||||
location for the QML file, and click \gui Export.
|
||||
|
||||
\endlist
|
||||
|
||||
The QML file is saved to the location that you specified.
|
||||
In Qt Creator, choose \gui {File > Open File or Project} to open the QML file.
|
||||
|
||||
\note Existing files are replaced without warning.
|
||||
|
||||
*/
|
||||
|
||||
|
||||
/*!
|
||||
|
||||
\contentspage index.html
|
||||
\previouspage quick-export-to-qml.html
|
||||
\page quick-application-logic.html
|
||||
\nextpage creator-using-qt-designer.html
|
||||
|
||||
|
||||
Reference in New Issue
Block a user