efektivní Python + PyQt Designer workflow

předtím, Než začneme, je předpokládat, že budete mít středně pokročilé znalosti Pythonu. To zahrnuje základní datové typy (zejména slovníky), příkazy a funkce. Znalosti o objektově orientovaném programování (OOP) by byly užitečné, ale nevyžadovaly by se.

toto bude rychlý návod na vytvoření GUI Pythonu pomocí kombinace knihovny Python PyQt a návrháře. Designer je program, který je dodáván s PyQt a umožňuje vytvořit GUI vizuálně. Budeme používat jen Designer a Python IDE / textový editor. Python GUI nemusí být složité!

Pojďme se podívat na vytvoření Python GUI workflow s těmito funkcemi:

• konfigurační soubor pro vlastní nastavení uživatele
• Více oken v rámci programu
• Přidávání funkcí do tlačítek, vstupních polí, a další klikací položky
• Obrázky a loga

Toto je opravdu vše, co potřebujete pro jednoduchý, ale robustní Python GUI. V tomto tutoriálu vytvoříme jednoduchý převodník měn.

budeme používat Python 3.6 v tomto tutoriálu a budu vytvářet tento tutoriál ve virtuálním prostředí pomocí systému Windows 10. V tomto tutoriálu budeme potřebovat pouze nainstalovat PyQt5 pro GUI a požadavky na náš ukázkový projekt. To bude provedeno pomocí pip. Je důležité si uvědomit, že Designer není dodáván s instalací pip PyQt5 a musí být instalován samostatně. Kódový blok níže zobrazuje příkazy, které je třeba zadat:

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.

Měna Data

můžete získat zdarma Forex data z Kurzu-API, které pohodlně má API, které můžeme použít. API vrací objekt JSON s informacemi o měně, které lze navigovat pomocí slovníku Python. Směnné kurzy jsou založeny na hlavní měně, kterou určíte.

v níže uvedeném příkladu se chceme podívat na Forex pomocí amerického dolaru (USD) jako Hlavní měny.

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.
}
}

vytvoření GUI

nyní přichází zábavná část. Vytvoření GUI!

Když otevřete Qt Designer, otevře se tato výzva. Chci začít s prázdným plátnem, takže zvolím „Dialog bez tlačítek“ a poté kliknu na „Vytvořit“.

Nyní máte prázdné dialogové okno pro práci s. Můžete začít přidávat widgety pomocí seznamu vlevo. Tyto widgety přidáte přetažením do okna GUI. I když existuje mnoho widgety, v tomto tutoriálu jsem se bude týkat pouze následující widgety:

• Štítky
• Tlačítko
• Upravit
• Pole se Seznamem

Pole se Seznamem je také známý jako drop-down seznam a můžete naplnit tento seznam dvojitým kliknutím na Pole se Seznamem objektů v návrháři, to vám okno, kde můžete přidat položky. V tomto případě přidáme měny, které používáme. To umožní uživateli rozhodnout, kterou měnu chce použít jako referenční měnu.

Když začnete přidávat tyto widgety byste se měli ujistit, že jsou pojmenovány správně, takže si může odkazovat se na ně snadno v Python kódu. To se provádí pomocí názvu objektu v editoru vlastností vpravo. Obvykle jen připojím jejich funkci k existujícímu názvu, jako je labelTitle nebo lineEditLocationDetails. Tento styl pojmenování mi pomáhá zapamatovat si, s jakým typem objektu GUI pracuji, když píšu kód Pythonu.

Styl to jak chcete, ale pro ty, kteří po tomto tutoriálu vytvořte GUI, které vypadá jako to níže:

plovoucí „Logo“ text je zástupný obrázek, který budeme načítat. To bude vysvětleno později!

Qt Designer to Python

uložte soubor UI do složky projektu jako “ mainDialog.ui“, rád bych vytvořil podsložku nazvanou “ ui “ a poté ji tam uložil, abychom mohli organizovat složku projektu.

jakmile je uložen, musíme jej převést na něco, čemu Python skutečně rozumí. Pomocí příkazového řádku přejděte do podsložky ui. Pokud to děláte také ve virtuálním prostředí, ujistěte se, že jste také ve virtuálním prostředí, které obsahuje instalaci PyQt5.

zadejte tento kód pro navigaci do složky obsahující soubor ui a převést .ui souboru .py souboru:

cd "your/ui/folder/here"
pyuic5 mainDialog.ui -o mainDialog.py

V kořenové složce projektu, vytvořit Python soubor s názvem „main.py“. Zadejte tento kód:

spusťte main.py soubor pomocí interpretu Pythonu. Gratuluji! Nyní Python může spustit kód a vaše GUI se objeví. Vysvětlím zatím důležité části kódu:

• řádek 5: importujeme mainDialog.py soubor zevnitř podadresáře ui. Používám alias „mainDialog“, abych usnadnil pojmenování.
• řádek 10: Tato třída obsahuje všechny funkce související s vaším maindialogovým oknem, které jste právě vytvořili. První argument volá objekt QDialog, což je typ GUI, který používáme. Druhý argument je založen na aliasu, který jsme deklarovali, a je to třída Ui_dialog uvnitř souboru Pythonu, který byl vygenerován z .konverze souborů ui
• řádek 12: funkce _ _ init__ je důležitá, protože se jedná o kód, který chcete spustit při spuštění programu. Takže to je místo, kde já.setupUi (self) přichází, protože chcete, aby se uživatelské rozhraní spustilo při otevření programu. Budeme dávat věci, jako je načítání konfiguračních souborů a funkce tlačítek, protože chceme, aby fungovaly, jakmile spustíme software.
• řádek 20: Toto je kód, který spustí a otevře GUI.

přidání funkcí do tlačítek a objektů

nyní máme naše krásné GUI. Jak to uděláme Forex? Přidejme funkci pro načtení nejnovějších forexových sazeb, které jsem ukázal na začátku tohoto příspěvku. Poté vložíme kód pro připojení objektů k kódu Pythonu.

při pokusu o připojení k objektům, které jste vytvořili v aplikaci Designer, musíte začít s “ self.”. Takže pokud váš objekt v PyQt Designer byl nazýván labelTitle, budete volat objekt zadáním v self.labelTitle. Pokud byl váš objekt nazván lineEditInputDirectory, zavoláte jej zadáním self.lineEditInputDirectory a tak dále.

Podívejte se na Github gist a vysvětlení níže:

Linka 16: Tato funkce je volána, když uživatel klikne na tlačítko pro načtení Forex sazeb. Samotný objekt je sám.pushButtonLoadRates ale připojujeme funkce, když uživatel klikne přidáním .klepnutí.připojit(). Tato funkce má některé specifické nuance. Argument pro .connect () přijímá pouze funkci bez závorky, takže v tomto případě já.load_rates. Pokud potřebujete přidat argumenty vzhledem k požadavkům Python funkce musíte použít lambda, viz blok kódu níže:

self.pushButton.clicked.connect(lambda:self.load_rates(arg1,arg2,...)) 

19: .currentText () získá aktuální řetězec objektu comboBox, který bude naší referenční měnou. Pokud tedy uživatel vybere USD, vrátí Forexové sazby ve vztahu k 1 USD. Tento řetězec je přidán do adresy URL, která se používá pro připojení k API v dalším řádku.

řádky 24-26: používají se k načtení našich dat do objektů lineEdit. Používáme .setText() pro úpravu textu na objektech lineEdit. Přijímá pouze řetězce, takže čísla z API by měla být převedena na řetězec.

Přidání Konfiguračního Souboru

Tato část je trochu složitější a je tam, kde stávající Python znalosti budou užitečné. V této části se budeme zabývat následujícími funkcemi:

• Otevření nového okna v rámci programu
• Vytvoření a použití konfiguračního souboru

Nyní, že máme pracovní program,, řekněme, že, pro dobro jeden příklad, různí lidé ve vašem oddělení mají různé potřeby a pracují s rozdílem měn. Můžeme jim usnadnit život přidáním konfiguračního souboru, aby nemuseli pokaždé používat rozevírací pole. Pomocí konfiguračního souboru můžeme uložit jejich jedinečná nastavení a poté je načíst při spuštění programu.

Zde přichází tlačítko“ Config“. Vytvořme nové okno pro uživatele, aby upravil jejich nastavení. To nám umožňuje udržovat hlavní okno čisté a organizované.

Uložit ve vašem ui složky jako configDialog.ui a jako jsme to udělali dříve v tomto návodu, převést jej pomocí stejné pyuic5 příkazu, jak je vidět v bloku kódu níže:

cd "your/ui/folder/here"
pyuic5 configDialog.ui -o configDialog.py

Nyní zde je to, co aktualizováno kód by měl vypadat jako níže. Vysvětlení pro nový kód dodatky jsou pod touto Github gist:

• Line 6: přidáme konfigurační dialogové okno prostřednictvím této dovozní prohlášení
• Řádek 10-11: Nový import výkazů, které jsou relevantní pro mít pěkné config soubor workflow. pickle a os přicházejí s výchozím prostředím Pythonu a nepotřebují další instalace.
• řádek 13-14: Umístění konfiguračního souboru se používá celý skript do všech tříd, takže budeme deklarovat jako globální, a aby to vše-čepice, protože je konstantní.
• řádek 17: tato třída obsahuje všechny relevantní informace pro konfigurační okno. Pokud chcete volat objekty v config. UI souboru, je doporučeno, že je provedeno volání v této třídě, ne MainDialog.třídy.
• řádek 23: načteme existující konfigurační soubor. Děláme to proto, abychom mohli uživateli ukázat, jaké je aktuální nastavení.
• Řádek 26: Pomocí načteného konfiguračního souboru nastavíme text se seznamem na jakékoli aktuální nastavení.
• řádek 33: když uložíme konfiguraci, chceme aktualizovat slovník uložený v self.config před zápisem konfiguračního souboru.
• řádek 39: tím se zavře okno konfiguračního parametru.
• řádek 48-54: toto je logika při načítání konfiguračního souboru v hlavním dialogovém okně. Z jakéhokoli důvodu může konfigurační soubor chybět a program se kvůli chybám nespustí. Pokud konfigurační soubor chybí, vytvořte konfigurační soubor s výchozími parametry, aby uživatel mohl program spustit a později upravit parametry.
• řádek 56: načteme vlastní nastavení a nastavíme pole se seznamem na preferovanou měnu uživatele.
• řádek 62-63: spustí se okno konfiguračního parametru. To je založeno na názvu konfiguračního dialogu název třídy. V tomto případě je třída pojmenována Configparametry.
• řádek 65-68: po dokončení konfigurace nastavení uživatele a zavření okna. Program se aktualizuje sám a znovu načíst konfigurační soubor před aktualizací referenční měny combo box.

tento pracovní postup umožňuje uživateli uložit své jedinečné nastavení a program bude i nadále fungovat, pokud konfigurační soubor chybí. Chcete se pokusit vysvětlit každý problém, se kterým se váš program setká.

Přidání obrázků

Nyní máte plně funkční program, přidejte dotváří: logo. I když může existovat soubor prostředků PyQt, kde můžete ukládat obrázky, raději jen Načítám obrázky pomocí štítků a pixmap. To je velmi rychlé.

řádek 56-58: nahrajeme logo, které jsem uložil do složky ui. Pak jsem nastavil objekt labelLogo načíst pixmap a nastavit obsah v měřítku na velikost objektu labelLogo.

Final Thoughts

Hopefully this tutorial gives some clarity on how PyQt5 Designer works. Strávil jsem nespočet hodin googlingem těchto věcí a dokonce i placené výukové programy na Udemy byly trochu zbytečné.