C++. Wykorzystaj potęgę aplikacji graficznych

(1)

Wydawnictwo Helion ul. Koœciuszki 1c 44-100 Gliwice tel. 032 230 98 63 e-mail: helion@helion.pl

C++. Wykorzystaj potêgê aplikacji graficznych

Autor: Janusz Ganczarski, Mariusz Owczarek ISBN: 978-83-246-1473-8 Format: 158x235, stron: 448

Napisz wieloplatformowe programy w C++

• Jak korzystaæ z bibliotek wxWidgets oraz Qt?

• W jaki sposób implementowaæ obs³ugê zdarzeñ w aplikacjach?

• Jak budowaæ aplikacje sieciowe i bazodanowe?

Okres dominacji jednego systemu operacyjnego i przeznaczonych dla niego rozwi¹zañ powoli odchodzi do historii. Fenomen popularnoœci ró¿nych dystrybucji Linuksa i coraz mocniejsza pozycja komputerów Mac sprawiaj¹, ¿e wiele firm produkuj¹cych oprogramowanie decyduje siê na tworzenie rozwi¹zañ wieloplatformowych.

W przypadku ogromnych korporacji stworzenie zespo³ów programistycznych pracuj¹cych równolegle nad kilkoma wersjami jednej aplikacji dla ró¿nych systemów operacyjnych nie stanowi problemu, ale w mniejszych firmach jest to niemo¿liwe.

Tu z pomoc¹ przychodz¹ biblioteki pozwalaj¹ce na tworzenie kodu Ÿród³owego prawid³owo kompiluj¹cego siê na ka¿dej platformie, na której je zainstalowano.

Ksi¹¿ka „C++. Wykorzystaj potêgê aplikacji graficznych” opisuje tworzenie oprogramowania z wykorzystaniem dwóch takich w³aœnie bibliotek – wxWidgets oraz Qt. Czytaj¹c j¹, dowiesz siê, jak wykorzystaæ jêzyk C++ i œrodowisko Dev-C++

do pisania programów, z których korzystaæ bêd¹ mogli u¿ytkownicy systemu Windows, Linuksa i Mac OS. Nauczysz siê stosowaæ kontrolki i komponenty, budowaæ menu i interfejsy u¿ytkownika, obs³ugiwaæ zdarzenia i implementowaæ operacje graficzne.

Przeczytasz tak¿e o aplikacjach bazodanowych i sieciowych. Ka¿de z zagadnieñ omówiono zarówno w kontekœcie biblioteki wxWidgets, jak i biblioteki Qt, dziêki czemu poznasz dwie metody rozwi¹zywania tych samych zadañ programistycznych – by wybraæ sobie tê, która bardziej Ci odpowiada.

• Instalacja œrodowiska programistycznego i bibliotek

• Struktura aplikacji i podstawowe komponenty

• Stosowanie komponentów

• Obs³uga zdarzeñ myszy i klawiatury

• Budowanie menu aplikacji

• Komunikacja sieciowa

• Operacje graficzne

• Po³¹czenia z bazami danych

• Drukowanie z poziomu aplikacji

Dziêki tej ksi¹¿ce stworzysz aplikacje,

które doceni¹ u¿ytkownicy wszystkich systemów operacyjnych.

(2)

Spis tre�ci

Rozdzia� 1. Opis i instalacja bibliotek ... 9

Wst�p ... 9

Biblioteka wxWidgets ... 9

Instalacja �rodowiska wxDev-C++ ... 10

Elementy wxDev-C++ ... 10

Tworzenie projektu aplikacji w wxDev-C++ ... 11

Biblioteka Qt ... 12

Instalacja Dev-C++ ... 12

Instalacja bibliotek Qt ... 12

Konfiguracja Dev-C++ do wspó�pracy z Qt ... 13

Tworzenie szablonu projektu aplikacji Qt ... 15

Rozdzia� 2. Struktura aplikacji wxWidgets ... 19

Cz��ci sk�adowe aplikacji ... 19

Zgodno�� ze standardem Unicode ... 22

Tworzenie kontrolek ... 23

Zdarzenia ... 24

Wizualne tworzenie aplikacji w �rodowisku wxDev-C++ ... 26

Struktura projektu wykorzystywana podczas budowy aplikacji za pomoc� IDE ... 27

Nazwy parametrów u�yte w ksi��ce ... 28

Test ... 28

Rozdzia� 3. Podstawowe komponenty aplikacji ... 31

Okno wxFrame ... 31

Style okna ... 32

Ikona w oknie aplikacji ... 33

Czcionki w aplikacji ... 34

Panele wxPanel ... 35

Przyciski wxButton ... 36

Etykieta wxStaticText ... 38

Pola wyboru i przyciski opcji ... 40

Komponent wprowadzania i edycji tekstu wxTextCtrl ... 44

Test ... 48

Rozdzia� 4. Wi�cej o zdarzeniach ... 49

Rodzaje zdarze� ... 49

Dynamiczna obs�uga zdarze� ... 49

Rozpoznawanie obiektu generuj�cego zdarzenie w metodzie obs�ugi ... 53

(3)

4 C++. Wykorzystaj pot�g� aplikacji graficznych

Obs�uga zdarze� myszy ... 56

Obs�uga zdarze� klawiatury ... 58

Test ... 61

Rozdzia� 5. Zastosowania menu ... 63

Podstawy menu ... 63

Obs�uga menu za pomoc� tabeli zdarze� ... 66

Obs�uga menu za pomoc� metody Connect() ... 68

Tworzenie menu podczas dzia�ania aplikacji ... 70

Menu kontekstowe ... 73

Skróty klawiaturowe w opcjach menu ... 75

Paski narz�dzi ... 77

Pasek statusu ... 81

Test ... 85

Rozdzia� 6. Okna dialogowe ... 87

Okna komunikatów ... 87

Okno z mo�liwo�ci� wprowadzania danych ... 89

Zwyk�e okno do wprowadzania tekstu ... 89

Okno has�a ... 90

Okna zapisu i otwarcia pliku ... 92

Okno wyboru czcionki ... 94

Paleta kolorów ... 96

Test ... 98

Rozdzia� 7. Podstawy aplikacji sieciowych ... 101

Protokó� FTP ... 101

Logowanie do serwera i wy�wietlanie zawarto�ci katalogu ... 101

Operacje na folderach i plikach ... 105

Pobieranie plików z serwera ... 107

Wysy�anie plików z dysku lokalnego ... 109

Protokó� HTTP ... 111

Pobieranie stron Web ... 111

Wy�wietlanie stron w postaci graficznej — komponent wxHtmlWindow ... 113

Prezentacja wyników dzia�ania aplikacji w postaci HTML ... 115

Komórki wxHtmlCell ... 118

Test ... 122

Rozdzia� 8. Grafika ... 125

Mapy bitowe wxBitmap ... 125

Kontekst urz�dzenia — klasa wxDC ... 126

Rysowanie w oknie — kontekst wxClientDC ... 128

Obs�uga zdarzenia Paint — kontekst wxPaintDC ... 132

Rysowanie w pami�ci — wxMemoryDC ... 134

Kontekst ekranu — wxScreenDC ... 136

Pióro wxPen ... 138

P�dzel wxBrush ... 141

Podstawy obs�ugi biblioteki OpenGL w wxWidgets ... 143

Rysowanie obiektów trójwymiarowych ... 147

Animacje ... 149

Test ... 151

(4)

Spis tre�ci 5

Rozdzia� 9. Aplikacje baz danych ... 153

Bazy danych a wxWidgets ... 153

Instalacja PostgreSQL ... 153

Inicjalizacja bazy ... 155

Organizacja i typy danych w bazach PostgreSQL ... 156

J�zyk SQL ... 158

Po��czenie aplikacji wxWidgets z baz� danych ... 158

Dodawanie tabel do bazy ... 161

Zapis danych do tabeli ... 165

Wyszukiwanie i odczyt danych z tabeli ... 167

Zmiana warto�ci w rekordach ... 171

Test ... 172

Rozdzia� 10. Drukowanie w wxWidgets ... 175

Drukowanie na ró�nych platformach ... 175

Drukowanie tekstu ... 175

Drukowanie tekstu z formatowaniem ... 178

Podgl�d wydruku tekstu ... 180

Drukowanie grafiki ... 181

Obiekt wydruku wxPrintout ... 181

Urz�dzenie drukarki — klasa wxPrinter ... 183

Okno podgl�du drukowania grafiki ... 185

Skalowanie wydruku graficznego ... 187

Test ... 191

Rozdzia� 11. Elementy aplikacji wielow�tkowych ... 195

Wielow�tkowo�� ... 195

Sekcje krytyczne ... 196

Wzajemne wykluczenia ... 196

Semafory ... 196

Klasa wxThread ... 196

Sekcja krytyczna — wxCriticalSection ... 198

Wykluczenie wxMutex ... 199

Semafor wxSemaphore ... 199

Prosta aplikacja z kilkoma w�tkami ... 200

Przekazywanie danych z w�tku poprzez zdarzenia ... 204

Ograniczenie ilo�ci w�tków za pomoc� semafora ... 205

Test ... 207

Rozdzia� 12. Struktura aplikacji Qt ... 209

Korzystamy z szablonu ... 209

Pierwszy program krok po kroku ... 211

Wy�wietlamy polskie znaki ... 212

Podstawy hierarchii elementów interfejsu u�ytkownika ... 214

Tworzenie w�asnej klasy okna ... 216

Qt Designer ... 218

Integracja Qt Designer i Dev-C++ ... 221

Wykorzystanie formularzy w programach ... 222

Test ... 228

(5)

Rozdzia� 13. Podstawowe komponenty aplikacji ... 229

Klasa QMainWindow ... 229

Rozpoczynamy budow� edytora tekstu ... 229

Rodzaje okien ... 232

Ikona aplikacji i zasoby ... 234

Menu ... 236

Klawisze skrótu ... 238

Komunikaty na pasku statusu ... 239

Pasek statusu ... 241

Pasek narz�dzi ... 242

Wygl�d paska narz�dzi ... 242

Dodajemy w�asne gniazda ... 244

Edytor tekstu — formularz w Qt Designer ... 247

Klasa QString ... 250

Test ... 253

Rozdzia� 14. Wi�cej o zdarzeniach ... 255

Sygna�y i gniazda ... 255

Metaobiekty ... 255

Definiowanie gniazd ... 256

Definiowanie oraz emitowanie sygna�ów ... 257

Kompilator MOC ... 257

Definiowanie po��cze� ... 258

Usuwanie po��cze� ... 260

Dynamiczna obs�uga po��cze� ... 260

Program przyk�adowy ... 261

Obs�uga zdarze� ... 262

Rodzaje zdarze� ... 263

Informacje przekazywane przy zdarzeniach ... 263

Selektywna obs�uga zdarze� ... 267

Test ... 269

Rozdzia� 15. Zastosowania menu ... 271

Menu wielopoziomowe ... 271

Zmiana parametrów czcionki w menu ... 273

W�a�ciwo�ci elementów menu, sygna�y i gniazda ... 276

Grupowanie elementów menu ... 279

Menu podr�czne programu ... 282

Dynamiczne tworzenie elementów menu ... 284

Test ... 285

Rozdzia� 16. Okna dialogowe ... 287

Okna komunikatów ... 287

Okna pobierania danych ... 296

Okna narz�dziowe ... 299

Okno wyboru koloru ... 300

Okno wyboru czcionki ... 302

Obs�uga plików i folderów ... 303

Test ... 306

Rozdzia� 17. Podstawy aplikacji sieciowych ... 307

Obs�uga protokó�u FTP ... 307

Operacje na serwerze FTP ... 307

Sygna�y klasy QFtp ... 309

(6)

Spis tre�ci 7

Adresy zasobów internetowych ... 309

Obs�uga protokó�u HTTP ... 319

Operacje na serwerze HTTP ... 319

Sygna�y klasy QHttp ... 321

Test ... 326

Rozdzia� 18. Grafika ... 329

System graficzny w bibliotece Qt ... 329

Uk�ad wspó�rz�dnych i rasteryzacja prymitywów ... 330

Podstawowe zasady rysowania ... 332

Obs�uga plików graficznych ... 332

Parametry pióra ... 339

Parametry p�dzla ... 346

Prymitywy graficzne ... 348

Rysowanie napisów ... 350

Jako�� renderingu ... 353

OpenGL ... 354

SVG ... 359

Test ... 364

Rozdzia� 19. Wykorzystanie komponentów baz danych ... 365

Bazy danych w bibliotece Qt ... 365

Obs�ugiwane bazy ... 365

Instalacja i konfiguracja bazy danych Firebird 2.0 ... 366

Instalacja ... 366

Kompilacja sterownika ... 367

Utworzenie bazy ... 368

Po��czenie z baz� danych ... 369

Obs�uga b��dów ... 370

Tworzenie tabel ... 372

Podstawowe elementy j�zyka SQL ... 372

Wybrane typy danych ... 372

Obs�uga zapyta� ... 372

Dodawanie danych do tabel ... 375

Wyszukiwanie danych ... 376

Modyfikacja i usuwanie danych ... 380

Test ... 389

Rozdzia� 20. Drukowanie pod Qt ... 391

Urz�dzenie graficzne do druku ... 391

Klasa QPrinter ... 391

Uk�ad wspó�rz�dnych ... 392

Podzia� na strony ... 393

Okna dialogowe obs�uguj�ce drukowanie ... 393

Drukowanie tekstu ... 394

Drukowanie rysunków ... 395

Drukowanie do plików PDF ... 397

Podgl�d wydruku ... 399

Test ... 405

(7)

Rozdzia� 21. Programowanie wielow�tkowe ... 407

Podstawowe zagadnienia programowania wielow�tkowego ... 407

W�tki w bibliotece Qt ... 408

Uruchamianie i kontrola w�tków ... 409

Przerwanie i zatrzymanie w�tku ... 410

Sygna�y klasy QThread ... 410

Funkcja oczekuj�ca ... 411

Synchronizacja w�tków ... 411

Muteksy ... 413

Semafory ... 414

W�tki w aplikacji GUI ... 415

Test ... 422

Dodatek A Odpowiedzi do testów ... 423

Skorowidz ... 425

(8)

Rozdzia 12.

Struktura aplikacji Qt

W pierwszym rozdziale po!wi"conym bibliotece Qt poznasz podstawowe zasady do- tycz$ce struktury aplikacji w tej%e bibliotece. Utworzymy g&ówne okno aplikacji, umie-

!cimy na nim pierwsze elementy graficznego interfejsu u%ytkownika (GUI), zmierzymy si" z problemem polskich znaków, aby w ko'cu pozna* podstawy obs&ugi zdarze' w bibliotece Qt. Nast"pnie po krótkim wprowadzeniu do Qt Designera wykonamy tak$

sam$ prac" ponownie, ale stosuj$c to znakomite narz"dzie z biblioteki Qt. Do tworzenia programów b"dziemy korzysta* z szablonu opisanego w rozdziale 1.

Korzystamy z szablonu

Przyk ad 12.1. Pierwszy program w Qt

— wykorzystanie szablonu aplikacji

1.

Aby skorzysta z szablonu, wybierz z menu opcj" Plik\Nowy Projekt i dalej* w zak&adce GUI wska% szablon aplikacji Qt, tak jak to przedstawiamy na rysunku 12.1. Do ewentualnej zmiany pozostaje nazwa projektu. +rodowisko Dev-C++ przyjmuje, %e nowy projekt nazywa si" po prostu Projekt i do tej nazwy dodaje mu kolejny numer.

2.

Po wybraniu szablonu pliki projektu zapisz w wybranym folderze i w efekcie powiniene! uzyska* program analogiczny do przedstawionego na rysunku 12.2.

Musisz jeszcze zapisa* plik 3ród&owy programu, ewentualnie zmieniaj$c przy tym jego nazw" z domy!lnego main.cpp.

Warto wspomnie* jeszcze o jednej wa%nej zasadzie obowi$zuj$cej przy zapisie

projektów. Z uwagi na generowanie przy ka%dym projekcie pliku Makefile.win

zawieraj$cego instrukcje dla narz"dzia

make

, koniecznie zapisuj pliki projektów

w odr"bnych katalogach. W przeciwnym wypadku mo%e doj!* do przypadkowej

utraty zawarto!ci tego pliku.

(9)

210 C++. Wykorzystaj pot#g# aplikacji graficznych

Rysunek 12.1.

Okno wyboru nowego projektu z szablonem aplikacji Qt 4.3.1

Rysunek 12.2. Widok 7rodowiska Dev-C++ po wygenerowaniu szablonu programu Qt 3.

Oto tekst 3ród&owy ca&ego programu:

#include <QApplication>

#include <QPushButton>

int main(int argc, char *argv[]) {

QApplication app (argc, argv);

(10)

Rozdzia 12. Struktura aplikacji Qt 211

QPushButton button ("Hello world!");

button.resize (100, 30);

button.show();

return app.exec();

}

4.

Kompilacja programu wymaga wybrania z menu opcji Projekt\Kompiluj

i uruchom lub u%ycia klawisza F9. W efekcie otrzymamy okno przedstawione

na rysunku 12.3. Program nawi$zuje do klasycznej postaci pierwszego programu, który w swojej karierze napisa&o wielu programistów. Efekt jego dzia&ania wprawdzie nie jest imponuj$cy, ale pokazuje pot"g" biblioteki Qt, która w kilku wierszach kodu umo%liwia wy!wietlenie okna z przyciskiem.

Rysunek 12.3.

Pocz@tkowy wygl@d okna pierwszego programu

Pierwszy program krok po kroku

Przeanalizujemy teraz krok po kroku kod 3ród&owy programu wygenerowanego przez szablon. Dwa pocz$tkowe wiersze programu:

w&$czaj$ pliki nag&ówkowe biblioteki Qt zawieraj$ce definicje klas

QApplication

i

QPushButton

. Pierwszej z nich u%ywa ka%dy program, który korzysta z graficznych elementów biblioteki Qt. Jej zadaniem jest inicjalizacja i zako'czenie dzia&ania pro- gramu, przetwarzanie p"tli zdarze' i umo%liwienie ich obs&ugi przez elementy graficz- nego interfejsu. Klasa ta dziedziczy po klasie

QCoreApplication

, która z kolei jest klas$

bazow$ dla programów pracuj$cych w trybie konsoli (tekstowym). Klasa ta jest po- tomkiem klasy

QObject

, która jest baz$ wszystkich klas w bibliotece Qt. Druga klasa wykorzystywana w programie reprezentuje przycisk. Warto zauwa%y, %e nazwa pliku nag&ówkowego odpowiada nazwie danej klasy. Zasada ta obowi$zuje dla ka%dej klasy biblioteki Qt nale%$cej do tzw. publicznej cz"!ci biblioteki i trzeba przyzna, %e zna- komicie u&atwia prac".

Jak wy%ej wspominali!my,

QApplication

jest bazow$ klas$ dla wszystkich programów korzystaj$cych z biblioteki Qt, które pracuj$ w trybie graficznym. Parametry u%ytego w programie konstruktora tej klasy:

odpowiadaj$ standardowym argumentom funkcji

main

:

int main(int argc, char *argv[])

Tak%e w ostatnim wierszu programu korzystamy z klasy

QApplication

:

return app.exec();

(11)

Metoda

exec

przekazuje obs&ug" p"tli zdarze', a tym samym dalsze sterowanie pro- gramem, do biblioteki Qt. Poza takimi wyj$tkami jak okna komunikatów generowane przy u%yciu klasy

QMessageBox

, wywo&anie

exec

jest niezb"dne do wy!wietlenia gra- ficznych elementów programu, czyli najcz"!ciej ca&ego interfejsu aplikacji.

Klasa

QPushButton

reprezentuje standardowy przycisk. Przycisk mo%e, oprócz tekstu, zawiera* tak%e ikon". W programie tworzony jest przycisk zawieraj$cy tekst wskazany jako parametr konstruktora klasy:

QPushButton button ("Hello world!");

Po utworzeniu przycisku zmieniamy jego wymiary tak, aby napis w nim zawarty by&

w ca&o!ci widoczny w wy!wietlanym oknie:

button.resize (100, 30);

Metoda

resize

, która to wykonuje, pochodzi z klasy

QWidget

b"d$cej baz$ wszystkich wizualnych elementów GUI w bibliotece Qt. Z tej samej klasy pochodzi metoda

show

, która wy!wietla bie%$c$ kontrolk" i wszystkie elementy pochodne:

button.show();

Z obiektów klas dziedzicz$cych po!rednio lub bezpo!rednio po klasie

QWidget

b"dziemy wielokrotnie korzysta. Ich cech$ charakterystyczn$, któr$ przedstawimy jeszcze w tym rozdziale, jest zdolno! zarówno do samodzielnej pracy jako okno aplikacji (jak ma to miejsce w pierwszym przyk&adzie), jak te% jako jeden z elementów podrz"dnych okna. W tym drugim przypadku za wy!wietlenie ca&ego okna odpowiedzialny jest obiekt b"d$cy najwy%ej w hierarchii elementów okna. Warto tak%e wiedzie*, %e ka%dy obiekt klasy pochodnej po

QWidget

dziedziczy mo%liwo!* pe&nej obs&ugi zdarze' gene- rowanych przez u%ytkownika, w tym — oczywi!cie — obs&ug" myszy i klawiatury.

Wy2wietlamy polskie znaki

Niezb"dn$ cech$ programów jest poprawna obs&uga znaków charakterystycznych dla j"zyka polskiego. Niestety, prosta zamiana napisu na przycisku z pierwszego przyk&adu z angielskiego Hello world na polski odpowiednik Witaj Bwiecie da efekt przedsta- wiony na rysunku 12.4, na którym widoczny jest brak polskich liter.

Rysunek 12.4.

PrzykCad nieprawidCowego kodowania polskich znaków

Brak polskich znaków spowodowany jest sposobem obs&ugi napisów przez bibliotek"

Qt, a szczególnie metod$ konwersji znaków. Napisy w bibliotece Qt obs&uguje specjali-

zowana klasa

QString

(przedstawimy j$ bli%ej w nast"pnym rozdziale), która przecho-

wuje dane, korzystaj$c ze standardu Unicode 4.0. Jednak przy konwersji napisów klasa

ta domy!lnie u%ywa standardu Latin 1, znanego tak%e jako norma ISO 8859-1, który

nie zawiera polskich znaków.

(12)

Zmiana domy!lnego standardu kodowania wymaga u%ycia statycznej metody

setCodec ForCStrings

klasy

QTextCodec:

, której parametrem jest nazwa wybranego standardu kodowania znaków. W przypadku j"zyka polskiego najwa%niejsze s$ dwa standardy kodowania znaków: Windows-1250 stosowany w systemach z rodziny Microsoft Win- dows oraz ISO 8859-2 u%ywany w systemach Linux/Unix. Wybór jednego z tych dwóch standardów kodowania wygl$da nast"puj$co:

QTextCodec::setCodecForCStrings (QTextCodec::codecForName ("Windows-1250"));

QTextCodec::setCodecForCStrings (QTextCodec::codecForName ("ISO-8859-2"));

Biblioteka Qt obs&uguje wiele standardów kodowania znaków, oprócz tak wa%nych standardów jak ISO z rodziny 8859 (poza alfabetem tajskim) oraz standardów systemów z rodziny Windows, Qt obs&uguje tak%e standard Unicode w wersjach kodowania UTF-8 i UTF-16. Dzi"ki tak obszernej liczbie obs&ugiwanych standardów kodowania znaków biblioteka Qt umo%liwia tworzenie programów wykorzystuj$cych wszystkie najwa%niejsze j"zyki u%ywane przez ludzko!*. Pe&ny wykaz obs&ugiwanych standardów kodowania znaków z ewentualnymi ograniczeniami dotycz$cymi niektórych platform znajduje si" w dokumentacji biblioteki.

Powy%sz$ wiedz" wykorzystamy w kolejnym przyk&adzie.

Przyk ad 12.2. Wy$wietlenie polskich znaków w bibliotece Qt

1.

Utwórz nowy projekt, korzystaj$c z szablonu aplikacji Qt, tak jak w poprzednim przyk&adzie.

2.

List" plików nag&ówkowych uzupe&niamy tak, aby mo%na by&o u%y* klasy

QTextCodec

:

#include <QTextCodec>

3.

Wybór standardu kodowania polskich znaków najlepiej umie!ci* bezpo!rednio po utworzeniu obiektu

app

:

4.

W nast"pnym wierszu programu mo%emy ju% wpisa* nowy tekst przycisku:

QPushButton button ("Witaj Vwiecie!");

5.

Po kompilacji i uruchomieniu programu pojawi si" okno, takie jak na rysunku 12.5.

Rysunek 12.5.

Program poprawnie wy7wietlaj@cy polskie znaki

(13)

Podstawy hierarchii elementów interfejsu u7ytkownika

W typowym programie korzystaj$cym z graficznego interfejsu u%ytkownika okna apli- kacji zawieraj$ wiele ró%nego rodzaju elementów. Biblioteka Qt jest tak skonstruowana,

%e elementy GUI stanowi$ce cz"!* okna u&o%one s$ w odpowiedniej hierarchii. W pierw- szej kolejno!ci tworzony jest obiekt g&ówny, potem budujemy obiekty klas b"d$cych cz"!ci$ sk&adow$ danego okna. W dwóch pierwszych programach rol" g&ównego i za- razem jedynego elementu GUI stanowi& przycisk — obiekt klasy

QPushButton

. Ide"

hierarchii obiektów w bibliotece Qt najlepiej zilustruje nast"pny przyk&ad.

Przyk ad 12.3. Hierarchia elementów GUI

1.

Tradycyjnie utwórz nowy projekt, korzystaj$c z szablonu aplikacji Qt (mo%esz tak%e wykorzysta* projekt utworzony w drugim przyk&adzie).

2.

Dodaj plik nag&ówkowy klasy

QMainWindow

, która b"dzie klas$ bazow$

dla wi"kszo!ci naszych programów przyk&adowych:

#include <QMainWindow>

3.

Po wierszach tworz$cych obiekt klasy

QApplication

i definiuj$cych obs&ug"

wybranego standardu polskich znaków:

umie!* obiekt klasy

QMainWindow

reprezentuj$cy okno aplikacji:

QMainWindow window;

Klasa

QMainWindow

potrafi obs&ugiwa* wszystkie typowe elementy g&ównego okna aplikacji, w tym menu, paski narz"dziowe oraz pasek statusu, ale mo%na j$ tak%e zastosowa* do utworzenia innych rodzajów okien. W programie u%yli!my warto!ci domy!lnych konstruktora, który ma nast"puj$c$ posta*:

QMainWindow::QMainWindow (QWidget * parent = 0, Qt::WindowFlags flags = 0)

Pierwszy parametr —

parent

— okre!la wska3nik do obiektu nadrz"dnego (rodzica) w hierarchii elementów GUI. Domy!lna warto!* oznacza, %e dany obiekt jest g&ównym obiektem w hierarchii. Drugi parametr, czyli

flags

, opiszemy dok&adniej w nast"pnym rozdziale.

4.

Dalej okre!l rozmiar i po&o%enie okna oraz podaj jego tytu&:

window.setGeometry (400,300,300,200);

window.setWindowTitle ("Przyk\ad 3");

Obie powy%sze metody pochodz$ z klasy

QWidget

. Krótkiego wyja!nienia wymaga tylko

setGeometry

, której dwa pierwsze parametry okre!laj$

po&o%enie lewego górnego naro%nika kontrolki wzgl"dem elementu nadrz"dnego.

Gdy tworzymy g&ówne okno, b"d$ to wspó&rz"dne po&o%enia okna na pulpicie.

Dwa ostatnie parametry okre!laj$ rozmiary okna lub innego elementu GUI.

(14)

Zwró* jeszcze uwag", %e w poprzednich programach tytu& okna okre!la&a automatycznie biblioteka Qt na podstawie nazwy pliku wykonywalnego programu.

5.

Nast"pnie utwórz przycisk i umie!* go we wcze!niej utworzonym oknie:

QPushButton button ("Wyj]cie",&window);

button.setGeometry (100,120,100,40);

Je%eli spojrzymy na definicj" u%ytego w tym przypadku konstruktora klasy

QPushButton

:

QPushButton::QPushButton (const QString & text, QWidget * parent = 0)

to zobaczymy, %e drugi parametr jest odpowiednikiem pierwszego parametru konstruktora klasy

QMainWindow

. W dwóch pierwszych programach przyciski by&y elementami g&ównymi, st$d drugi parametr konstruktora

QPushButton

mia& warto!* domy!ln$, jednak w tym przypadku tworzymy element podrz"dny i w tym miejscu podajemy wska3nik do g&ównego okna. Oczywi!cie, tak%e po&o%enie przycisku okre!lone jest we wspó&rz"dnych okna nadrz"dnego, a nie pulpitu.

6.

Aby napis przycisku odpowiada& wykonywanej przez niego funkcji, musisz jeszcze odpowiednio po&$czy* sygna& (zdarzenie) generowany po naci!ni"ciu przycisku z odpowiednim gniazdem (ang. slot), czyli metod$, która b"dzie wywo&ana w wyniku naci!ni"cia przycisku. S&u%y do tego metoda

connect

klasy

QObject

. W naszym przyk&adzie naci!ni"cie przycisku zako'czy prac"

programu poprzez wywo&anie metody

quit

klasy

QApplication

:

QObject::connect (&button,SIGNAL (clicked()),&app,SLOT (quit()));

Parametry tej funkcji tworz$ dwie pary. Pierwsza para okre!la 3ród&o i rodzaj sygna&u (w naszym przyk&adzie obiekt

button

i jego metod"

clicked

), druga

— jego odbiorc" i wywo&ywane gniazdo (w przyk&adzie obiekt

app

i jego metod"

quit

). Bli%ej mechanizm sygna&ów i gniazd opiszemy w rozdziale 15.

7.

Ostatni$ czynno!ci$ zwi$zan$ z oknem jest jego wy!wietlenie, co realizuje poznana ju% wcze!niej metoda

show

:

window.show ();

Zauwa%, %e wykonujemy metod"

show

dla g&ównego obiektu w hierarchii elementów okna, czyli w tym przypadku dla obiektu klasy

QMainWindow

. Zadanie wy!wietlenia elementów podrz"dnych wykona g&ówny element w hierarchii.

8.

Po uzupe&nieniu o znane ju% z poprzednich programów zako'czenie:

return app.exec();

ca&o!* tekstu 3ród&owego programu wygl$da nast"puj$co:

(15)

int main(int argc, char *argv[]) {

QMainWindow window;

window.setGeometry (400,300,300,200);

window.setWindowTitle ("Przyk\ad 3");

QPushButton button ("Wyj]cie",&window);

button.setGeometry (100,120,100,40);

QObject::connect (&button,SIGNAL (clicked()),&app,SLOT (quit()));

window.show ();

return app.exec();

}

Po kompilacji i uruchomieniu otrzymamy okno przedstawione na rysunku 12.6.

Rysunek 12.6.

Przycisk umieszczony w oknie aplikacji

Tworzenie w9asnej klasy okna

Ostatnim krokiem do poznania struktury aplikacji Qt jest utworzenie w&asnej klasy okna.

Podobnie jak w poprzednim przyk&adzie, jako klas" bazow$ wykorzystamy

QMainWindow

, ale nic nie stoi na przeszkodzie, aby elementy GUI tworzy* na bazie klasy

QWidget

. Wybór

QMainWindow

podyktowany jest g&ównie jej przygotowaniem do obs&ugi standar- dowych elementów g&ównych okien programów. Je%eli taka funkcjonalno!* nie jest potrzebna, klas", któr$ poni%ej opisujemy, mo%na tak%e zbudowa* na bazie

QWidget

. Popatrzmy zatem na kolejny przyk&ad.

Przyk ad 12.4. W asna klasa okna

1.

Ponownie skorzystaj z szablonu aplikacji Qt i zapisz projekt w nowym folderze.

2.

Pliki nag&ówkowe pozostaj$ takie, jak w poprzednim przyk&adzie:

3.

Klas" reprezentuj$c$ okno nazwij

MyWindow

. Zawiera ona jedynie konstruktor,

destruktor oraz jedno prywatne pole

button

— wska3nik na obiekt klasy

QPushButton

:

(16)

class MyWindow: public QMainWindow {

public:

MyWindow ();

~MyWindow ();

private:

QPushButton *button;

};

4.

Konstruktor klasy

MyWindow

realizuje takie same zadanie jak program z poprzedniego przyk&adu. Tworzone okno ma rozmiary

300

na

200

pikseli i zawiera jeden przycisk, którego naci!ni"cia zamyka okno i ko'czy dzia&anie ca&ego programu:

MyWindow::MyWindow (): QMainWindow () {

setGeometry (400,300,300,200);

setWindowTitle ("Przyk\ad 4");

button = new QPushButton ("Wyj]cie",this);

button -> setGeometry (100,120,100,40);

connect (button,SIGNAL (clicked()),qApp,SLOT (quit()));

}

Warto zwróci* uwag" na to, %e obiekt reprezentuj$cy przycisk tworzymy dynamicznie, a wska3nikiem do obiektu klasy bazowej wzgl"dem przycisku jest

this

. Drug$ zmian$ jest wykorzystanie w wywo&aniu funkcji

connect

jako trzeciego parametru makra

qApp

, które przekazuje wska3nik do obiektu klasy

QApplication

. Specjalne mechanizmy zawarte w bibliotece Qt uniemo%liwiaj$

utworzenie wi"cej ni% jednego obiektu tej klasy.

5.

Destruktor klasy

MyWindow

pozostaw pusty. Usuni"cie elementów GUI tworzonych dynamicznie zostanie zrealizowane automatycznie przez obiekt b"d$cy najwy%ej w hierarchii.

MyWindow::~MyWindow () {

}

6.

Prezentowana poni%ej funkcja

main

osi$gn"&a posta, któr$ b"dziemy stosowa

w wi"kszo!ci programów przyk&adowych:

int main (int argc, char *argv[]) {

MyWindow window;

window.show ();

return app.exec();

}

Po wpisaniu ca&o!ci, kompilacji i uruchomieniu programu uzyskamy efekt

niemal identyczny z efektem w poprzednim przyk&adzie. Jedyna ró%nica to

inny tytu& okna. Okno programu przedstawiamy na rysunku 12.7.

(17)

Rysunek 12.7.

Przycisk

umieszczony w oknie reprezentowanym przez now@ klasE

Qt Designer

Filozofia pracy i ogólny wygl$d Qt Designera s$ zbli%one do innych wizualnych edyto- rów graficznego interfejsu u%ytkownika. Osoby znaj$ce takie !rodowiska jak Borland Delphi czy Microsoft Visual Basic znajd$ tu wiele podobie'stw.

Przy uruchomieniu Qt Designer standardowo wy!wietla okno kreatora rodzaju tworzo- nego formularza — tak jak to przedstawiamy na rysunku 12.8. Mo%emy wybra* okna dialogowe z przyciskami lub bez przycisków, okno g&ówne oparte na klasie

QMainWindow

oraz dowoln$ kontrolk" GUI na bazie klasy

QWidget

. Je%eli wy&$czymy opcj" wy!wie- tlania kreatora nowego formularza, mo%na go uruchomi z opcji menu File\NewForm.*

Rysunek 12.8. Qt Designer z otwartym oknem wyboru rodzaju tworzonego formularza

(18)

Po wyborze odpowiedniego rodzaju tworzonego formularza (w naszym przyk&adzie jest to Main Window) otrzymujemy gotowy do pracy graficzny edytor interfejsu u%yt- kownika, którego przyk&adowy wygl$d przedstawiony jest na rysunku 12.9. Warto po-

!wi"ci* chwil" czasu na wygodne ustawienie elementów edytora. Na pocz$tku mo%na zamkn$ cz"!* okien — proponuj" pozostawi* Widget Box, Property Editor oraz Object*

Inspector.

Rysunek 12.9. Qt Designer w trakcie edycji formularza typu Main Window

Przedstawione na rysunku 12.10 okno Widget Box zawiera palet" elementów GUI (okno widoczne jest tak%e w lewej cz"!ci rysunku 12.9). Wybran$ kontrolk" przenosimy na okno formularza, korzystaj$c z mechanizmu przeci$gnij i upu!*. Widoczna na oknie siatka punktów u&atwia rozmieszczanie poszczególnych elementów okna.

W&a!ciwo!ci wybranego elementu wy!wietlane s$ w oknie Property Editor, które

przedstawiamy na rysunku 12.11. Okno to zawiera informacje o klasie reprezentuj$-

cej dany element oraz jej klasach bazowych. Na rysunku 12.12 widzimy, %e wybra-

nym elementem jest g&ówne okno aplikacji (klasa

QMainWindow

, która dziedziczy po

klasach

QWidget

i

QObject

). Wszystkie w&a!ciwo!ci wy!wietlane w oknie Property

Editor maj$ — oczywi!cie — swoje odpowiedniki w polach klasy.

(19)

Rysunek 12.10.

Okno Widget Box

Ostatnim z podstawowych okien Qt Designera jest okno Object Inspector, które przed-

stawiamy na rysunku 12.12. Zawiera ono hierarchi" klas bie%$cego projektu. W oknie

prezentowanym na rysunku 12.12 zamie!cili!my pocz$tkow$ hierarchi" klas szablonu

Main Window. Widzimy tu elementy klasy QMainWindow

, takie jak centralna kontrolka

okna (

centralwidget

), pasek menu (

menubar

) oraz pasek statusu (

statusbar

), które

bli%ej omówimy w nast"pnym rozdziale.

(20)

Rysunek 12.11.

Okno Property Editor

Rysunek 12.12.

Okno Object Inspector

Integracja Qt Designer i Dev-C++

Qt Designer zapisuje opis formularzy w plikach z rozszerzeniem ui, które wykorzy-

stuj$ sk&adni" XML. Biblioteka Qt zawiera specjalne narz"dzie — kompilator inter-

fejsu u%ytkownika UIC (ang. user interface compiler) — które konwertuje pliki ui do

(21)

plików nag&ówkowych w j"zyku C++. Do integracji w !rodowisku Dev-C++ kompi- latora UIC i innych specjalistycznych narz"dzi biblioteki Qt wykorzystamy narz"dzie

qt-moc-ui-rcc

. Plik wykonywalny qt-moc-ui-rcc.exe kopiujemy do folderu C:\Dev-Cpp\

bin, a plik qt.mak, zawieraj$cy dodatkowe polecenia dla narz"dzia

^make

, umiesz- czamy w folderze z projektem. Ostatnim etapem konfiguracji jest dodanie pliku qt.mak w opcjach projektu Dev-C++ (menu Projekt\Opcje projektu) w zak&adce Makefile, tak jak to przedstawiamy na rysunku 12.13. W przypadku plików formularzy automa- tycznie wygenerowany przez UIC plik nag&ówkowy b"dzie mia& nazw" tak$ sam$ jak plik ui (bez rozszerzenia) uzupe&nion$ dodatkowo o przedrostek ui_.

Rysunek 12.13.

Dodanie pliku qt.mak do projektu

Wykorzystanie formularzy w programach

Wygenerowane za pomoc$ Qt Designera pliki formularzy mo%na w stosunkowo &atwy sposób wykorzysta* w aplikacji. Dwa sposoby najcz"!ciej stosowne w praktyce prze-

*wiczymy na przyk&adach. Pierwszym z nich b"dzie u%ycie wielodziedziczenia.

Przyk ad 12.5. Formularz do )czony za pomoc) wielodziedziczenia

1.

Korzystaj$c z szablonu aplikacji Qt, utwórz nowy projekt. Funkcja

main

b"dzie mia&a tak$ sam$ zawarto!* jak w poprzednim przyk&adzie. Mo%esz tak%e wykorzysta* pliki z tego przyk&adu. Klas"

MyWindow

ogranicz do minimum:

public:

MyWindow ();

~MyWindow () {}

};

(22)

Podobnie ograniczona do minimum jest implementacja konstruktora:

MyWindow::MyWindow ():

QMainWindow (0,Qt::Window) {

}

2.

W Qt Designerze utwórz nowy projekt formularza oparty na szablonie Main

Window. Korzystaj$c z edytora w&a!ciwo!ci (okno Property Editor), zmodyfikuj

nazw" klasy (w&a!ciwo!*

objectName

) na

Window

, rozmiary okna (w&a!ciwo!*

geometry

) do

300

na

200

pikseli oraz dobierz odpowiedni tytu& okna (w&a!ciwo!*

windowTitle

). Wst"pnie przygotowany projekt zapisz pod nazw$ window.ui w folderze z projektem. Okno Property Editor z w&a!ciwo!ciami naszej klasy

Window

przedstawiamy na rysunku 12.14. Warto jednocze!nie zauwa%y, %e te w&a!ciwo!ci klasy, których warto! po modyfikacji odbiega od stanu pocz$tkowego, wyró%niane s$ w oknie Property Editor pogrubion$ czcionk$.

Rysunek 12.14.

Oko Property Editor z wyróLnionymi zmianami wCa7ciwo7ci objectName, geometry i windowTitle

(23)

3.

Na formularzu okna umieszczamy przycisk — obiekt klasy

PushButton

. Jego nazw" zmieniamy na

button

, rozmiary i po&o%enie to kolejno:

100

,

120

,

100

i

40

, a wy!wietlany tekst (w&a!ciwo!*

text

) to

Wyj]cie

. Struktura klasy formularza powinna wygl$da* tak, jak na rysunku 12.15.

Rysunek 12.15.

Struktura klas formularza zawieraj@cego okno z jednym przyciskiem

4.

Do uko'czenia prac nad pierwszym formularzem pozosta&o jeszcze wy&$czenie niepotrzebnego paska statusu oraz paska menu. Wybierz odpowiednie klasy w oknie Object Inspector i w&a!ciwo!*

enabled

ustaw na

false

. Dodatkowo dla paska statusu musisz wy&$czy* jeszcze brzeg dla &apki kursora myszy (w&a!ciwo!*

sizeGripEnabled

). W efekcie otrzymali!my projekt formularza dok&adnie odpowiadaj$cy oknu z poprzedniego przyk&adu.

Plik window.ui wygl$da nast"puj$co:

<class>Window</class>

<rect>

</rect>

</property>

<string>QtDesigner - test</string>

</property>

</property>

<rect>

</rect>

</property>

</property>

</widget>

(24)

</widget>

<bool>false</bool>

</property>

<rect>

</rect>

</property>

</widget>

<bool>false</bool>

</property>

<bool>false</bool>

</property>

</widget>

</ui>

5.

Do projektu do&$cz plik window.ui, a w opcjach projektu umie! plik qt.mak* i nast"pnie skompiluj ca&o!. Przy pierwszej kompilacji w folderze z projektem zostanie utworzony dodatkowy plik ui_window.h, który zosta& wygenerowany* przez kompilator UIC. Plik ten do&$cz do projektu.

Plik ui_window.h zawiera jednocze!nie deklaracj" i implementacj" klasy

Ui_Window

:

class Ui_Window {

public:

QWidget *centralwidget;

QPushButton *button;

QMenuBar *menubar;

QStatusBar *statusbar;

void setupUi(QMainWindow *Window) {

if (Window->objectName().isEmpty())

Window->setObjectName(QString::fromUtf8("Window"));

Window->resize(300, 200);

centralwidget = new QWidget(Window);

centralwidget->setObjectName(QString::fromUtf8("centralwidget"));

centralwidget->setEnabled(true);

button = new QPushButton(centralwidget);

button->setObjectName(QString::fromUtf8("button"));

button->setGeometry(QRect(100, 120, 100, 40));

Window->setCentralWidget(centralwidget);

menubar = new QMenuBar(Window);

(25)

menubar->setObjectName(QString::fromUtf8("menubar"));

menubar->setEnabled(false);

menubar->setGeometry(QRect(0, 0, 300, 23));

Window->setMenuBar(menubar);

statusbar = new QStatusBar(Window);

statusbar->setObjectName(QString::fromUtf8("statusbar"));

statusbar->setEnabled(false);

statusbar->setSizeGripEnabled(false);

Window->setStatusBar(statusbar);

retranslateUi(Window);

QMetaObject::connectSlotsByName(Window);

} // setupUi

void retranslateUi(QMainWindow *Window) {

Window->setWindowTitle(QApplication::translate("Window", "QtDesigner - test", 0, QApplication::UnicodeUTF8));

button->setText(QApplication::translate("Window", "Wyj\305\233cie", 0, QApplication::UnicodeUTF8));

Q_UNUSED(Window);

} // retranslateUi };

Dodatkowo plik ten zawiera przestrze' nazw

Ui

z klas$

Ui_Window

:

namespace Ui {

class Window: public Ui_Window {};

} // namespace Ui

6.

W definicji klasy dodaj dziedziczenie prywatne klasy wygenerowanej

Ui::Window:

class MyWindow: public QMainWindow, private Ui::Window

Oczywi!cie, na pocz$tku pliku mywindow.h trzeba jeszcze do&$czy*

odpowiedni plik nag&ówkowy:

#include "ui_window.h"

7.

W konstruktorze naszej klasy wywo&aj metod" setupUi znajduj$c$ si"

w klasie

Ui::Window

:

setupUi (this);

Parametrem tej metody jest wska3nik do obiektu klasy

QMainWindow

, czyli w naszym przypadku

this

.

T$czymy tak%e sygna& wysy&any przez przycisk

button

w dok&adnie taki sam sposób jak w poprzednim przyk&adzie.

connect (button,SIGNAL (clicked()),qApp,SLOT (quit()))

8.

Po kompilacji projektu i uruchomieniu programu uzyskamy okno, takie jak

na rysunku 12.16.

(26)

Rysunek 12.16.

Okno QMainWindow wygenerowane przy uLyciu Qt Designera

Drugim obok wielodziedziczenia typowym sposobem wykorzystania w programie for- mularzy wygenerowanych przez Qt Designer jest do&$czenie pola b"d$cego obiektem klasy wygenerowanej przez kompilator UIC. Ró%nice w stosunku do wielodziedzi- czenia poka%emy na przyk&adzie.

Przyk ad 12.6. Formularz do )czony jako pole klasy

1.

Skopiuj wszystkie pliki z poprzedniego przyk&adu i otwórz plik projektu w Dev-C++.

2.

W definicji klasy

MyWindow

dodaj pole

window

b"d$ce obiektem klasy

Ui::Window

. Jednocze!nie usu' dziedziczenie po klasie

Ui::Window

:

public:

MyWindow ();

~MyWindow () {}

private:

Ui::Window window;

};

3.

Konstruktor klasy

MyWindow

, podobnie jak w poprzednim przyk&adzie, musi wywo&a* metod"

setupUi

klasy

Ui::Window

. Jedyna ró%nica polega na innym sposobie dost"pu do tej metody. Metod", zamiast bezpo!rednio, wywo&ujemy za po!rednictwem pola

window

:

window.setupUi (this);

Analogicznie modyfikujemy pierwszy parametr funkcji

connect

:

connect (window.button,SIGNAL (clicked()),qApp,SLOT (quit()))

4.

Po kompilacji i uruchomieniu programu otrzymujemy efekt analogiczny do efektu z przyk&adu 12.5.

Z dwóch przedstawionych metod wykorzystania formularzy generowanych przez Qt

Designer najbardziej uniwersalna jest metoda druga. W przeciwie'stwie do wielodzie-

dziczenia, pozwala ona na bezproblemowe do&$czenie do jednej klasy aplikacji wielu

formularzy. Jednak w typowych sytuacjach zastosowanie wielodziedziczenia jest naj-

wygodniejsz$ metod$, g&ównie dzi"ki bezpo!redniemu dost"powi do wszystkich elemen-

tów formularza.

(27)

Test

W!ród pyta' testowych dotycz$cych powy%szego rozdzia&u poprawna jest co najmniej jedna odpowied3.

1.

Bazow$ klas$ okna aplikacji mo%e by*:

a) QPushButton

,

b) QMainWindow

,

c) QWidget

,

d) QApplication

.

2.

Ile obiektów klasy

QApplication

mo%e wyst$pi* w programie:

a)

dowolna ilo!*,

b)

tylko jeden,

c)

ilo!* obiektów zale%y od ilo!ci kontrolek.

3.

Jakie domy!lne kodowanie znaków obs&uguje klasa

QString

:

a)

Latin 1,

b)

Windows 1250,

c)

ICO 8859-2.

4.

T$czenie sygna&ów i gniazd umo%liwia metoda

connect

klasy:

a) QWidget

,

b) QMainWindow

,

c) QApplication

,

d) QObject

,

e) QString

.

5.

Domy!lna nazwa obiektu klasy

QMainWindow

formularza tworzonego przez Qt Designer to:

a) MyWindow

,

b) MainWindow

,

c) Window

,

d) Widget