diff options
| author | Cristian Maureira-Fredes <Cristian.Maureira-Fredes@qt.io> | 2020-12-27 21:45:13 +0100 |
|---|---|---|
| committer | Cristian Maureira-Fredes <Cristian.Maureira-Fredes@qt.io> | 2021-02-04 12:56:16 +0100 |
| commit | a6c7e9d7fd65946762766e40793ba86291bcca1a (patch) | |
| tree | f99eb63a95680f0ad364d838c1088e7875bc9dfc /sources/pyside6/doc/tutorials/pretutorial | |
| parent | 961cc3afb3b4c680f98dd52bb3d5a2d03cb424c1 (diff) | |
doc: general update and add more information
Updates:
* Refreshing the information on installing and building PySide
* Adding hyperlinks to some files
* Including PySide installation GIF (from Wiki)
* Modifying the CSS to improve the code snippets, :command: role,
and adding layout for two columns.
New tutorials
* QTableWidget
* QTreeWidget
New documentation
* Differences between Widgets and QML
* IDE information (+ QtCreator GIF from Wiki)
* When to use Shiboken
* file types explanation
* Summary on distributing applications
Pick-to: 6.0
Change-Id: I5195cc5a4af858bb7aad7891d14562ca07b6df23
Reviewed-by: Christian Tismer <tismer@stackless.com>
Reviewed-by: Friedemann Kleint <Friedemann.Kleint@qt.io>
Diffstat (limited to 'sources/pyside6/doc/tutorials/pretutorial')
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/distribution.rst | 69 | ||||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/hello_linux.png | bin | 0 -> 5960 bytes | |||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/hello_macOS.png | bin | 0 -> 38777 bytes | |||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/hello_win10.jpg | bin | 0 -> 5314 bytes | |||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/typesoffiles.rst | 149 | ||||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/whatisqt.rst | 112 | ||||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/whatisshiboken.rst | 42 | ||||
| -rw-r--r-- | sources/pyside6/doc/tutorials/pretutorial/whichide.rst | 54 |
8 files changed, 426 insertions, 0 deletions
diff --git a/sources/pyside6/doc/tutorials/pretutorial/distribution.rst b/sources/pyside6/doc/tutorials/pretutorial/distribution.rst new file mode 100644 index 000000000..f55c3684a --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/distribution.rst @@ -0,0 +1,69 @@ +.. _distribution: + +Distributing Your Application to Other Systems/Platforms +======================================================== + +After developing a couple of applications, you might want to distribute them to +other users. In case you do not have much experience with Python packages, you +might have even asked: *How do I create a Python executable?*. + +If you come from compiled programming languages, deployment is something +almost trivial, but for Python is a bit difficult. + +The deployment process for Python applications is called, "freezing", which is +distributing your virtual environment content to other users. + +.. important:: As Python does not support WebAssembly and mobile platforms, + such as Android and iOS, you cannot deploy applications to these platforms + directly, and you require advanced processes to do so. + +.. note:: For embedded systems, you currently need to build |project| for your + target platform, and deploy the installation alongside your application. + +Reproducible deployment +----------------------- + +A common approach is to only provide a ``requirements.txt`` file, where you +state your dependencies. Users would need to install them from there +to run your Application. + +For example, imagine I have a project with two dependencies, ``module_a`` and +``module_b``, which I use in my ``main.py`` file. So my structure is: + +.. code-block:: python + + # Content of the main.py file + from module_a import something + import module_b + + # ... + +So the ``requirements.txt`` for my application would look like this:: + + module_a + module_b + +Later, when a user want to execute your ``main.py``, the dependencies +must be installed using :command:`pip install -r requirements.txt` +in a new virtual environment. + +.. important:: You can notice that this approach includes sharing your code + so it fails if you want to hide the code of your application. + +Freezing Your Application +------------------------- + +This is the most common approach for users to distribute their applications +and even though the code is still available for the end user, it is a bit more +difficult to retrieve it. + +You can find a series of tutorials based on the most popular tools that +allow Python users to freeze and distribute applications in our +:ref:`deployment` section. + +Compiling Python +---------------- + +Even though Python does not natively support to be compiled, there are +complementary tools that let you to achieve this. +You can check the `Nuitka <https://nuitka.net/>`_ project to learn more. diff --git a/sources/pyside6/doc/tutorials/pretutorial/hello_linux.png b/sources/pyside6/doc/tutorials/pretutorial/hello_linux.png Binary files differnew file mode 100644 index 000000000..f335a234d --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/hello_linux.png diff --git a/sources/pyside6/doc/tutorials/pretutorial/hello_macOS.png b/sources/pyside6/doc/tutorials/pretutorial/hello_macOS.png Binary files differnew file mode 100644 index 000000000..863149399 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/hello_macOS.png diff --git a/sources/pyside6/doc/tutorials/pretutorial/hello_win10.jpg b/sources/pyside6/doc/tutorials/pretutorial/hello_win10.jpg Binary files differnew file mode 100644 index 000000000..78dcf8ab5 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/hello_win10.jpg diff --git a/sources/pyside6/doc/tutorials/pretutorial/typesoffiles.rst b/sources/pyside6/doc/tutorials/pretutorial/typesoffiles.rst new file mode 100644 index 000000000..f606c2784 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/typesoffiles.rst @@ -0,0 +1,149 @@ +.. _typesoffiles: + +File Types +========== + +There are many different file types that you will encounter while +developing |project| applications, ui, qrc, qml, pyproject, etc. +Here you can find a simple explanation for +each of them. + +Python Files ``.py`` +-------------------- + +Python files are the main format you will be dealing with, while developing +|project| projects. + +It is important to note that you can write applications **only** with Python +files, without the need of ``.ui``, ``.qrc``, or ``.qml`` files, however +using other formats will facilitate some processes, and enable new +functionality to your applications. + +.. code-block:: python + + class MyWidget(QWidget): + def __init__(self): + QWidget.__init__(self) + + self.hello = ["Hallo Welt", "你好，世界", "Hei maailma", + "Hola Mundo", "Привет мир"] + + self.button = QPushButton("Click me!") + self.text = QLabel("Hello World") + self.text.setAlignment(Qt.AlignCenter) + # ... + +User Interface Definition File ``.ui`` +-------------------------------------- + +When using Qt Designer, you can create interfaces with the WYSIWYG +form editor, this interface is represented as a widget tree using XML. +Here is an extract of the beginning of a ``.ui`` file: + +.. code-block:: xml + + <?xml version="1.0" encoding="UTF-8"?> + <ui version="4.0"> + <class>MainWindow</class> + <widget class="QMainWindow" name="MainWindow"> + <property name="geometry"> + <rect> + <x>0</x> + <y>0</y> + <width>400</width> + <height>300</height> + </rect> + </property> + <property name="windowTitle"> + <string>MainWindow</string> + </property> + <widget class="QWidget" name="centralWidget"> + ... + +The `pyside6-uic` tool generates Python code from these `.ui` files, +which you can import from your main files, so it is not necessary +for you to include the `.ui` files in your deployed application. + +Resource Collection Files ``.qrc`` +---------------------------------- + +List of binary files that will be used alongside your application. +As an XML-based file, its structure look like this: + +.. code-block:: xml + + <!DOCTYPE RCC><RCC version="1.0"> + <qresource> + <file>images/quit.png</file> + <file>font/myfont.ttf</file> + </qresource> + </RCC> + + +The `pyside6-rcc` tool generates Python code from these `.qrc` files, +so you are not required to include the listed files in your deployed +application. + + +Qt Modeling Language File ``.qml`` +---------------------------------- + +Graphical QML applications are not related to Qt Widgets applications, and +that is why the usual setup of QML project is a Python file that loads +the QML file, and optionally, elements defined in Python that are exposed +to QML to be used. + +You can write ``.qml`` files by hand, but also you can use tools like the +QML Designer that is embedded in Qt Creator. Additionally, there are commercial +tools like Qt Design Studio that allow you to load designs from other design +applications. + +Here you can find an example of how a ``.qml`` file looks like. +The code will display a lightgray rectangle, with the "Hello World!" +message on it. + +.. code-block:: javascript + + import QtQuick 2.0 + + Rectangle { + id: page + width: 320; + height: 480 + color: "lightgray" + + Text { + id: helloText + text: "Hello world!" + y: 30 + anchors.horizontalCenter: page.horizontalCenter + font.pointSize: 24; + font.bold: true + } + } + +Qt Creator Python Project File ``.pyproject`` +--------------------------------------------- + +For Qt Creator to load and handle Python based projects, a special file is +needed, because C++ based projects could be handle from ``.qmake`` or +``CMakeLists.txt`` file, which are not used with Python-based projects. + +Old versions of Qt Creator, provided a simple format with the ``.pyqtc`` +extension, which were plain-text files with one-file-per-line:: + + library/server.py + library/client.py + logger.py + ... + +There were limitations to this format, and further options that might be +added that would not be supported, which was the motivation to create a +``.pyproject`` file, which is a JSON-based file where more options could +be added. Here is an example of such file: + +.. code-block:: javascript + + { + "files": ["library/server.py", "library/client.py", "logger.py", ...] + } diff --git a/sources/pyside6/doc/tutorials/pretutorial/whatisqt.rst b/sources/pyside6/doc/tutorials/pretutorial/whatisqt.rst new file mode 100644 index 000000000..2dee661a7 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/whatisqt.rst @@ -0,0 +1,112 @@ +.. _whatisqt: + +Qt, QML, Widgets...What Is The Difference? +========================================== + +If you are new to Qt, there might be a chance that you are a bit confused about +all the concepts you have read so far. This section aims to provide a summary +of all the key components that are relevant to develop Qt applications. + +Keep in mind that Qt was designed and written in C++ as a C++ framework, you +will find many references, examples, and concepts that make sense in C++ +based applications, that might not be relevant in your Python applications, +but keep in mind that |project| aims to expose the Qt framework to Python +with many adaptations. You don't need to know C++ to use |project|, and you +can find all the possible combinations between these languages later on. + +Qt +-- + +The Qt Project is an open collaboration that coordinates the development of the +Qt Framework. You might find situations where "Qt" refers to the project, or +to the framework. + +As a framework, Qt has many components, which are distributed by components +and modules, for example, `qtbase <https://code.qt.io/cgit/qt/qtbase.git/>`_ +is the base component that holds many modules, like: ``QtCore``, ``QtGui``, +``QtWidgets``, ``QtNetwork``, etc. +All those modules contains many classes that you can directly use, like the +case of the `Classes of QtCore <https://doc.qt.io/qt-6/qtcore-module.html>`_ +from which you can find classes like ``QFile``, ``QTime``, ``QByteArray``, etc. + +You can create applications without a User Interface, while using this classes +to create command line applications, handle files, network connections, +regular expressions, encoding of text, etc. + +On the other hand, you can create Graphical applications with classes +from the ``QtWidgets`` module, this is also referred as **Widgets**. + +There are many other Qt modules like ``QtMultimedia``, ``QtCharts``, ``Qt3D``, +among others. These modules has a specific functionality, and among this +modules, there is one called ``QtDeclarative``, in which you can find the +implementation of the ``QML`` declarative language. This language is similar +to CSS and JSON, and it was created to design UI applications declaratively, +allowing JavaScript to take care of some imperative sections, and enabling +other components to extend and connect the code with C++. + +Let us check the functionality of these different approaches separately. + +Widgets +------- + +As we mentioned before, ``QtWidgets`` is the module that provide predefined +Widgets that you can add into your graphical application, like Buttons, Labels, +Boxes, Menus, etc. + +Widget based applications will look like a native application, because the goal +is not to affect the user experience compared to other included applications. + +.. image:: hello_macOS.png + :width: 20% +.. image:: hello_win10.jpg + :width: 20% +.. image:: hello_linux.png + :width: 20% + +.. note:: You can adapt these applications to use your self-made style, but + you need to be aware that the goal of Widgets is to respect the system + style, be careful when changing colors. Check this `simple tutorial + <widgetstyling>`_ on how to do so. + +QML +--- + +QML offers an alternative approach to create User Interfaces, compared to +Widgets, and it was originally motivated from mobile applications development. +Together with the ``Qt Quick`` module, it provides access to interact with +mobile device using actions like taps, drag and drop, animations, states, +transitions, drawer menus, etc. + +The elements that you can find in QML/Quick applications are focused on +providing a more dynamic application infrastructure which different properties +based in certain behaviors. + +Even though QML has the motivation to provide interfaces with mobile devices, +you can use it for Desktop applications, too. + +Additionally, you can augment your application with standard JavaScript, which +in combination with C++ can become an attractive infrastructure. + +Python And C++ +-------------- + +For |project| applications you **do not need to know C++**, but it is possible +to mix both languages in a couple of different use cases: + +1. If you have a Qt/C++ application, you can re-write it so it is a Qt/Python + application. This means that Python aims to be a full replacement for the + user level C++ code of Qt applications. +2. For custom Qt widgets written in C++, you can generate your own Python + bindings so people can use it directly from Python. +3. If you have a C++ based library that you use with your Qt/C++ applications + that is in charge of a specific task, like a performant process, you can + generate bindings for it, so people could be able to use it from Python. +4. For a Qt/C++ application, you can extend it with Python, by exposing the + main QApplication singleton as a python binding to a Python interpreter. + This can be understand as a "Python Plugin System" for your Qt/C++ + application, for example. + +For the the steps **2., 3., and 4.** you need the help of Shiboken, the +binding generation tool that is used to generate |project|. +You can find more information in the +`documentation page <https://doc.qt.io/qtforpython/shiboken6/index.html>`_. diff --git a/sources/pyside6/doc/tutorials/pretutorial/whatisshiboken.rst b/sources/pyside6/doc/tutorials/pretutorial/whatisshiboken.rst new file mode 100644 index 000000000..67aafc4f8 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/whatisshiboken.rst @@ -0,0 +1,42 @@ +.. _whatisshiboken: + +Binding Generation: What Is Shiboken? +===================================== + +When you install ``PySide6`` you might have notice that also ``Shiboken6`` +is installed as a dependency: + +.. code-block:: bash + + (env) [qt ~]$ pip install pyside6 + Collecting pyside6 + Downloading PySide6-6.0.0-6.0.0-cp36.cp37.cp38.cp39-abi3-manylinux1_x86_64.whl (170.5 MB) + |████████████████████████████████| 170.5 MB 42 kB/s + Collecting shiboken6==6.0.0 + Downloading shiboken6-6.0.0-6.0.0-cp36.cp37.cp38.cp39-abi3-manylinux1_x86_64.whl (964 kB) + |████████████████████████████████| 964 kB 29.3 MB/s + Installing collected packages: shiboken6, pyside6 + Successfully installed pyside6-6.0.0 shiboken6-6.0.0 + +That installed package is also called **Shiboken Module**, and it contains +some utilities for PySide to properly work. +You can find more information about it on its +`documentation page <https://doc.qt.io/qtforpython/shiboken6/shibokenmodule.html>`_ + +There is a third package that does not get installed when you install PySide, +because it is not required, and it is called **Shiboken Generator**. + +Most of the times you see mentions to use "Shiboken" or to do something +related to "binding generation", it is about this third package, and **not** +the dependency of the PySide package. + +Do I Need Shiboken Generator? +----------------------------- + +If your goal is to just write Qt applications in Python, +you do not need to worry about a Shiboken generator installation, +but on the other hand, if you want to work with your own bindings +or extend Qt/C++ applications with Python, you **need** it. + +You can find all the information related to Shiboken on its +`documentation page <https://doc.qt.io/qtforpython/shiboken6/>`_. diff --git a/sources/pyside6/doc/tutorials/pretutorial/whichide.rst b/sources/pyside6/doc/tutorials/pretutorial/whichide.rst new file mode 100644 index 000000000..ec005a188 --- /dev/null +++ b/sources/pyside6/doc/tutorials/pretutorial/whichide.rst @@ -0,0 +1,54 @@ +.. _whichide: + +Which IDEs Are Compatible? +========================== + +|project|, as any other Python module, can be used in any Python-compatible +IDE, but not all of them will provide extra functionality like Qt Creator does. + +Besides writing files, there are some external steps you might want to perform +in order to help the development of your applications: + +From a terminal: + +* Generating a Python file from a ``.ui`` file: + :command:`pyside6-uic -i form.ui -o ui_form.py` +* Generating a Python file from a ``.qrc`` file: + :command:`pyside6-rcc -i resources.qrc -o rc_resources.py` +* Opening Qt Designer with the command :command:`pyside6-designer` to + edit/create ``.ui`` files. + +External add-ons/plugins from your favorite IDE might include configuration +steps to run these commands, or open external tools like Designer and +QtCreator. + +QtCreator +--------- + +You can create new projects based on some basic templates that are currently +available in QtCreator. After selecting one, you will pass through some steps +where you can specify the details of the template, like the project name, +base Qt class to use for your interface, among others. + +Here you can see an animation of the creation of a project: + +.. image:: https://qt-wiki-uploads.s3.amazonaws.com/images/7/7c/Qtcreator.gif + :alt: Qt Creator Animation + +Visual Studio Code +------------------ + +Besides editing the code of your application, you can use external plugins to +enable more functionality, like this unofficial +`plugin <https://marketplace.visualstudio.com/items?itemName=seanwu.vscode-qt-for-python>`_ +that you can install from VS Code while writing the following on the Quick Open Menu (``Ctrl+P``): +:command:`ext install seanwu.vscode-qt-for-python`. + +PyCharm +------- + +You can configure PyCharm to enable external tools, in |project| terms, Qt Designer, and +Qt Creator. Go to ``File > Settings > tools > PyCharm External Tools``, and include the following +information to add them to your project. +Later, you will be able to right click a ``.ui`` file, and select ``Qt Designer``, +``pyside6-uic``, or any tool that you configured this way. |
