Python Qt5 : complex QML file.

Today, I will show you how to have a more complex custom application with PyQt5 and QML file.
You need to create into your python folder a new folder named QMLCustom.
Into this file create two python files named: __init__.py and QMLCustom.py.
The __init__ will be an empty file.
Into your python folder installation (where you create the QMLCustom folder), create a new QML_custom.qml file.
The QML_custom.qml file will have this:

import QtQuick 2.0
import SDK 1.0
import QtQuick.Layouts 1.1

Rectangle {
    id: appwnd
    visible: true
    width: 640
    height: 480

    property int columns : 2
    property int rows : 2

    Rectangle {
        anchors.fill: parent
        color: "#00f"
    }

    GridView {
        id: grid
        anchors.fill: parent
        cellWidth: Math.max(width/2, height/2);
        cellHeight: Math.max(width/2, height/2)
        model: dashModel
        delegate : Rectangle {
            Layout.alignment: Layout.Center
            width: grid.cellWidth
            height: grid.cellHeight
            color: "#0ff"
            border.color: "#fff"
            border.width: 10

            Text {
                id: name
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.bottom: parent.bottom
                anchors.leftMargin:15
                anchors.topMargin: 15
                width: parent.width 
                height: parent.height
                textFont {
                    family: "Halvetica"
                    italic: false
                    pointSize:20
                }
                suffixText: suffix
            }

        }
        onWidthChanged: {
            grid.cellWidth = grid.width/appwnd.columns;
        }

        onHeightChanged: {
            grid.cellHeight = grid.height/appwnd.rows
        }
    }

    ListModel {
        id: dashModel
        ListElement {
            tagName: "Text"
            suffix: "First text"
        }
        ListElement {
            tagName: "Text"
            suffix: "Next text"
        }         
    }
} 

If you read this you will see the qml type file has two imports and a text.
The imports are used to load it and the text file is used to describe what we need.
In this case is created a Rectangle, GridView and one ListModel with two ListElement.
All of this part will be a link to the QMLCustom.py file.
For example: follow the suffixText from qml file suffixText: suffix into QMLCustom.py file (decorator def suffixText(self, text)).
Into the QMLCustom folder you need to fill the QMLCustom.py with this:

import PyQt5
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import pyqtProperty, pyqtSignal, pyqtSlot
from PyQt5.QtQuick import QQuickPaintedItem, QQuickItem
from PyQt5.QtGui import QPainter
from PyQt5 import QtCore

class QMLCustom(QQuickPaintedItem):
    #
    class DialType():
        FullDial = 0
        MinToMax = 1
        NoDial = 2
    #
    sizeChanged = pyqtSignal()
    valueChanged = pyqtSignal()
    #
    backgroundColorChanged = pyqtSignal()
    #
    textColorChanged = pyqtSignal()
    suffixTextChanged = pyqtSignal()
    showTextChanged = pyqtSignal()
    textFontChanged = pyqtSignal()

    def __init__(self, parent=None):
        super(QMLCustom, self).__init__(parent)

        self.setWidth(100)
        self.setHeight(100)
        self.setSmooth(True)
        self.setAntialiasing(True)

        self._Size = 100
        self._DialWidth = 15
        self._SuffixText = ""
        self._BackgroundColor = Qt.transparent
        self._TextColor = QColor(0, 0, 0)
        self._ShowText = True
        self._TextFont = QFont()

    def paint(self, painter):
        painter.save()

        size = min(self.width(), self.height())       
        self.setWidth(size)
        self.setHeight(size)
        rect = QRectF(0, 0, self.width(), self.height()) 
        painter.setRenderHint(QPainter.Antialiasing)
        
        painter.restore()

        painter.save()
        painter.setFont(self._TextFont)
        offset = self._DialWidth / 2
        if self._ShowText:
            painter.drawText(rect.adjusted(offset, offset, -offset, -offset), Qt.AlignCenter, self._SuffixText)
        else:
            painter.drawText(rect.adjusted(offset, offset, -offset, -offset), Qt.AlignCenter, self._SuffixText)
        painter.restore()

    @QtCore.pyqtProperty(str, notify=sizeChanged)
    def size(self):
        return self._Size

    @size.setter
    def size(self, size):
        if self._Size == size:
            return
        self._Size = size
        self.sizeChanged.emit()

    @QtCore.pyqtProperty(float, notify=valueChanged)
    def value(self):
        return self._Value

    @value.setter
    def value(self, value):
        if self._Value == value:
            return
        self._Value = value
        self.valueChanged.emit()


    @QtCore.pyqtProperty(QColor, notify=backgroundColorChanged)
    def backgroundColor(self):
        return self._BackgroundColor

    @backgroundColor.setter
    def backgroundColor(self, color):
        if self._BackgroundColor == color:
            return
        self._BackgroundColor = color
        self.backgroundColorChanged.emit()


    @QtCore.pyqtProperty(QColor, notify=textColorChanged)
    def textColor(self):
        return self._TextColor

    @textColor.setter
    def textColor(self, color):
        if self._TextColor == color:
            return
        self._TextColor = color
        self.textColorChanged.emit()  

    @QtCore.pyqtProperty(str, notify=suffixTextChanged)
    def suffixText(self):
        return self._SuffixText

    @suffixText.setter
    def suffixText(self, text):
        if self._SuffixText == text:
            return
        self._SuffixText = text
        self.suffixTextChanged.emit()

    @QtCore.pyqtProperty(str, notify=showTextChanged)
    def showText(self):
        return self._ShowText

    @showText.setter
    def showText(self, show):
        if self._ShowText == show:
            return
        self._ShowText = show


    @QtCore.pyqtProperty(QFont, notify=textFontChanged)
    def textFont(self):
        return self._TextFont

    @textFont.setter
    def textFont(self, font):
        if self._TextFont == font:
            return
        self._TextFont = font
        self.textFontChanged.emit()

This is a base python module that allows you to use the qml file and show it into your application.
The QMLCustom.py use a class (with pyqtSignal and paint to link all data with decorators) to be used into your application.
This can be a little difficult to follow but if you deal with a tool like QtCreator editor you will understand how this integrated GUI layout and forms designer with this script.
The last part is more simple and is the application.
This script uses both the custom python module QMLCustom and the qml file.
Create a python file into your folder python installation fill with the next script and run it:

import sys
import os
import subprocess

from QMLCustom.QMLCustom import QMLCustom

from PyQt5.QtCore import QUrl, Qt, QObject, pyqtSignal, pyqtSlot
from PyQt5.QtGui import QGuiApplication, QCursor
from PyQt5.QtQuick import QQuickView
from PyQt5.QtQml import qmlRegisterType
from OpenGL import GLU

class App(QGuiApplication):
 def __init__(self, argv):
  super(App, self).__init__(argv)

if __name__ == '__main__':
 try:
  app = App(sys.argv)
  
  qmlRegisterType(QMLCustom, "SDK", 1,0, "Text")

  view = QQuickView()
  ctxt = view.rootContext()
  view.setSource(QUrl("QML_custom.qml"))
  view.show()
  ret = app.exec_()

 except Exception as e:
  print (e)

The result is this:

Python Qt5 : application with QML file.

The PyQt5 includes QML as a means of declaratively describing a user interface and is possible to write complete standalone QML applications.
Using QML file is different from the versions PyQt5 and old PyQt4.
Using this type of application can let you solve custom and style application.
I create a simple example but can create your python module with a class with new type of style.
This can be used with qmlRegisterType for your new python class type.
Let's see the example:
The main python file:

from PyQt5.QtNetwork import *
from PyQt5.QtQml import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import *

class MainWin(object):
    def __init__(self):
        self.eng = QQmlApplicationEngine()
        self.eng.load('win.qml')
        win = self.eng.rootObjects()[0]   
        win.show()

if __name__ == '__main__':
    import sys
    App = QApplication(sys.argv)
    Win = MainWin()
    sys.exit(App.exec_())

The QML file:

import QtQuick 2.2
import QtQuick.Controls 1.0
ApplicationWindow {
    id: main
    width: 640
    height: 480
    color: 'blue'
 }

The result is a blue window.

Using pytorch - another way.

Yes. I used pytorch and is working well. Is not perfect the GitHub come every day with a full stack of issues.
Let's continue this series with another step: torchvision.
If you take a closer look at that gift, you will see that it comes with a special label that can really help us.
This label is a named torchvision.
The torchvision python module is a package consists of popular datasets, model architectures, and common image transformations for computer vision.
Most operations pass through filters and date already recognized.

• torchvision.datasets: (MNIST,Fashion-MNIST,EMNIST,COCO,LSUN,ImageFolder,DatasetFolder,Imagenet-12,CIFAR,STL10,SVHN,PhotoTour,SBU,Flickr,VOC)
• torchvision.models: (Alexnet,VGG,ResNet,SqueezeNet,DenseNet,Inception v3)
• torchvision.transforms: (Transforms on PIL Image,Transforms on torch.*Tensor,Conversion Transforms,Generic Transforms,Functional Transforms)
• torchvision.utils

This part of the gift help you to load and prepare dataset but into certain order.
Using this special label, we will be able to use the gift-breaking information.
Let's see the example:

C:\Python364>python.exe
Python 3.6.4 (v3.6.4:d48eceb, Dec 19 2017, 06:54:40) [MSC v.1900 64 bit (AMD64)]
 on win32
Type "help", "copyright", "credits" or "license" for more information.
>>> import torchvision
>>> import torchvision.transforms as transforms
>>> transform = transforms.Compose(
...     [transforms.ToTensor(),
...      transforms.Normalize((0.5, 0.5, 0.5), (0.5, 0.5, 0.5))])
>>> trainset = torchvision.datasets.CIFAR10(root='./data', train=True,download=T
rue, transform=transform)
Downloading https://www.cs.toronto.edu/~kriz/cifar-10-python.tar.gz to ./data\ci
far-10-python.tar.gz

You will ask me: How is this special gift label linked?
In this way:

>>> import torch
>>> trainloader = torch.utils.data.DataLoader(trainset, batch_size=4,shuffle=Tru
e, num_workers=2)

Let's take a closer look at the information in the special label.

>>> print(trainset)
Dataset CIFAR10
    Number of datapoints: 50000
    Split: train
    Root Location: ./data
    Transforms (if any): Compose(
                             ToTensor()
                             Normalize(mean=(0.5, 0.5, 0.5), std=(0.5, 0.5, 0.5)
)
                         )
    Target Transforms (if any): None
>>> print(dir(trainset))
['__add__', '__class__', '__delattr__', '__dict__', '__dir__', '__doc__', '__eq_
_', '__format__', '__ge__', '__getattribute__', '__getitem__', '__gt__', '__hash
__', '__init__', '__init_subclass__', '__le__', '__len__', '__lt__', '__module__
', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__setattr__'
, '__sizeof__', '__str__', '__subclasshook__', '__weakref__', '_check_integrity'
, 'base_folder', 'download', 'filename', 'root', 'target_transform', 'test_list'
, 'tgz_md5', 'train', 'train_data', 'train_labels', 'train_list', 'transform', '
url']

Let's look more closely at the information that can be used by the gift with the special label.

>>> print(trainloader)

>>> print(dir(trainloader))
['_DataLoader__initialized', '__class__', '__delattr__', '__dict__', '__dir__',
'__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__ha
sh__', '__init__', '__init_subclass__', '__iter__', '__le__', '__len__', '__lt__
', '__module__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__',
 '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__weakref__', 'bat
ch_sampler', 'batch_size', 'collate_fn', 'dataset', 'drop_last', 'num_workers',
'pin_memory', 'sampler', 'timeout', 'worker_init_fn']

Beware, CIFAR10 is just one of the training databases.
About the CIFAR-10 dataset, that consists of 60,000 32x32 color images in 10 classes, with 6,000 images per class.
There are 50,000 training images (5,000 per class) and 10,000 test images.

Fix errors when write files.

The python is a very versatile programming language.
The tutorial for today is about:

• check the type of variables;
• see the list error of writelines with the list output;
• fix errors for writelines;

One good example for some errors can be this:

>>> file.writelines(paragraphs)
Traceback (most recent call last):
  File "", line 1, in 
TypeError: a bytes-like object is required, not 'str'
>>> file.writelines(paragraphs.decode('utf-8'))
Traceback (most recent call last):
  File "", line 1, in 
AttributeError: 'list' object has no attribute 'decode'

Is a common issue for list and writing file.
The result of paragraphs is a list, see:

>>> type(paragraphs)

The list can be write with te writelines into the file like this:

>>> file = open("out.txt","wb")
>>> file.writelines([word.encode('utf-8') for word in paragraphs])

The file is a open file variable and the paragraphs is a list.

Using pytorch - a simpler perspective.

Suppose this module PyTorch is a data extravagance circuit that allows us to filter information several times, and we can decide each time we decide the final result.
A simpler perspective of how to work with PyTorch can be explained by a simple example.
It's like a Christmas baby (PyTorch) that opens a multi-packed gift until it gets the final product - the desired gift.
The opening operations of the package involve smart moves called: forward and backward passes.
The child's feedback can be called: loss and backpropagate.
In this case, the child will try to remove from his package until he is satisfied and will not be lost (loss and backpropagate functions).
To compute the backward pass for a gradient and every time we backpropagate the gradient from a variable, the gradient is accumulative instead of being reset and replaced (most of networks designs call backward multiple times).
PyTorch comes with many loss functions.
Most of examples code create a mean square error loss function and later backpropagate the gradients based on the loss.
Will you ask me if the gift is shaped? I can tell you that the gift can contain from Verge à Saint-Nicolas (unidimensional) to complex (multidimensional) structures - the most simplistic and worn out is the square one (two-dimensional matrix).
This gift is packed with magic in mathematical functions which allows the child to understand what is in the gift.
But the child is more special. He recognizes forms (matrices, shapes, simple formulas) and this allows him to open parts of the gift.
El poate roti acesta parti din cadou (mm).
The mm is a matrix multiplication.
He can see the corners he can get from the gift.
ReLU stands for "rectified linear unit" and is a type of activation function.
Mathematically, it is defined as y = max(0, x).
He can see which parts of the gift are bigger or smaller so he can understand the gift.
This clamp function clamps all elements in input into the returns[ min, max ] and returns a resulting tensor:
The clamp should only affect gradients for values outside the min and max range.
The pow function power with the exponent.
The clone returns a copy of the self tensor. The copy has the same size and data type as self.
A common example is: clamp(min=0) is exactly ReLU().
PyTorch provides ReLU and its variants through the torch.nn module.
If you run the program to look at the output, you will understand that the child has only five operations left and is already pleased with the way the gift result.
The source code is based on one example from here:

import torch 
dtype = torch.float
device = torch.device("cpu")
batch,input,hidden,output = 2,10,2,5
x = torch.randn(batch,input,device=device,dtype=dtype)
y = torch.randn(hidden,output,device=device,dtype=dtype)
w1 = torch.randn(input,hidden,device=device,dtype=dtype)
w2 = torch.randn(hidden,output,device=device,dtype=dtype)

l_r = 1e-6
for t in range(5):
 h = x.mm(w1)
 h_r = h.clamp(min=0)
 y_p = h_r.mm(w2)
 loss = (y_p - y).pow(2).sum().item()
 print("t=",t,"loss=",loss,"\n")
 g_y_p = 2.0 * (y_p -y)
 g_w2 = h_r.t().mm(g_y_p)
 g_h_r = g_y_p.mm(w2.t())
 g_h = g_h_r.clone()
 g_h[h<0 -="l_r" 0="" g_w1="" g_w2="" n="" print="" w1=",w1," w2=",w2,">

The child's result after five operations.

...
t= 4 loss= 25.40263557434082

w1= tensor([[ 1.5933,  0.3818],
        [-1.0043, -1.3362],
        [ 0.5841, -1.9811],
        [ 2.3483,  0.5748],
        [ 0.5904, -0.2521],
        [-0.6612,  2.7945],
        [ 0.4841, -0.5894],
        [-1.4434, -0.1421],
        [-1.2712, -1.4269],
        [ 0.7929,  0.2040]]) w2= tensor([[ 1.7389,  0.4337,  0.4557,  1.3704,  0
.3819],
        [ 0.2937,  0.0212, -0.4604, -1.0564, -1.5403]])