Pierwsze kroki w programowaniu z Qt/pl

Pierwsze kroki w programowaniu z Qt

Witamy w świecie Qt – wieloplatformowego zestawu narzędzi i bibliotek do tworzenia aplikacji z graficznym interfejsem użytkownika (GUI) i nie tylko. Nauczymy cię tutaj podstaw Qt pokazując jak zaimplementować prostą aplikację typu Notatnik. Po lekturze tego przewodnika powinieneś być gotów do zagłębienia się w dokumentację API oraz omówień poszczególnych modułów i rozwiązań dostępnych w Qt. Znajdywanie informacji potrzebnych do stworzenia aplikacji, którą zapewne od dawna planujesz napisać, będzie wówczas przebiegać sprawniej.

Powitalny notatnik

W pierwszym przykładzie stworzymy i pokażemy pole edycji tekstu w jego własnym oknie. Jest to najprostszy możliwy program napisany w Qt posiadający GUI.

screenshot

Tak wygląda kod owej aplikacji:

Prześledźmy go linijka po linijce. W dwóch pierwszych dołączamy pliki nagłówkowe QApplication [doc.qt.nokia.com] i QTextEdit [doc.qt.nokia.com], czyli dwóch klas, których użyjemy w tym przykładzie. Wszystkie klasy Qt posiadają pliki nagłówkowe ####### tak samo jak ##### klas, których dotyczą.

W 6 linijce tworzony jest obiekt typu QApplication [doc.qt.nokia.com]. Zarządza on zasobami aplikacji i jest niezbędny do uruchomienia jakiegokolwiek programu Qt mającego GUI. Parametry argv i args są wymagane, ponieważ każda aplikacja Qt obsługuje zestaw opcji, które można przekazać do programu z linii poleceń (np. -graphicssystem).

W 8 linijce powstaje obiekt typu QTextEdit [doc.qt.nokia.com]. Jest to element mający wizualną reprezentację w GUI, a takie w Qt ######## widżetami (z ang. widget). Inne widżety to np. pasek przesuwania (ang. scroll bar), etykieta (ang. label) czy przycisk opcji (ang. radio button). Widżet może być także kontenerem dla innych widżetów, a okno dialogowe jest tego przykładem.

Linijka 9 powoduje wyświetlenie się pola edycji tekstu z jego własną ramką okna. Ponieważ widżety funkcjonują także jako kontenery (np. QMainWindow [doc.qt.nokia.com] z jego paskami narzędzi, menu, statusu i paroma innymi widżetami), możliwe jest wyświetlenie pojedynczego widżetu w jego własnym oknie. Widżety nie są domyślnie widoczne, ale funkcja show() [doc.qt.nokia.com] pozwala nam zmienić ten stan rzeczy.

Ostatnia linijka w funkcji main() odpowiedzialna jest za wejście obiektu typu QApplication [doc.qt.nokia.com] w jego pętlę zdarzeń (ang. event loop). Programy oparte na Qt korzystają ze zdarzeń, które są generowane i przesyłane w trakcie działania aplikacji między widżetami. Takie zdarzenia to np. naciśnięcie klawisza na klawiaturze lub myszy. W trakcie pisania tekstu w polu edycji, widżet je reprezentujący odbiera zdarzenia informujące o naciśnięciu poszczególnych klawiszy i rysuje wpisany tekst.

Nim uruchomimy naszą aplikację, musimy ją najpierw zbudować. Dokonać tego możemy otwierając z okno z linią poleceń, przechodząc do katalogu, w którym trzymamy wyżej zaprezentowany plik .cpp z kodem programu i wykonując następujące polecenia:

To spowoduje utworzenie pliku wykonywalnego (w systemie Windows może zaistnieć potrzeba użycia polecenia nmake zamiast make; ponadto plik będzie umieszczony w podkatalogu debug lub release). qmake to narzędzie Qt wspierające budowanie aplikacji poprzez generację plików Makefile [pl.wikipedia.org], które opisują proces budowania, na bazie specjalnych plików konfiguracyjnych. Taki plik konfiguracyjny (o rozszerzeniu .pro) może zostać wygenerowany automatycznie również dzięki aplikacji qmake przy użyciu opcji -project. Pisaniem własnych plików .pro zajmiemy się później.

Dowiedz się więcej

• Widżety i geometria okien – Window and Dialog Widgets [doc.qt.nokia.com]
• Zdarzenia i ich obsługa – The Event System [doc.qt.nokia.com]

Dodanie przycisku Quit

W prawdziwej aplikacji zazwyczaj potrzeba więcej niż jednego widżetu. Dodamy więc QPushButton – przycisk – pod polem edycji tekstu. Przycisk ten sprawi, że aplikacja zakończy się w momencie jego naciśnięcia (np. za pomocą kliknięcia myszą).

screenshot

Kod źródłowy dla tego przykładu:

W 10 linijce wykorzystujemy mechanizm sygnałów i slotów Qt, aby sprawić, że aplikacja zakończy się, kiedy przycisk Quit zostanie naciśnięty. Sygnał, kiedy uruchomiony, wywoła wszystkie powiązane z nim sloty.

quit() [doc.qt.nokia.com] jest slotem klasy QApplication [doc.qt.nokia.com], który zakańcza aplikację. clicked() [doc.qt.nokia.com] to sygnał QPushButton [doc.qt.nokia.com], który emitowany jest, gdy przycisk zostanie przyciśnięty. Statyczna metoda QObject::connect() [doc.qt.nokia.com] zajmuje się dowiązaniem slotu do sygnału. SIGNAL oraz SLOT to dwa makra, które opisują metody mające zostać ze sobą powiązane. Trzeba również podać wskaźniki do obiektów, które emitują i otrzymują dany sygnał.

W linijce 12 tworzymy QVBoxLayout [doc.qt.nokia.com]. Jak wspominaliśmy, widżety mogą zawierać inne widżety. Można ustawić lokalizację i wymiary każdego widżetu bezpośrednio ale zazwyczaj łatwiej jest użyć layoutu (z ang. „rozkład” lub „układ graficzny” – sposób rozmieszczenia). Layout zarządza wymiarami wszystkich swoich podwidżetów. Na przykład QVBoxLayout ustawia wszystkie podwidżety pionowo w rzędzie.

Linijki 13 oraz 14 dodają pole edycji tekstu oraz przycisk do layoutu. W linijce 17 ustawiony zostaje layout naszego widżetu.

Dowiedz się więcej

• Sygnały i sloty – Signals & Slots [doc.qt.nokia.com]
• Sposoby rozmieszczania – Layout Management [doc.qt.nokia.com], Widgets and Layouts [doc.qt.nokia.com], Layout Examples [doc.qt.nokia.com]
• Widżety dostępne w Qt – Qt Widget Gallery [doc.qt.nokia.com], Widget Examples [doc.qt.nokia.com]

Definiowanie klas pochodnych od QWidget

Kiedy użytkownik chce wyjść z aplikacji, możesz chcieć pokazać okno dialogowe, które pyta, czy on, lub ona, rzeczywiście tego chce. W tym przykładzie, stworzymy klasę dziedziczącą z QWidget [doc.qt.nokia.com] i dodamy slot, do którego podłączymy przycisk Quit.

screenshot

Spójrzmy na kod źródłówy:

Makro Q_OBJECT musi być pierwszym elementem w definicji klasy. Deklaruje ono naszą klasę jako QObject [doc.qt.nokia.com] (oczywiście musi ona również dziedziczyć z QObject [doc.qt.nokia.com]). Dodaje to kilka funkcjonalności do zwykłej klasy C++. Przede wszystkim, ##### klasy i jej slotów mogą być pobrane w trakcie działania programu. Można również pobrać typy parametrów tych slotów i je wywołać.

W linijce 13 deklarowany jest, przy użyciu makra slots, slot quit(). Teraz można podłączyć ten slot do sygnałów ze zgadzającą się sygnaturą, tj. z jakimkolwiek sygnałem, który nie ma parametrów.

Zamiast ustawiania GUI i łączenia slotów w funkcji main(), użyjemy konstruktora klasy Notepad.

Jak widać było w definicji klasy, używamy wskaźników do naszych QObject-ów (textEdit oraz quitButton). Z zasady zawsze powinno się tworzyć QObiekty [doc.qt.nokia.com] na stosie i nigdy ich nie kopiować.

Następnie używamy metody tr() [doc.qt.nokia.com] dla wszystkich widocznych dla użytkownika ciągów tekstu. Metoda ta jest niezbędna jeżeli chcesz udostępniać swoją aplikację w więcej niż jednym języku (np. po polsku i po angielsku). Nie będziemy wchodzić w szczegóły, możesz zgłębić temat pod linkiem Qt Linguist Manual z tabeli poniżej.

Dowiedz się więcej

• tr() i internacjonalizacja – Qt Linguist Manual [doc.qt.nokia.com], Writing Source Code for Translation [doc.qt.nokia.com], Hello tr() Example [doc.qt.nokia.com], Internationalization with Qt [doc.qt.nokia.com]
• QObiekty [doc.qt.nokia.com] i model obiektów Qt (materiał kluczowy do zrozumienia Qt) – Object Model [doc.qt.nokia.com]
• qmake i system budowania Qt – qmake Manual [doc.qt.nokia.com]

Tworzenie pliku .pro

Na potrzeby tego przykładu, napiszemy własny plik .pro zamiast używać qmake z opcją -project.

Do zbudowania naszej aplikacji wystarczą teraz dwa polecenia:

Używanie QMainWindow

Wiele aplikacji skorzysta z plusów używania QMainWindow [doc.qt.nokia.com]. Klasa ta dostarcza swój własny layout, do którego można dodać menu, zadokowane widgety, paski narzędzi i pasek statusu. QMainWindow [doc.qt.nokia.com] ma centralną strefę, która może być zajmowana przez dowolny widget. W naszym przypadku będzie to pole edycji tekstu.

screenshot

Oto kod nowa definicja klasy Notepad:

Dołączyliśmy dwa nowe sloty, które zapiszą i wczytają dokument. Zaimplementujemy je w następnej sekcji.

Bardzo często w głównym oknie ten sam slot może być wywołany przez kilka widżetów. Przykładem może być opcja w menu i przycisk na pasku narzędzi. Zeby to uprościć, Qt dostarcza klasę QAction [doc.qt.nokia.com], obiektowi której podać można kilka widżetów i podłączyć go do slotu. Na przykład QMenu [doc.qt.nokia.com] i QToolBar [doc.qt.nokia.com] mogą stworzyć wpisy w menu i przycisku na pasku z tej samej QAction. Za chwilę zobaczymy, w jaki sposób to zrobić.

Tak jak wcześniej, używamy konstruktora klasy Notepad do zestawienia GUI:

QAction [doc.qt.nokia.com] tworzone są z tekstu, który ma pojawić się na widżecie, do którego je dodajemy – w tym przypadku do opcji w menu. Gdybyśmy chcieli dodać akcje dodatkowo do paska narzędzi, moglibyśmy dać im również ikony [doc.qt.nokia.com].

Teraz, w momencie kliknięcia wpisu w menu, uruchomi on akcję i wywoła odpowiedni slot.

Dowiedz się więcej

• Główne okna i klasy je udostępniające – Application Main Window [doc.qt.nokia.com], Main Window Examples [doc.qt.nokia.com]
• Aplikacje MDI – QMdiArea [doc.qt.nokia.com], MDI Example [doc.qt.nokia.com]

Zapisywanie i ładowanie

W tym przykładzie, zaimplementujemy funkcjonalność slotów open() oraz save(), które dodaliśmy w poprzedniej sekcji.

screenshot

Zaczniemy od slotu open():

Pierwszy krok to zapytanie użytkownika o nazwę pliku do wczytania. Qt dostarcza QFileDialog [doc.qt.nokia.com], który jest oknem dialogowym, gdzie użytkownik wybiera plik. Obrazek wyżej ukazuje takie okno na systemie Kubuntu. Statyczna metoda getOpenFileName() [doc.qt.nokia.com] wyświetla modalne okno dialogowe i nie zwraca wartości dopóki użytkownik nie wybierze pliku. Zwracana przez nią wartość to ścieżka do wybranego pliku, lub pusty ciąg jeżeli użytkownik anulowal wybór.

Gdy mamy ścieżkę, otwieramy plik metodą open() [doc.qt.nokia.com], która zwraca true, jeżeli operacja się powiodła. Nie będziemy zgłębiać obsługi błędów, jest ona opisane w linkach z tabeli Dowiedz się więcej. Jeżeli otwarcie pliku jest niemożliwe, używamy QMessageBox [doc.qt.nokia.com] do wyświetlenia okna z komunikatem błędu (zobacz opis klasy QMessageBox [doc.qt.nokia.com] po więcej szczegółów).

Sam odczyt danych jest trywialny dzięki użyciu metody readAll() [doc.qt.nokia.com], która zwraca wszystkie dane w postaci QByteArray [doc.qt.nokia.com]. constData() [doc.qt.nokia.com] zwraca tablicę jako const char*, dla której klasa QString [doc.qt.nokia.com] ma zdefiniowany konstruktor. Następnie zawartość pliku może być wyświetlona w polu edycji. Możemy więc zamknąć plik metodą close() [doc.qt.nokia.com], aby oddać systemowi operacyjnemu deskryptor pliku.

Przejdźmy do slotu save():

Do zapisywania zawartości pola edycji do pliku używamy klasy QTextStream [doc.qt.nokia.com], która opakowuje obiekt QFile [doc.qt.nokia.com]. Strumień może zapisywać QString [doc.qt.nokia.com] bezpośrednio do pliku, natomiast QFile [doc.qt.nokia.com] akceptuje jedynie czyste dane (char*) przy pomocy metody write() [doc.qt.nokia.com] z klasy QIODevice [doc.qt.nokia.com].

Dowiedz się więcej

• Pliki i urządzenia we/wy – QFile [doc.qt.nokia.com], QIODevice [doc.qt.nokia.com]

It’s free translation of the Getting Started Programming with Qt [doc.qt.nokia.com] article.