Python-kielelle käännetty UI-tiedosto

QtDesigner tuottaa XML (eXtensible Markup Language) tiedostoja, joissa on ohjeet käyttöliittymän piirtämiseen. Ohjelmointikielet eivät kuitenkaan osaa suoraan käyttää niitä. PySide-projekteissa yleensä tehdään erillinen Pyhton-tiedosto, jossa XML-ohjeet ovat suoraan Python-muodossa. Ui-tiedosto voidaan muuntaa joko komennolla Pyside6-uic uitiedosto.ui -o pythontiedosto.py tai asentamalla Visual Studio Codeen Qt for Python-laajennus, joka suorittaa konversion automaattisesti aina kun UI-tiedosto tallennetaan Qt Designer-ohjelmassa. Laajennus luo UI-tiedostosta _ui.py-loppuisen tiedoston. Projektissa kannataakin nimetä tiedostot esim. seuraavasti: UI-tiedosto mainWindow.ui, käännetty käyttöliittymätiedosto mainWindow_ui.py ja varsinainen ohjelmatiedosto mainWindow.py. Tällä tavoin tiedostojen nimet liittävät toisiinsa kuuluvat tiedostot yhteen.

Käännöstyökalut

Komentorivityökalun lisäksi uusin QtDesigner mahdollistaa Python-koodin kopioimisen suoraan käyttöliittymän Forms-valikosta: Form - View Python Code.... Käännös voidaan myös automatisoida Visual Studio Coden Qt for Python -laajennuksen avulla, joka myös lisää joitakin Qt:n ominaisuuksia intellisenseen.

:warning: VS Coden päivitysten jälkeen laajennus ei vältämättä toimi ilman editorin ja uudelleen käynnistämistä. Laajennus avaa seuraavan ikkun käynnistyttyään.

Varsinaisen sovelluksen ja käyttöliittymän yhdistäminen

Jos alkuperäistä käyttöliittymää mainWindow.ui muokataan, kaikki käännettyyn käyttöliittymään mainWindow_ui.py tehdyt muutokset menetetään. Tästä syystä kaikki oma koodi pitäisi kirjoittaa varsinaiseen ohjelmatiedostoon mainWindow.py. Seuraavassa esimerkissä on malline, jonka avulla voi yhdistää käyttöliittymän varsinaiseen ohjelmatiedostoon.

# PYSIDE6-MALLINE SOVELLUKSEN PÄÄIKKUNAN LUOMISEEN
# KÄÄNNETYSTÄ KÄYTTÖLIITTYMÄTIEDOSTOSTA (mainWindow_ui.py)
# =====================================================

# KIRJASTOJEN JA MODUULIEN LATAUKSET
# ----------------------------------
import os # Polkumääritykset
import sys # Käynnistysargumentit

from PySide6 import QtWidgets # Qt-vimpaimet
from mainWindow_ui import Ui_MainWindow # Käännetyn käyttöliittymän luokka

# Määritellään luokka, joka perii QMainWindow- ja Ui_MainWindow-luokan
class MainWindow(QtWidgets.QMainWindow, Ui_MainWindow):
    """A class for creating main window for the application"""
    
    # Määritellään olionmuodostin ja kutsutaan yliluokkien muodostimia
    def __init__(self):
        super().__init__()

        # Luodaan käyttöliittymä konvertoidun tiedoston perusteella MainWindow:n ui-ominaisuudeksi. Tämä suojaa lopun MainWindow-olion ylikirjoitukselta, kun ui-tiedostoa päivitetään
        self.ui = Ui_MainWindow()

        # Kutsutaan käyttöliittymän muodostusmetodia setupUi
        self.ui.setupUi(self)

Ohjelman alussa ladataan tarvittavat kirjastot ja moduulit, joiden joukossa on käännetty käyttöliittymä mainWindow_ui.py. Sen jälkeen määritellään luokka MainWindow, joka perii kahden eri luokan ominaisuudet ja metodit: QMainWindow on PySide:n luokka, joka pitää sisällään pääohjelman vaatimat toiminnot. Ui_MainWindow-luokka kuuluun käännettyyn käyttöliittymään ja tuo kaikki käyttöliittymän elementit pääohjelmaan.

Varsinainen käyttöliittymä luodaan MainWindow-luokan olioihin ominaisuutena self.ui = Ui_Mainwindow() komennolla, jossa kutsutaan käännetyn käyttöliittymän konstruktorimetodia. Käyttöliittymä ei kuitenkaan ole suoraan käytettävissä, vaan se aktivoidaan metodilla self.ui.setupUi(self).

Käyttöliittymän toimintojen ohjelmointi

Kun käyttäjä painaa hiiren painikkeita tai käyttää näppäimistöä syntyy ns. Event (taphatuma). Kun se yhdistetään käyttöliittymäelementtiin, jonka kohdalla se on tapahtunut saadaan ns. Signal (signaali). Sen tarkoituksena on aikaansaada jokin toiminto, joita Qt kutsuu nimellä Slot. Se on yksinkertaisesti metodi, jota kutsutaan, kuten seuraavassa esimerkissä on tehty (jatkoa edell. koodikatkelmalle):

# OHJELMOIDUT SIGNAALIT
        # ---------------------
        
        # Kun Tulosta-painiketta on klikattu, kutsutaan updatePrintedLabel-metodia
        self.ui.tulostaPushButton.clicked.connect(self.updatePrintedLabel)

        
   
   
    # OHJELMOIDUT SLOTIT
    # ------------------

    # Muutetaan tulostettuLabel:n sisältö: teksti ja väri
    def updatePrintedLabel(self):
        self.ui.tulostettuLabel.setText('Tulostettu')

Esimerkissä käyttöliittymäelementin nimi on tulostaPushButton ja tapahtuma on clicked (hiiren 1-napin painallus). Se kutsuu metodia updatePrintedLabel(self), joka muuttaa käyttöliittymässä olevan tekstin tulostettuLabel sisällöksi merkkijonon 'Tulostettu'.

Varsinaisen ohjelman luominen ja käynnistäminen

Kun luokkamääritykset on tehty, luodaan sovellus ja käynnistetään se seuraavalla tavalla:

# Luodaan sovellus
app = QtWidgets.QApplication(sys.argv)

# Luodaan objekti pääikkunalle ja tehdään siitä näkyvä
window = MainWindow()
window.show()

# Käynnistetään sovellus ja tapahtumienkäsittelijä
app.exec()

Ensin luodaan QApplication-vimpain (widget), jolle voidaan tarvittaessa välittää parametreja sys-kirjaston avulla. Kun sovellus on luotu, sille tehdään ikkuna luomalla MainWindow-luokasta uusi olio, joka yleensä nimetään ikkunaksi window. Nimellä ei ole käytännön merkitystä. Qt-sovelluksissa ikkunat ovat näkymättömiä, kunnes ne aktivoidaan show()-metodilla. Viimeisenä komentona kutsutaan sovelluksen exec() tai _exec()-metodia. Pyhton 3.x versioissa voi käyttää exec()-metodia vanhemmissa pitää käyttää _exec()-metodia, koska pythonin vanhoissa verisoissa exec oli varattu sana.