diff options
Diffstat (limited to 'sources/pyside6/doc/tutorials/qmlintegration')
3 files changed, 51 insertions, 106 deletions
diff --git a/sources/pyside6/doc/tutorials/qmlintegration/main.py b/sources/pyside6/doc/tutorials/qmlintegration/main.py index 0408313d3..0a751d7d1 100644 --- a/sources/pyside6/doc/tutorials/qmlintegration/main.py +++ b/sources/pyside6/doc/tutorials/qmlintegration/main.py @@ -1,42 +1,5 @@ -############################################################################# -## -## Copyright (C) 2021 The Qt Company Ltd. -## Contact: http://www.qt.io/licensing/ -## -## This file is part of the Qt for Python examples of the Qt Toolkit. -## -## $QT_BEGIN_LICENSE:BSD$ -## You may use this file under the terms of the BSD license as follows: -## -## "Redistribution and use in source and binary forms, with or without -## modification, are permitted provided that the following conditions are -## met: -## * Redistributions of source code must retain the above copyright -## notice, this list of conditions and the following disclaimer. -## * Redistributions in binary form must reproduce the above copyright -## notice, this list of conditions and the following disclaimer in -## the documentation and/or other materials provided with the -## distribution. -## * Neither the name of The Qt Company Ltd nor the names of its -## contributors may be used to endorse or promote products derived -## from this software without specific prior written permission. -## -## -## THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -## "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -## LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -## A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -## OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -## SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -## LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -## DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -## THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -## (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -## OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -## -## $QT_END_LICENSE$ -## -############################################################################# +# Copyright (C) 2022 The Qt Company Ltd. +# SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause import sys from pathlib import Path @@ -46,6 +9,7 @@ from PySide6.QtGui import QGuiApplication from PySide6.QtQml import QQmlApplicationEngine, QmlElement from PySide6.QtQuickControls2 import QQuickStyle +import style_rc # To be used on the @QmlElement decorator # (QML_IMPORT_MINOR_VERSION is optional) diff --git a/sources/pyside6/doc/tutorials/qmlintegration/qmlintegration.rst b/sources/pyside6/doc/tutorials/qmlintegration/qmlintegration.rst index 46b055e13..ff6fe3e31 100644 --- a/sources/pyside6/doc/tutorials/qmlintegration/qmlintegration.rst +++ b/sources/pyside6/doc/tutorials/qmlintegration/qmlintegration.rst @@ -1,18 +1,18 @@ -Python-based context properties -=============================== +Python-QML integration +====================== This tutorial provides a quick walk-through of a python application that loads, and interacts with -a QML file. QML is a declarative language that lets you design UIs faster than a traditional -language, such as C++. The QtQml and QtQuick modules provides the necessary infrastructure for +a QML file. QML is a declarative language that lets you design UIs faster than a traditional +language, such as C++. The QtQml and QtQuick modules provides the necessary infrastructure for QML-based UIs. -In this tutorial, you will learn how to integrate Python with a QML application through a context -property. This mechanism will help us to understand how to use Python as a backend for certain -signals from the UI elements in the QML interface. Additionally, you will learn how to provide +In this tutorial, you will learn how to integrate Python with a QML application. +This mechanism will help us to understand how to use Python as a backend for certain +signals from the UI elements in the QML interface. Additionally, you will learn how to provide a modern look to your QML application using one of the features from Qt Quick Controls 2. The tutorial is based on an application that allow you to set many text properties, like increasing -the font size, changing the color, changing the style, and so on. Before you begin, install the +the font size, changing the color, changing the style, and so on. Before you begin, install the `PySide6 <https://pypi.org/project/PySide6/>`_ Python packages. The following step-by-step process will guide you through the key elements of the QML based @@ -29,29 +29,47 @@ application and PySide6 integration: .. literalinclude:: main.py :linenos: - :lines: 98-108 - :emphasize-lines: 6,9 + :lines: 63-76 + :emphasize-lines: 4,9 - Notice that we specify the name of the context property, **con**, - and also we explicitly load our QML file. + Notice that we only need a :code:`QQmlApplicationEngine` to + :code:`load` the QML file. -#. Define the `Bridge` class, containing all the logic for the context property: +#. Define the ``Bridge`` class, containing all the logic for the element + that will be register in QML: .. literalinclude:: main.py :linenos: - :lines: 51-91 + :lines: 14-54 + :emphasize-lines: 3,4,7 -#. Now, go back to the QML file and connect the signals to the slots defined in the `Bridge` class: + Notice that the registration happens thanks to the :code:`QmlElement` + decorator, that underneath uses the reference to the :code:`Bridge` + class and the variables :code:`QML_IMPORT_NAME` and + :code:`QML_IMPORT_MAJOR_VERSION`. + +#. Now, go back to the QML file and connect the signals to the slots defined in the ``Bridge`` class: + + .. code:: js + + Bridge { + id: bridge + } + + Inside the :code:`ApplicationWindow` we declare a component + with the same name as the Python class, and provide an :code:`id:`. + This :code:`id` will help you to get a reference to the element + that was registered from Python. .. literalinclude:: view.qml :linenos: - :lines: 85-93 - :emphasize-lines: 5-7 + :lines: 45-55 + :emphasize-lines: 6-8 The properties *Italic*, *Bold*, and *Underline* are mutually exclusive, this means only one can be active at any time. - To achieve this each time we select one of these options, we - check the three properties via the context property as you can + To achieve this each time we select one of these options, we + check the three properties via the QML element property as you can see in the above snippet. Only one of the three will return *True*, while the other two will return *False*, that is how we make sure only one is being @@ -62,7 +80,7 @@ application and PySide6 integration: .. literalinclude:: main.py :linenos: - :lines: 79-84 + :lines: 42-47 :emphasize-lines: 4,6 Returning *True* or *False* allows you to activate and deactivate @@ -73,31 +91,31 @@ application and PySide6 integration: .. literalinclude:: main.py :linenos: - :lines: 64-70 + :lines: 34-39 #. Now, for changing the look of our application, you have two options: - 1. Use the command line: execute the python file adding the option, `--style`:: + 1. Use the command line: execute the python file adding the option, ``--style``:: python main.py --style material - 2. Use a `qtquickcontrols2.conf` file: + 2. Use a ``qtquickcontrols2.conf`` file: .. literalinclude:: qtquickcontrols2.conf :linenos: - Then add it to your `.qrc` file: + Then add it to your ``.qrc`` file: .. literalinclude:: style.qrc :linenos: - Generate the *rc* file running, `pyside6-rcc style.qrc > style_rc.py` - And finally import it from your `main.py` script. + Generate the *rc* file running, ``pyside6-rcc style.qrc -o style_rc.py`` + And finally import it from your ``main.py`` script. .. literalinclude:: main.py :linenos: - :lines: 41-48 - :emphasize-lines: 8 + :lines: 4-12 + :emphasize-lines: 9 You can read more about this configuration file `here <https://doc.qt.io/qt-5/qtquickcontrols2-configuration.html>`_. diff --git a/sources/pyside6/doc/tutorials/qmlintegration/view.qml b/sources/pyside6/doc/tutorials/qmlintegration/view.qml index de9715ee1..635603fac 100644 --- a/sources/pyside6/doc/tutorials/qmlintegration/view.qml +++ b/sources/pyside6/doc/tutorials/qmlintegration/view.qml @@ -1,42 +1,5 @@ -/**************************************************************************** -** -** Copyright (C) 2021 The Qt Company Ltd. -** Contact: http://www.qt.io/licensing/ -** -** This file is part of the Qt for Python examples of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of The Qt Company Ltd nor the names of its -** contributors may be used to endorse or promote products derived -** from this software without specific prior written permission. -** -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** -** $QT_END_LICENSE$ -** -****************************************************************************/ +// Copyright (C) 2021 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause import QtQuick 2.0 |