|
|
|
|
@@ -1,171 +0,0 @@
|
|
|
|
|
/****************************************************************************
|
|
|
|
|
**
|
|
|
|
|
** Copyright (C) 2019 The Qt Company Ltd.
|
|
|
|
|
** Contact: https://www.qt.io/licensing/
|
|
|
|
|
**
|
|
|
|
|
** This file is part of the Qt Creator documentation.
|
|
|
|
|
**
|
|
|
|
|
** Commercial License Usage
|
|
|
|
|
** Licensees holding valid commercial Qt licenses may use this file in
|
|
|
|
|
** accordance with the commercial license agreement provided with the
|
|
|
|
|
** Software or, alternatively, in accordance with the terms contained in
|
|
|
|
|
** a written agreement between you and The Qt Company. For licensing terms
|
|
|
|
|
** and conditions see https://www.qt.io/terms-conditions. For further
|
|
|
|
|
** information use the contact form at https://www.qt.io/contact-us.
|
|
|
|
|
**
|
|
|
|
|
** GNU Free Documentation License Usage
|
|
|
|
|
** Alternatively, this file may be used under the terms of the GNU Free
|
|
|
|
|
** Documentation License version 1.3 as published by the Free Software
|
|
|
|
|
** Foundation and appearing in the file included in the packaging of
|
|
|
|
|
** this file. Please review the following information to ensure
|
|
|
|
|
** the GNU Free Documentation License version 1.3 requirements
|
|
|
|
|
** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
|
|
|
|
|
**
|
|
|
|
|
****************************************************************************/
|
|
|
|
|
|
|
|
|
|
// **********************************************************************
|
|
|
|
|
// NOTE: the sections are not ordered by their logical order to avoid
|
|
|
|
|
// reshuffling the file each time the index order changes (i.e., often).
|
|
|
|
|
// Run the fixnavi.pl script to adjust the links to the index order.
|
|
|
|
|
// **********************************************************************
|
|
|
|
|
|
|
|
|
|
/*!
|
|
|
|
|
|
|
|
|
|
\contentspage index.html
|
|
|
|
|
\previouspage creator-quick-ui-forms.html
|
|
|
|
|
\page quick-export-to-qml.html
|
|
|
|
|
\nextpage creator-qml-modules-with-plugins.html
|
|
|
|
|
|
|
|
|
|
\title Exporting Designs from Graphics Software
|
|
|
|
|
|
|
|
|
|
You can export designs from graphics software, such as Adobe Photoshop and
|
|
|
|
|
GIMP, to QML files.
|
|
|
|
|
|
|
|
|
|
\section1 Exporting from Adobe Photoshop to QML
|
|
|
|
|
|
|
|
|
|
You can use a QML Asset Exporter to export designs from Adobe Photoshop
|
|
|
|
|
to .ui.qml files. The QML Asset Exporter provides templates that are
|
|
|
|
|
based on the \l{http://www.pngexpress.com}{PNG EXPRESS} plugin for
|
|
|
|
|
Photoshop. They enable you to export PSD files to QML format, so that each
|
|
|
|
|
PSD file is converted into an .ui.qml file.
|
|
|
|
|
|
|
|
|
|
The filename of the generated document is based on the name of the PSD file.
|
|
|
|
|
Tagged image and text objects are exported with absolute positioning. Text
|
|
|
|
|
objects are exported with font and alignment information.
|
|
|
|
|
|
|
|
|
|
For more information, see the
|
|
|
|
|
\l {https://github.com/Pelagicore/QmlAssetExporter}{QML Asset Exporter}
|
|
|
|
|
documentation.
|
|
|
|
|
|
|
|
|
|
\section1 Exporting from GIMP to QML
|
|
|
|
|
|
|
|
|
|
\image qml-export-gimp.png
|
|
|
|
|
|
|
|
|
|
Each scene is converted into a single QML file with an
|
|
|
|
|
\l [QML]{Image} or a \l [QML]{Text} item for each layer and saved on the
|
|
|
|
|
development PC. Each layer is exported as an item.
|
|
|
|
|
|
|
|
|
|
You can open the QML file in \QC for editing. By default, the export scripts
|
|
|
|
|
generate Qt Quick 1 files. To edit the files in the Design mode, change the import
|
|
|
|
|
statements in the export scripts to import Qt Quick 2. Or, you can change
|
|
|
|
|
the import statement in each file after generating the files.
|
|
|
|
|
|
|
|
|
|
\section2 Conversion Rules
|
|
|
|
|
|
|
|
|
|
The following rules apply to the conversions:
|
|
|
|
|
|
|
|
|
|
\list
|
|
|
|
|
|
|
|
|
|
\li Layer names are used as item names. Spaces and hash marks (#) are
|
|
|
|
|
replaced with underscore characters to create valid ids for the
|
|
|
|
|
items.
|
|
|
|
|
|
|
|
|
|
\li Layer styles, such as drop shadows, are converted to images.
|
|
|
|
|
|
|
|
|
|
\li Offset, size, ordering and opacity are preserved.
|
|
|
|
|
|
|
|
|
|
\li Text layers are converted to \l [QML]{Text} items, unless you
|
|
|
|
|
specify that they be converted to \l [QML]{Image} items.
|
|
|
|
|
|
|
|
|
|
\li Hidden layers can be exported, and their visibility is set to
|
|
|
|
|
hidden.
|
|
|
|
|
|
|
|
|
|
\li PNG images are copied to the images subirectory.
|
|
|
|
|
|
|
|
|
|
\endlist
|
|
|
|
|
|
|
|
|
|
\section2 Preparing Files for Conversion
|
|
|
|
|
|
|
|
|
|
To create QML files that are easy to use, prepare the
|
|
|
|
|
GIMP designs for exporting, as follows:
|
|
|
|
|
|
|
|
|
|
\list
|
|
|
|
|
|
|
|
|
|
\li To minimize the number of items, minimize the number of layers,
|
|
|
|
|
because each layer or is
|
|
|
|
|
exported as a \l [QML]{Text} or \l [QML]{Image} item.
|
|
|
|
|
|
|
|
|
|
\li To determine that some layers are not exported, hide them, and
|
|
|
|
|
deselect the \uicontrol {Export hidden} check box during exporting.
|
|
|
|
|
|
|
|
|
|
\li To make it easier to find the layers after
|
|
|
|
|
exporting them, use descriptive names for them.
|
|
|
|
|
|
|
|
|
|
\li To make sure that image dimensions are preserved during export,
|
|
|
|
|
create at least one fully filled layer (which can be hidden), such
|
|
|
|
|
as a background layer. If the export script does not find a fully
|
|
|
|
|
filled layer, it resizes all images to the size of the canvas.
|
|
|
|
|
|
|
|
|
|
\li To prevent errors during export, make sure that the layers are not
|
|
|
|
|
locked. Locked layers cannot be exported.
|
|
|
|
|
|
|
|
|
|
\li To avoid unexpected results, do not use Blending Mode effects. They
|
|
|
|
|
are not exported.
|
|
|
|
|
|
|
|
|
|
\endlist
|
|
|
|
|
|
|
|
|
|
\section2 Running the Export Script
|
|
|
|
|
|
|
|
|
|
The script has been tested to work on GIMP 2. You can download GIMP 2 from
|
|
|
|
|
\l{http://www.gimp.org/downloads/}{GIMP Downloads}.
|
|
|
|
|
|
|
|
|
|
\list 1
|
|
|
|
|
|
|
|
|
|
\li Clone the repository that contains the export script,
|
|
|
|
|
\e qmlexporter.py, from
|
|
|
|
|
\l{https://codereview.qt-project.org/#/admin/projects/qt-labs/gimp-qmlexporter}
|
|
|
|
|
{Qt Code Review}.
|
|
|
|
|
|
|
|
|
|
\note Read the INSTALL.txt in the repository for latest information
|
|
|
|
|
about the script.
|
|
|
|
|
|
|
|
|
|
\li Copy the export script to the plug-ins directory in the GIMP
|
|
|
|
|
installation directory.
|
|
|
|
|
|
|
|
|
|
\li Check the properties of the file to make sure that it is executable.
|
|
|
|
|
|
|
|
|
|
On Linux, run the following command: \c {chmod u+rx}
|
|
|
|
|
|
|
|
|
|
\li To generate QML files that you can edit in the Design mode, edit the
|
|
|
|
|
import statement in \e qmlexporter.py. For example:
|
|
|
|
|
|
|
|
|
|
\code
|
|
|
|
|
f.write('import QtQuick 2.5\n')
|
|
|
|
|
\endcode
|
|
|
|
|
|
|
|
|
|
\li Restart GIMP to have the export command added to the \uicontrol File menu.
|
|
|
|
|
|
|
|
|
|
\li Choose \uicontrol {File > Export to QML} to export the design to a QML
|
|
|
|
|
file.
|
|
|
|
|
|
|
|
|
|
\li In the \uicontrol {Export Layers to a QML Document} dialog, enter a name
|
|
|
|
|
and location for the QML file, and click \uicontrol Export.
|
|
|
|
|
|
|
|
|
|
\endlist
|
|
|
|
|
|
|
|
|
|
The QML file is saved to the location that you specified. In \QC, choose
|
|
|
|
|
\uicontrol {File > Open File or Project} to open the QML file.
|
|
|
|
|
|
|
|
|
|
\note Existing files are replaced without warning.
|
|
|
|
|
|
|
|
|
|
*/
|
Leena Miettinen