hatékony Python + PyQt Designer munkafolyamat
mielőtt elkezdenénk, feltételezzük, hogy köztes vagy fejlett ismeretekkel rendelkezik a Pythonról. Ez magában foglalja az alapvető adattípusokat (különösen a szótárakat), az állításokat és a függvényeket. Az objektumorientált programozás (OOP) ismerete hasznos lenne, de nem szükséges.
Ez egy gyors bemutató lesz a Python GUI készítéséhez a Python PyQt könyvtár és a Designer kombinációjával. Tervező egy olyan program, amely jön PyQt, és lehetővé teszi, hogy hozzon létre a GUI vizuálisan. Csak tervezőt és Python IDE/szövegszerkesztőt fogunk használni. Python GUI nem kell bonyolult!
nézzük meg egy Python GUI munkafolyamat létrehozását a következő funkciókkal:
- konfigurációs fájl az egyéni felhasználói beállításokhoz
- több ablak a programon belül
- funkciók hozzáadása gombokhoz, beviteli mezőkhöz és más kattintható elemekhez
- képek és logók
Ez tényleg minden, amire szükséged van egy egyszerű, de robusztus Python GUI-hoz. Ebben az oktatóanyagban csak hozzunk létre egy egyszerű valutaváltót.
Python 3-at fogunk használni.6 ebben az oktatóanyagban ezt a bemutatót virtuális környezetben fogom létrehozni a Windows 10 használatával. Ebben az oktatóanyagban csak a PyQt5-et kell telepítenünk a GUI-hoz és a mintaprojektünk kéréseihez. Ez a pip használatával történik. Fontos megjegyezni, hogy a Designer nem tartozik a pip PyQt5 telepítéshez, ezért külön kell telepíteni. Az alábbi kódblokk a beírandó parancsokat mutatja:
pip install PyQt5
pip install PyQt5Designer
pip install requests
Once it is installed, just search for “Designer” in your computer and it should pop up.
valuta adatok
tudjuk, hogy ingyenes forex adatokat exchangerate-API, amely kényelmesen egy API tudjuk használni. Az API egy JSON objektumot ad vissza a pénznemmel kapcsolatos információkkal, amelyek Python szótár segítségével navigálhatók. Az árfolyamok az Ön által megadott fő pénznemen alapulnak.
az alábbi példában azt szeretnénk, hogy nézd meg a Forex segítségével az amerikai dollár (USD), mint a mester valuta.
import requestsurl = 'https://api.exchangerate-api.com/v4/latest/USD'
response = requests.get(url)
data = response.json()# The data variable will look like the dictionary below
{
"base": "USD",
"date": "2020-14-20",
"time_last_updated": 1553092232,
"rates": {
"USD": 1,
"AUD": 1.4882,
"CAD": 1.325097,
"...": 1.311357,
"...": 7.4731, etc. etc.
}
}
A GUI létrehozása
most jön a szórakoztató rész. A GUI létrehozása!
a Qt Designer megnyitásakor ez a prompt megnyílik. Egy üres vászonnal akarok kezdeni, így a “párbeszédablak gombok nélkül” lehetőséget választom, majd a “Létrehozás”gombra kattintok.
most van egy üres párbeszédablak dolgozni. A bal oldali lista segítségével elkezdheti a widgetek hozzáadását. Ezeket a widgeteket úgy adja hozzá, hogy áthúzza őket a GUI ablakra. Bár sok kütyü van, ebben az oktatóanyagban csak a következő kütyüket fogom lefedni:
- címkék
- nyomógomb
- sor szerkesztése
- kombinált doboz
A kombinált lista legördülő listaként is ismert, és ezt a listát duplán kattintva töltheti fel a kombinált doboz objektumára a Designer alkalmazásban, ez ad egy ablakot, ahol elemeket adhat hozzá. Ebben az esetben hozzáadjuk az általunk használt pénznemeket. Ez lehetővé teszi a felhasználó számára, hogy eldöntse, melyik pénznemet kívánja használni referencia pénznemként.
töltse fel a widget kattintva a zöld Hozzáadás gombra a bal alsó
amikor elkezdi hozzáadni ezeket a widgeteket, győződjön meg arról, hogy megfelelően nevezték el őket, hogy könnyen hivatkozhasson rájuk a Python kódban. Ez az objectName használatával történik a jobb oldali Tulajdonságszerkesztőben. Általában csak a meglévő névhez fűzöm a funkciójukat, például labelTitle vagy lineEditLocationDetails. Ez az elnevezési stílus segít emlékezni arra, hogy milyen típusú GUI objektummal dolgozom, amikor beírom a Python kódot.
stílusosítsa úgy, ahogy szeretné, de azok számára, akik ezt az oktatóanyagot követik, hozzon létre egy GUI-t, amely az alábbiakban így néz ki:
Ez a lebegő”logó”szöveg egy helyőrző egy képhez, amelyet betöltünk. Ezt később elmagyarázzuk!
Qt Designer Python
mentse el az UI fájlt a projekt mappájába, mint ” mainDialog.ui”, szeretek létrehozni egy “ui” nevű almappát, majd elmenteni oda, hogy a projekt mappáját megszervezhessük.
miután elmentettük, át kell alakítanunk valamire, amit a Python valóban megért. A parancssor segítségével keresse meg az ui almappáját. Ha ezt virtuális környezetben is elvégzi, győződjön meg arról, hogy a PyQt5 telepítést tartalmazó virtuális környezetben is tartózkodik.
írja be ezt a kódot az ui fájlt tartalmazó mappába való navigáláshoz, majd konvertálja a.ui fájl .py fájlba:
cd "your/ui/folder/here"
pyuic5 mainDialog.ui -o mainDialog.py
a projektmappa gyökerében hozzon létre egy Python fájlt “main.py”. adja meg ezt a kódot:
futtassa a main.py fájl a Python tolmács segítségével. Gratula! Most a Python futtathatja a kódot, és megjelenik a GUI. Elmagyarázom a kód eddig fontos részeit:
- 5. sor: importáljuk a mainDialog.py fájl a felhasználói felület almappájából. A “mainDialog” álnevet használom, hogy megkönnyítsem az elnevezést.
- 10. sor: Ez az osztály tartalmazza a mainDialog ablakhoz kapcsolódó összes funkciót, amelyet éppen készített. Az első argumentum felhívja a QDialog objektumot, amely az általunk használt GUI típusa. A második argumentum az általunk deklarált aliason alapul, és az Ui_dialog osztály a Python fájlban, amelyet a .ui fájlkonverzió
- 12. sor: a__ init _ _ funkció azért fontos, mert ez az a kód, amelyet a program indításakor futtatni szeretne. Tehát ez az, ahol az én.a setupui (self) azért jön be, mert azt szeretné, hogy a felhasználói felület futjon a program megnyitásakor. Olyan dolgokat fogunk elhelyezni, mint a konfigurációs fájlok betöltése és a gombfunkciók itt, mert azt akarjuk, hogy működjenek, amint futtatjuk a szoftvert.
- 20. sor: Ez az a kód, amely végrehajtja és megnyitja a GUI-t.
funkciók hozzáadása a gombokhoz és objektumokhoz
most megvan a Gyönyörű GUI. Hogyan csináljuk a Forex-et? Adjuk hozzá a funkciót a legfrissebb Forex árak betöltéséhez, amelyeket a bejegyzés elején mutattam be. Ezután tegyük be a kódot, hogy összekapcsoljuk az objektumokat a Python kóddal.
amikor megpróbál csatlakozni a Designer alkalmazásban létrehozott objektumokhoz, a “self.”. Tehát, ha az objektum PyQt Designer hívták labelTitle, akkor hívja az objektumot gépeléssel önálló.címke. Ha az objektumot lineEditInputDirectory-nak hívták, akkor Ön beírásával hívja fel.lineEditInputDirectory és így tovább.
nézze meg a Github lényegét és az alábbi magyarázatot:
16.sor: ezt a funkciót akkor hívják meg, amikor a felhasználó rákattint a gombra a Forex árak betöltéséhez. A tárgy maga az én.pushButtonLoadRates de csatoljuk funkcionalitás, amikor a felhasználó rákattint hozzá.kattintott.csatlakozás (). Ez a funkció bizonyos árnyalatokkal rendelkezik. Az érv .a connect() csak zárójel nélkül fogadja el a függvényt, tehát ebben az esetben én.load_rates. Ha argumentumokat kell hozzáadnia a Python függvény követelményei miatt, akkor lambda-t kell használnia, olvassa el az alábbi kódblokkot:
self.pushButton.clicked.connect(lambda:self.load_rates(arg1,arg2,...))
19 .sor:.currentText() megkapja a comboBox objektum aktuális karakterláncát, amely a referencia pénznemünk lesz. Tehát, ha a felhasználó kiválasztja USD vissza fog térni Forex árak képest 1 USD. Ez a karakterlánc hozzáadódik az URL-hez, amelyet az API-hoz való csatlakozáshoz használnak a következő sorban.
vonalak 24-26: ezek az adatok lineEdit objektumokra való betöltésére szolgálnak. Használjuk .setText (), hogy módosítsa a szöveget a lineEdit objektumokat. Csak karakterláncokat fogad el, ezért az API számait karakterláncokká kell konvertálni.
konfigurációs fájl hozzáadása
Ez a rész egy kicsit trükkös, és ez az, ahol a meglévő Python tudás hasznos lesz. Ebben a részben a következő jellemzőket tárgyaljuk:
- új ablak megnyitása a programon belül
- konfigurációs fájl létrehozása és használata
most, hogy van egy munkaprogramunk, tegyük fel, hogy egy példa kedvéért a részleg különböző embereinek különböző igényei vannak, és mindannyian különböző valutákkal dolgoznak. Megkönnyíthetjük az életüket egy konfigurációs fájl hozzáadásával, hogy ne kelljen minden alkalommal használni a legördülő mezőt. Konfigurációs fájl segítségével elmenthetjük egyedi beállításaikat, majd betölthetjük, amikor a program elindul.
itt jön be a “Config” gomb. Hozzunk létre egy új ablakot a felhasználó számára a beállítások módosításához. Ez lehetővé teszi számunkra, hogy a főablakot tisztán és szervezetten tartsuk.
Mentés a ui mappába, mint configDialog.ui és ahogy korábban tettük ebben az oktatóanyagban, konvertálja ugyanazt a pyuic5 parancsot, mint az alábbi kódblokkban látható:
cd "your/ui/folder/here"
pyuic5 configDialog.ui -o configDialog.py
most itt van, amit a frissített kódnak alább kell kinéznie. Az új kód kiegészítések magyarázata a Github lényege alatt található:
- 6.sor: a config párbeszédablakot ezen az importálási utasításon keresztül adjuk hozzá
- 10-11. sor: új importálási utasítások, amelyek relevánsak a szép konfigurációs fájl munkafolyamathoz. a savanyúság és az operációs rendszer egyaránt Az alapértelmezett Python környezettel rendelkezik, és nincs szükség további telepítésekre.
- 13-14. sor: A konfigurációs fájl helyét az egész szkriptben használják az összes osztályban, így globálisnak nyilvánítjuk, és teljes sapkává tesszük, mivel állandó.
- 17. sor: Ez az osztály tartalmazza a konfigurációs ablak összes lényeges információját. Ha objektumokat szeretne hívni az Ön által készített konfigurációs felhasználói felület fájlban, akkor ajánlott, hogy a hívás ebben az osztályban történjen, nem pedig a MainDialog osztályban.
- 23. sor: betöltjük a meglévő konfigurációs fájlt. Ezt azért tesszük, hogy megmutassuk, mi az aktuális beállítás a felhasználó számára.
- 26. sor: A betöltött konfigurációs fájl segítségével a kombinált doboz szövegét az aktuális beállításra állítjuk.
- 33. sor: amikor elmentjük a konfigurációt, frissíteni akarjuk az önmagában tárolt szótárt.config írása előtt a config fájlt.
- 39. sor: ez bezárja a konfigurációs paraméter ablakot.
- 48-54 sor: ez a logika a konfigurációs fájl betöltésekor a fő párbeszédablakban. Bármilyen okból is hiányozhat a konfigurációs fájl, majd a Program hibák miatt nem indul el. Ha a konfigurációs fájl hiányzik, hozzon létre egy konfigurációs fájlt az alapértelmezett paraméterekkel, hogy a felhasználó továbbra is elindítsa a programot, majd később módosítsa a paramétereket.
- 56. sor: betöltjük az egyéni beállításokat, és beállítjuk a kombinált mezőt a felhasználó által preferált pénznemre.
- 62-63 sor: ez elindítja a konfigurációs paraméter ablakot. Ennek alapja a config dialog osztály neve. Ebben az esetben az osztály neve ConfigParameters.
- 65-68 sor: miután a felhasználó befejezte a beállítások konfigurálását, az ablak bezárult. A program frissíti magát, és töltse be a konfigurációs fájlt újra frissítése előtt a referencia valuta combo box.
Ez a munkafolyamat lehetővé teszi a felhasználó számára az egyedi beállítások mentését, és a program továbbra is működni fog, ha a konfigurációs fájl hiányzik. Meg akarja próbálni, és figyelembe minden probléma a program találkozik.
Képek hozzáadása
most már teljesen működőképes programja van, adjuk hozzá az utolsó simításokat: egy logót. Bár lehet egy PyQt erőforrásfájl, ahol képeket tárolhat, inkább csak címkékkel és pixmapokkal töltöm be a képeket. Ez nagyon gyors.
56-58.sor: betöltjük az ui mappába mentett logót. Ezután beállítom a labelLogo objektumot a pixmap betöltésére, a tartalmat pedig a labelLogo objektum méretére méretezem.
Final Thoughts
Hopefully this tutorial gives some clarity on how PyQt5 Designer works. Számtalan órát töltöttem googling ezeket a dolgokat, sőt fizetett oktatóanyagok Udemy volt egy kicsit haszontalan.