Przed nami kolejny ciekawe zagadnienie z cyklu nauki o Pythonie: tworzenie aplikacji graficznych, czyli GUI 🤩! W języku Python znajdziesz na to parę pakietów czy modułów, a w tym artykule zaczniemy od najprostszego w obsłudze i rozumieniu, a mianowicie "EasyGUI" 🎉! Poznasz sam moduł, co można zrobić za jego pomocą oraz jakie elementy w sobie zawiera, z których zbudujesz swoją pierwszą aplikację graficzną 🔥! Zainteresowany(-a)? To zapraszam do środka 😉!

MODUŁ "EASYGUI" W JĘZYKU PYTHON WSTĘPEM DO TWORZENIA GUI!

W tym materiale poruszamy istotny temat w programowaniu aplikacji, którym jest "graficzny interfejs użytkownika", także dobrze będzie zacząć od wyjaśnienia sobie tego terminu, aby potem pewnie wejść w naukę samego modułu 🙂.

CZYM JEST GRAFICZNY INTERFEJS UŻYTKOWNIKA?

Graficzny interfejs użytkownika (ang. Graphical User Interface) to metoda korzystania z aplikacji przy użyciu przyjaznych dla użytkownika elementów graficznych, takich jak wyskakujące okna, przyciski, pola tekstowe itd. Stanowią taki "pomost" pomiędzy instrukcjami do wykonania niewidocznymi dla użytkownika (oraz niezrozumiałymi dla osób spoza specjalizacji programowania 💥), a bardzo intuicyjnymi i prostymi do zrozumienia elementami, które "przenoszą" język kodu źródłowego na ludzki (abstrakcyjny) ❤️.

Graficzne interfejsy użytkownika są niewątpliwie bardzo ważną częścią programowania aplikacjiz dwóch istotnych powodów 👇:

  1. "ukrywają" trudne techniczne hasła pod bardzo przyjaznymi dla człowieka elementami, sprawiając że użytkownik nie musi mieć wiedzy z programowania, aby mógł skorzystać z aplikacji (polecenia są "ubierane" w język abstrakcyjny),
  2. pozwalają zautomatyzować wiele czynności i poleceń niezbędnych do zrealizowania jakiegoś zadania (np. sprowadzenie kilkunastu instrukcji do pojedynczego kliknięcia przycisku) i znacznie przyspieszyć naszą pracę.

Korzyści o których wspomniałem, można zobrazować na przykładzie zapisu pliku tekstowego 📄. Zamiast pisać program wykonujący się w wierszu poleceń, który wymaga wpisania polecenia uruchomienia samej aplikacji i podania nazwy w nowym wierszu, mógłbyś/mogłabyś stworzyć aplikację graficzną, która składałaby się z pola tekstowego do wpisania nazwy pliku, przycisku z napisem "Przeglądaj" do wskazania katalogu docelowego gdzie ma się znaleźć nowy plik i drugiego przycisku z napisem "Zapisz" odpowiedzialnego za zapis pliku na dysku komputera 💾. Wtedy z tej aplikacji może skorzystać każda osoba, nawet niemająca żadnej styczności z programowaniem 🏆!

Mamy wyjaśnioną samą istotę sprawy, to przechodzimy do modułu "EasyGUI" 😄!

CZYM JEST "EASYGUI" W JĘZYKU PYTHON?

W języku Python, "EasyGUI" to moduł pozwalający na programowanie prościutkich graficznych aplikacji 🌟. Te aplikacje charakteryzują się "liniowością", to znaczy że ich obsługa polega na wyświetlaniu jednego okna po drugim, a podejmowane decyzje w bieżącym oknie mogą wpływać na dalszy ciąg tego wyświetlania ➡️. Mimo takiego ograniczenia, "EasyGUI" daje swobodę w konfigurowaniu tychże okien, czyli jesteśmy w stanie określić ile ma być przycisków czy też jaka ma być treść komunikatu 👍.

Także ten moduł nie jest stworzony do projektowania aplikacji w stylu jaki widzisz na co dzień 🚫. "EasyGUI" nie odzwierciedla tradycyjnego podejścia do programowania graficznych aplikacji, w których użytkownik ma przed sobą kilkanaście różnych opcji i w każdej chwili może wybrać jedną z nich. Podejście jakie znamy polega na utworzeniu serii elementów ułożonych blisko siebie, znalezieniu dla nich miejsca w oknie, zaprogramowaniu reakcji na jakieś zdarzenie (np. kliknięcie przycisku czy wybranie dowolnej pozycji z listy) i zdefiniowaniu połączeń pomiędzy innymi oknami 🔀. Tutaj obsługa aplikacji jest liniowa, czyli zaczynasz na oknie A, a kończysz na oknie B i każdy z nich wyświetla się pojedynczo ⚠️!

Wbrew pozorom, jest to moim zdaniem dobre dla początkujących ➕. Nie koncentrujemy się na szczegółowym planowaniu nad rozmieszczeniem wielu elementów i uwzględnianiu okoliczności jakie mogą zajść pomiędzy nimi, tylko operujemy na prostym jednostajnym przebiegu zdarzeń od A do Z i w ten sposób łatwiej wejść w ten temat, aby z czasem przesiąść się na coś bardziej zaawansowanego 💪.

To tyle słowem wstępu ✔️. Przejdźmy do procesu instalacji "EasyGUI", gdyż to nie jest moduł dostarczany automatycznie razem z Pythonem 🙂!

JAK ZAINSTALOWAĆ MODUŁ "EASYGUI" W JĘZYKU PYTHON?

Celem instalacji modułu "EasyGUI" w Pythonie, należy otworzyć wiersz poleceń (najlepiej jako administrator, aby uniknąć problemów z uprawnieniami 🔓) i wpisać sobie poniższe polecenie 👇:

pip install easygui

Wciśnij Enter ⏏️. Jeżeli ukaże Ci się komunikat o tym, że system nie rozpoznaje hasła "pip", najprawdopodobniej masz źle skonfigurowaną (albo wcale) zmienną środowiskową "Path". Wtedy musisz przejść do ustawień zmiennych środowiskowych i dodać nowy wpis w postaci ścieżki do zainstalowanego Pythona 💡.

W innym wypadku, instalator pakietów rozpocznie instalację "EasyGUI", która zajmie dosłownie momencik i gdy na końcu ukaże Ci się komunikat tej postaci 👇:

Successfully installed easygui-0.98.3

to znak, że moduł został pomyślnie zainstalowany i można z niego korzystać 🚀!

Tak oto przechodzimy do części związanej z obsługą modułu 😉!

JAK SKORZYSTAĆ Z MODUŁU "EASYGUI" W JĘZYKU PYTHON?

Aby skorzystać z zawartości modułu "EasyGUI" zaraz po jego pobraniu, musimy go zaimportować ↩️. Korzystamy z instrukcji z hasłem "import" i podajemy nazwę modułu pisaną małymi literami 👇:

import easygui

W ten sposób załadujesz do programu cały moduł, uzyskując dostęp do wszystkiego 🔓. W razie gdyby Cię interesował tylko jego fragment (wartość i/lub funkcja), możesz rozważyć użycie instrukcji importu z dodatkowym słowem kluczowym, "from" 👇:

from easygui import [wartość/funkcja występująca w module/pakiecie]

Jeżeli chodzi o Pythona, trzeba mieć świadomość, że obie te instrukcje importu wpływają na odwoływanie się do wartości i funkcji jakie nas interesują. Więcej informacji o obu sposobach zapisu znajdziesz w odrębnych artykułach ℹ️. Ja będę korzystał z pierwszego zapisu w dalszych przykładach kodów źródłowych 1️⃣.

Wstęp do korzystania z modułu wyjaśniony, więc przechodzimy do najważniejszej części jaką jest poznanie elementów do budowy aplikacji graficznych 🤩!

JAKIE ELEMENTY GRAFICZNEGO INTERFEJSU UŻYTKOWNIKA POSIADA MODUŁ "EASYGUI" W JĘZYKU PYTHON?

Moduł "EasyGUI" posiada w sobie wiele podstawowych elementów do budowy graficznego interfejsu użytkownika, wśród których znajdziesz między innymi 👇:

  • msgbox (okno komunikatu),
  • ccbox (okno wyboru pomiędzy dwiema opcjami: "Kontynuuj" i "Anuluj"),
  • buttonbox (okno wyboru pomiędzy niestandardową liczbą opcji w postaci przycisków),
  • enterbox (okno z polem tekstowym, do którego można wprowadzić dowolny łańcuch znaków z klawiatury).

W tym artykule skupimy się tylko na wyżej wymienionych, a pełną listę wszystkich elementów znajdziesz w oficjalnej dokumentacji "EasyGUI" 📖.

Czas na prezentację 🎉!

MSGBOX

"msgbox" (skrót od "message box" 📫) służy do wyświetlania okna z jakąś treścią komunikatu i jedynym przyciskiem w jego dolnej części: "OK". Oto prosty przykład wywołania funkcji 👇:

easygui.msgbox('Moja treść komunikatu', 'Okno msgbox w EasyGUI')

Funkcja przyjmuje 2 parametry (przy czym oba nie są obowiązkowe ℹ️): łańcuch znaków jako treść komunikatu i drugi łańcuch znaków jako tytuł okna komunikatu 2️⃣.

Uruchomienie programu z powyższym wywołaniem spowoduje wyświetlenie okna o takim wyglądzie 👇:

Okno "msgbox" pakietu "EasyGUI" w języku Python

Widok okna "msgbox" modułu "EasyGUI".

Tyle co można napisać na temat "msgbox" 😄.

Funkcja "msgbox" pakietu "EasyGUI" w języku Python

"msgbox" to najprostszy rodzaj okna pełniący rolę komunikatu, który składa się jedynie z treści i przycisku do przejścia dalej, "OK".

Idziemy dalej!

CCBOX

"ccbox" to okno z dwoma przyciskami o wyrazach "Continue" i "Cancel", stąd taka dziwna nazwa jako pierwsze litery obu tych określeń (choć da się zmienić te nazwy) 😅. Przykładowe wywołanie tej funkcji może wyglądać następująco 👇:

continue_button_was_selected = easygui.ccbox('Moja treść komunikatu', 'Okno ccbox w EasyGUI')

Wprowadzając parametr w postaci łańcucha znaków, mamy kontrolę nad treścią w formie zapytania informującą o konsekwencji podjętej decyzji (czy kontynuować, czy anulować) 1️⃣. Gdy wstawimy drugi łańcuch, decydujemy o tytule całego okna 2️⃣. Oba parametry są opcjonalne, więc nie musisz ich umieszczać, natomiast dobrze wiedzieć, że można w ten sposób wpływać na wygląd okna 😊.

Funkcja zwraca wartość logiczną, która oznacza czy wciśnięto przycisk "Continue", czy nie 👍. Podstawiając wynik do zmiennej, możemy się nim posłużyć do programowania dalszego przebiegu zdarzeń i tym samym sprawić, aby zależnie od wartości stało się coś innego, posługując się znaną już Tobie instrukcją warunkową ❤️!

Jeżeli chcesz zmienić również treść obu przycisków, wystarczy że do wywołania funkcji dopiszesz argument nazwany "choices" i podasz listę albo krotkę z dokładnie dwiema wartościami w postaci łańcuchów znaków (nie mniej i nie więcej ⚠️!):

continue_button_was_selected = easygui.ccbox('Moja treść komunikatu', 'Okno ccbox w EasyGUI', choices=['Tak', 'Nie'])

Próba wprowadzenia listy z innym rozmiarem niż 2 elementy, poskutkuje zgłoszeniem przez Pythona błędu typu "AssertionError" i natychmiastowym przerwaniem działania programu (chyba, że przechwytujesz wyjątek) ⛔!

Tak wygląda okno "ccbox" 👇:

Okno "ccbox" pakietu "EasyGUI" w języku Python

Widok okna "ccbox" modułu "EasyGUI".

I to wszystko w temacie 🙂.

Funkcja "ccbox" pakietu "EasyGUI" w języku Python

"ccbox" tworzy okno z dwoma przyciskami do wyboru w postaci przeciwległych możliwości podjęcia decyzji (tak / nie), a po kliknięciu przycisku zwraca wartość logiczną określającą, czy kliknięto przycisk "Continue".

Możemy iść dalej ⏩.

BUTTONBOX

"buttonbox" to okno z przyciskami, które działa podobnie do "ccbox", aczkolwiek tutaj możemy zdecydować ile ma być opcji 🔥! To jest przykład wywołania funkcji "buttonbox", które wyświetli okno z trzema przyciskami do wyboru 👇:

selected_button_text = easygui.buttonbox('Moja treść komunikatu', 'Okno buttonbox w EasyGUI', ['Jeden', 'Dwa', 'Trzy'])

Funkcja posiada 3 istotne (opcjonalne) parametry 👇:

  1. łańcuch znaków jako treść dotycząca wyboru jednej z dostępnych opcji,
  2. łańcuch znaków jako tytuł samego okna,
  3. lista lub krotka łańcuchów znaków określających liczbę przycisków i ich napisy (tyle ile jest łańcuchów, tyle przycisków ujrzysz w oknie).

Te parametry nie są obowiązkowe i można poprzestać na samym wywołaniu funkcji bez niczego, natomiast wtedy to okno nie będzie miało żadnych napisów, a przyciski otrzymają mało eleganckie dla użytkownika napisy typu "Button1" 🙂.

Podobnie jak przy funkcji "ccbox", tutaj również jest zwracana wartość, tylko tym razem postaci łańcucha znaków odzwierciedlającego napis na klikniętym przycisku ⚠️. Czyli jak klikniemy przycisk o treści "Jeden", to wartością uzyskaną na wyjściu będzie "Jeden" 💡. Dzięki temu, przy użyciu instrukcji warunkowych, możemy określić dalszy ciąg zachowania się programu ✅!

Wygląd okna "buttonbox" o powyższej postaci prezentuje się następująco 👇:

Okno "buttonbox" pakietu "EasyGUI" w języku Python

Widok okna "buttonbox" modułu "EasyGUI".

Wszystko 😊.

Funkcja "buttonbox" pakietu "EasyGUI" w języku Python

"buttonbox" jest formą okna pozwalającą na samodzielne określenie ile przycisków ma się znajdować oraz jak mają być podpisane. Jako wartość wynikową zwraca łańcuch znaków jako napis na przycisku, który został wciśnięty.

Przechodzimy do ukazania ostatniego elementu jaki mam w planie 👀!

ENTERBOX

"enterbox", czyli inaczej, pole tekstowe 🔤. To jest okno z ramką na środku, do którego możemy przy użyciu klawiatury wprowadzać znaki i wysłać łańcuch znaków do programu 🚀. Posiada również 2 przyciski na samym dole do zatwierdzania i anulowania czynności wpisywania łańcucha ⏏️.

Przykład użycia tej funkcji wygląda tak 👇:

typed_string = easygui.enterbox('Wprowadź dowolny ciąg znaków:', 'Okno enterbox w EasyGUI', 'Domyślna wartość pola tekstowego')

Funkcja przyjmuje 3 parametry, wszystkie typu łańcuchowego 👇:

  1. treść nad polem tekstowym dotycząca wprowadzenia ciągu znaków do pola tekstowego,
  2. tytuł samego okna,
  3. łańcuch wpisany w pole tekstowe zaraz po wyświetleniu okna (wartość domyślna).

W tym przypadku także wszystkie parametry są opcjonalne, natomiast zdecydowanie lepiej je umieścić, aby wpływać na wygląd treści elementów okna (zarówno tekstów, jak i samego pola tekstowego) 👍. A zwracana wartość zależy od tego, który przycisk u dołu zostanie wciśnięty 👇:

  • jeżeli klikniemy przycisk "OK", to na wyjściu pojawi się ten sam łańcuch jaki podaliśmy wewnątrz pola tekstowego,
  • jeżeli klikniemy przycisk "Cancel", to wynikiem będzie wartość "None" (typ danych w Pythonie oznaczający brak jakiejkolwiek wartości ℹ️).

Potem przy zastosowaniu instrukcji warunkowych, możemy uzależnić dalszy przebieg programu od wartości tego łańcucha ✅!

Tak wygląda okno "enterbox", gdy uruchomimy program z jego wywołaniem 👇:

Okno "enterbox" pakietu "EasyGUI" w języku Python

Widok okna "enterbox" modułu "EasyGUI".

I to tyle co warto o tym wiedzieć 🙂.

Funkcja "enterbox" pakietu "EasyGUI" w języku Python

"enterbox" odnosi się do okna z polem tekstowym, do którego możemy wprowadzić dowolny ciąg znaków, a po kliknięciu przycisku "OK", jest zwracany na wyjściu (lub zwraca "None", gdy wciśnięto przycisk "Cancel").


Zakończyliśmy wspólnie przegląd niektórych możliwości modułu "EasyGUI" w języku Python 🏁! Jest dobry do stawiania pierwszych kroków w programowanie graficznych aplikacji, natomiast nie jest przeznaczony do tworzenia ich w stylu jaki znamy, czyli dostęp do wielu opcji naraz w jednym widoku 🚫. On stawia na prostą "liniową" formę bez uwzględniania wielu ścieżek i połączeń pomiędzy elementami ↔️. Możesz chcieć zainteresować się pakietem "PyQt5" omawianym w następnym artykule, który już umożliwia projektowanie aplikacji w ten sposób 🌟!

PODOBNE ARTYKUŁY