Getting Started Programming with Qt/ro

Notiuni de baza pentru programare cu Qt

Bun venit in lumea Qt—toolkitul GUI multi-platforma. In acest articol de introducere vom prezenta notiuni de baza pentru programarea cu Qt prin implementarea unei simple aplicatii Notepad. Dupa citirea acestui ghid veti fi pregatiti sa rasfoiti documentatia noastra si sa gasiti informatiile necesare pentru aplicatia pe care o dezvoltati.

Hello Notepad

In acest prim exemplu vom crea un simplu editor de text intr-o fereastra. Acesta reprezinta cel mai simplu program Qt cu interfata grafica.

Notepad

Codul necesar pentru a crea aplicatia:

#include <QApplication>
#include <QTextEdit>

int main(int argv, char *'''args)
{
 QApplication app(argv, args);

 QTextEdit textEdit;
 textEdit.show();

 return app.exec();
}

Sa urmarim codul line cu line. In primele doua linii includem fisierele hedear "QApplication":http://doc.trolltech.com/latest/qapplication.html si "QTextEdit":http://doc.trolltech.com/latest/qtextedit.html, acestea fiind clasele de care avem nevoie pentru aceasta aplicatie. Toate clasele din Qt au un header denumit dupa ele.

Linia 6 creaza o instanta a obiectului "QApplication":http://doc.trolltech.com/latest/qapplication.html. Acest obiect gestioneaza resursele aplicatiei si este neccesar pentru a rula orice aplicatie Qt care are o interfata grafica. Acesta ia ca parametri argv si args pentru ca Qt accepta cativa parametrii de start.

Linia 8 creaza un obiect de tip "QTextEdit":http://doc.trolltech.com/latest/qtextedit.html. Un editor de text este un element vizual in interfata grafica (GUI). In Qt aceste elemente se numesc widget-uri. Exemple de widget-uri sunt etichete, butoane radio, bare de derulare. Un widget poate fi deasemena si un container pentru alte widget-uri; o casuta de dialog sau o fereastra principala a aplicatiei de exemplu.

Linia 9 arata editorul de text in propria lui fereastra. Deoarece widget-urile pot fi si container (de exemplu "QMainWindow":http://doc.qt.nokia.com/latest/qmainwindow.html care contine bare de instrumente, meniuri, bara de stare si alte widgeturi), este posibila afisarea unui singur widget in propria sa fereastra. Widget-urile nu sunt vizibile implicit functia "show()":http://doc.qt.nokia.com/latest/qwidget.html#show face widget-ul vizibil.

Linia 11 face ca obiectul "QApplication":http://doc.trolltech.com/latest/qapplication.html sa intre in bucla de evenimente. Cand o aplicatie Qt ruleaza, evenimente sunt generate si trimise widget-urilor care apartin de aplicatie. Exemple de astfel de evenimente sunt apasari ale butoanelor de la mouse sau apsari a butoanelor de la tastatura. Im momentul in care tastati text in editorul de text, acesta primeste evenimentele generate in urma apasari tastelor si raspunde la aceste evenimente desenand text pe ecran.

Pentru a rula aplicatia, deschideti o consola, intrati in directorul unde ati salvat fisierul .cpp. Urmatoarele comenzi vor construi aplicatia.

qmake -projetc
qmake
make

Aceste comenzi vor genera un executabil in directorul part1 (atentie pe windows e posibil sa fie nevoie sa rulati comanda nmake in loc de make. De asemenea executabilul va fi plasat ub folderul part1/debug sau part1/release). qmake este un utilitar care ia ca si parametru un fisier de configurare. qmake genereaza pentru noi acest fisier de configurare cand este rulat cu parametru -project. Odata generat fisierul de configurare (cu extensia .pro) qmake produce un fisier make care va construi programul pentru noi. Vom studia cum putem scrie propriile noastre fisiere .pro mai tarziu.

h3. Studiati in continuare

• Widget-rui si geometria acestora- "Widget-uri ferestre si dialoguri":http://doc.qt.nokia.com/latest/application-windows.html

Evenimente si modul de tratare a acestora - "Sistemul de evenimente":http://doc.qt.nokia.com/latest/eventsandfilters.html

Adaugarea unu button de iesire

Intr-o aplicatie reala, avem nevoie de mai multe widget-uri. Vom introduce un "QPushButton":http://doc.qt.nokia.com/latest/qpushbutton.html sub editorul de text. Butonul va opri aplicatia in momentul in care este apasat (facand click cu mouse pe el,de exemplu).

Notepad

Sa aruncam o privire asupra codului:

#include <QtGui>

int main(int argv, char **args)
{
 QApplication app(argv, args);

QTextEdit textEdit;
 QPushButton quitButton("Quit");

QObject::connect(&amp;quitButton, SIGNAL (clicked()), qApp, SLOT (quit()));

QVBoxLayout layout;
 layout.addWidget(&amp;textEdit);
 layout.addWidget(&amp;quitButton);

QWidget window;
 window.setLayout(&amp;layout);

window.show();

return app.exec();
}

Linia 1 include "QtGui":http://doc.qt.nokia.com/latest/qtgui.html, care contine toate clasele GUI din Qt.

Linia 10 foloseste mecanismul signal slot din Qt pentru a face aplicatia sa se inchida in momentul in care Butonul Quit este apasat. Un slot este o functie care poate fi invocata in timpul executiei folosind numele ei (ca un sir de caractere literal). Un semnal este o functie care in momentul invocarii apeleaza toate slot-urile inregistrate cu acesta; apelam acestea pentru a conecta slotul la semnal si a emite semnalul.

"quit()":http://doc.qt.nokia.com/latest/qcoreapplication.html#quit este un slot a "QApplication":http://doc.trolltech.com/latest/qapplication.html care intrerupe executia aplicatiei. "clicked()":http://doc.qt.nokia.com/latest/qabstractbutton.html#clicked este un semnal emis de QPushButton":http://doc.qt.nokia.com/latest/qpushbutton.html in momentul in care acesta este apasat. Functia statica "QObject::connect()":http://doc.qt.nokia.com/latest/qobject.html#connect va conecta slotul la semnal. SIGNAL () si SLOT() sunt doua macro-uri care iau ca parametrii semnaturile functilor care reprezinta semnalul si slotul care vor fi conectate. De asemenea trebuie sa furnizam si pointeri catre obiectele care vor emite si receptiona semnalul.

Linia 12 creaza un "QVBoxLayout":http://doc.qt.nokia.com/latest/qvboxlayout.html. Precum am mentionat adineauri, widget-urile pot contine alte widget-uri. Este posibila setarea locatiei si a dimensiunilor a widget-urilor continute direct, dar de obicei este mai usor folosirea unui layout. Un layout gestioneaza locatia si dimensiunea widget-urilor. "QVBoxLayout":http://doc.qt.nokia.com/latest/qvboxlayout.html , de exemplu, aseaza widget-urile intr-un rand pe verticala.

Linia 13 si 14 adauga editorul de text si butonul in layout iar linia 17 seteaza layoutul pe widget.

Studiati in continuare

• Semnale si slot-uri - "Semnale & Slot-uri":http://doc.qt.nokia.com/latest/signalsandslots.html
• Layout-uri - "Administrarea Layout-ului":http://doc.qt.nokia.com/latest/layout.html, "Widget-uri si Layout-uri":http://doc.qt.nokia.com/latest/widgets-and-layouts.html, "Exemple de Layout":http://doc.qt.nokia.com/latest/examples-layouts.html
• Widget-uri care vin cu Qt - "Galeria de Widget-uri Qt":http://doc.qt.nokia.com/latest/gallery.html, "Exemple de Widget-uri":http://doc.qt.nokia.com/latest/examples-widgets.html

Derivarea din QWidget

In momentul in care utilizatorul vrea sa inchida aplicatia, e posibil sa doriti sa afisati un mesaj intreband utilizatorul daca el/ea chiar doreste sa inchida aplicatia. In acest exemplu, vom deriva din "QWidget":http://doc.qt.nokia.com/latest/qwidget.html si vom adauga un slot pe care il vom conecta la buton de Quit.

Sa aruncam o privire asupra codului:

class Notepad : public QWidget
{
 Q_OBJECT

public:
 Notepad();

private slots:
 void quit();

private:
 QTextEdit *textEdit;
 QPushButton *quitButton;
};

Macroul Q_OBJECT trebuie definit primul in clasa, acesta declara clasa noastra ca fiind un QObject (Normal trebuie sa si mostenim din "QObject":http://doc.qt.nokia.com/latest/qobject.html). Un "QObject":http://doc.qt.nokia.com/latest/qobject.html adauga cateva abilitati unei clase normale de C++. Notbail este ca numele clasei si numele sloturi-lor pot fi interogate in timpul executiei. Este posibil deasemenea interogarea tipului parametrilor unui slot si invocarea acestuia.

Linia 13 declara slotul quit(). Acest lucru este usor flosind macroul slots. Slot-ul quit() poate fi acum conectat la semnale care au acelasi numar si tip de parametri (orice semnal ce nu ia parametri in cazul nostru). In loc de a seta interfata grafica si a conecta slot-ul in main, vom folosi constructorul clasei Notepad.

Notepad::Notepad()
{
 textEdit = new QTextEdit;
 quitButton = new QPushButton(tr("Quit"));

connect(quitButton, SIGNAL (clicked()), this, SLOT (quit()));

QVBoxLayout '''layout = new QVBoxLayout;
 layout->addWidget(textEdit);
 layout->addWidget(quitButton);

 setLayout(layout);

 setWindowTitle(tr("Notepad"));
}

Dupa cum se poate vedea in definitia clasei, folosim pointeri catre obiectele noastre de tip "QObject":http://doc.qt.nokia.com/latest/qobject.html (textEdit si quitButton). Ca o regula, este indicata alocarea obiectelor "QObject":http://doc.qt.nokia.com/latest/qobject.html pe heap si necopierea acestora.

Putem folosi acum functia "tr()":http://doc.qt.nokia.com/latest/qobject.html#tr pentru a incapsula sirurile de caractere vizibile. Acest lucru este necesar daca dorim distribuirea aplicatiei in mai mult de o limba (Engleza si Chineza de exemplu). Nu vom intra in detalii aici, dar puteti sa urmati linkurile de mai jos pentru a afla mai multe.

h3. Studiati in continuare

tr() si internationalizarea - "Manual Qt Linguist":http://doc.qt.nokia.com/latest/linguist-manual.html, "Scrierea de cod pentru traduceri":http://doc.qt.nokia.com/latest/i18n-source-translation.html, "Exemplul Hello tr()":http://doc.qt.nokia.com/latest/linguist-hellotr.html, "Internationalizarea cu Qt":http://doc.qt.nokia.com/latest/internationalization.html

• "QObjects":http://doc.qt.nokia.com/latest/qobject.html si modelul Qt pentru obiecte (Acest lucru este necesar pentru a intelege Qt) - "Modelul de Obiecte":http://doc.qt.nokia.com/latest/object.html
• qmake si sistem de constructie Qt - "Manual qmake":http://doc.qt.nokia.com/latest/qmake-manual.html

Crearea unui fisier .pro

Pentru acest exemplu vom scrie propriul nostru fisier .pro in loc de a folosi parametul -project al qmake.

 HEADERS = notepad.h
 SOURCES = notepad.cpp  main.cpp

Urmatoarele comenzi pentru consola construiesc aplicatia.

 qmake
 make

h2. Folosirea unei QMainWindow

Multe aplicati ar beneficia din folosirea unei "QMainWindow":http://doc.qt.nokia.com/latest/qmainwindow.html, care are propriul layout pe care putem adauga: bari de meniu, bari de instrumente si bara de status. "QMainWindow":http://doc.qt.nokia.com/latest/qmainwindow.html are o zona centrala in care poate fi adaugat orice widget. In cazul nostru, vom adauga editorul de text aici.

Sa aruncam o privire asupra codului:

#include <QtGui>

class Notepad : public QMainWindow
{
 Q_OBJECT

public:
 Notepad();

 private slots:
 void open();
 void save();
 void quit();

 private:
 QTextEdit *textEdit;

 QAction *openAction;
 QAction *saveAction;
 QAction *exitAction;

 QMenu '''fileMenu;
};

Adaugam inca doua sloturi pentru salvarea si deschiderea de documente. Le vom implementa in urmatoarea sectiune.

Desi, intr-o fereastra principala, acelasi slot ar trebui invocat de mai multe widget-uri. Exemple sunt elementele din meniuri si butoanele de pe o bara de instrumente. Pentru a face acest lucru mai usor, Qt ofera "QAction":http://doc.qt.nokia.com/latest/qaction.html, care poate fi furnizat mai multor widget-uri, si pot fi conectate unui slot. De exemplu si "QMenu":http://doc.qt.nokia.com/latest/qmenu.html si "QToolBar":http://doc.qt.nokia.com/latest/qtoolbar.html pot crea elemente de meniu si butoane pe bara de instrumente din aceleasi "QAction":http://doc.qt.nokia.com/latest/qaction.htmls. Vom vedea cum functioneaza acest lucru in curand.

Ca si adineaori folosim contructorul clasei Notepad pentru a seta interfata grafica.

Notepad::Notepad()
{
 saveAction = new QAction(tr("&Open"), this);
 saveAction = new QAction(tr("&Save"), this);
 exitAction = new QAction(tr("E&xit"), this);

 connect(openAction, SIGNAL (triggered()), this, SLOT (open()));
 connect(saveAction, SIGNAL (triggered()), this, SLOT (save()));
 connect(exitAction, SIGNAL (triggered()), qApp, SLOT (quit()));

 fileMenu = menuBar()->addMenu(tr("&File"));
 fileMenu->addAction(openAction);
 fileMenu->addAction(saveAction);
 fileMenu->addSeparator();
 fileMenu->addAction(exitAction);

 textEdit = new QTextEdit;
 setCentralWidget(textEdit);

 setWindowTitle(tr("Notepad"));
}

"QAction":http://doc.qt.nokia.com/latest/qaction.htmls sunt create cu textul cu care ar trebui sa apara pe widget-uri (in cazul nostru, elemente din meniu). Daca dorim putem sa le adaugam si pe o bara de instrumente si sa le adaugam "iconite":http://doc.qt.nokia.com/latest/qicon.html

Cand un element din meniu este apasat, acesta va activa slotul care va determina invocarea slotului.

h3. Studiati in continuare

Ferestre principale si clase pentru ferestre principale- "Ferestre principale pentru aplicatii":http://doc.qt.nokia.com/latest/mainwindow.html, "Exemple de ferestre principale":http://doc.qt.nokia.com/latest/examples-mainwindow.html

• Aplicati MDI - "QMdiArea":http://doc.qt.nokia.com/latest/qmdiarea.html, "Exemple MDI":http://doc.qt.nokia.com/latest/mainwindows-mdi.html

Salvarea si deschiderea

In acest eexmplu vom implementa functionalitatea pentru slot-urile open() si save() care le-am adaugat in exemplul anterior.

Vom incepe cu slot-ul open().

QString fileName = QFileDialog::getOpenFileName(this, tr("Open File"), "",
 tr("Text Files ('''.txt);;C++ Files ('''.cpp '''.h)"));

if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::ReadOnly)) {
 QMessageBox::critical(this, tr("Error"),
 tr("Could not open file"));
 return;
 }
 QString contents = file.readAll().constData();
 textEdit->setPlainText(contents);
 file.close();
}

Primul pas este intrebarea utilizatorului care va fi numele fisierului ce va fi deschis. Qt ofera "QFileDialog":http://doc.qt.nokia.com/latest/qfiledialog.html, care est o fereastra de dialog din care utilizatorul poate selecta un fisier. Imaginea de adineauri arata aceasta ferestra de dialog pe Kubuntu. Functia statica "getOpenFileName()":http://doc.qt.nokia.com/latest/qfiledialog.html#getOpenFileName afiseaza o fereastra de dialog modala si nu returneaza pana in momentul in care utilizatorul alege un fisier. Aceasta returneaza calea catre fisierul selectat sau un sir de caractere gol daca utilizatorul a inchis fereastra fara sa selecteze nimic.

Daca avem un nume de fisier, incercam sa il deschidem folosind functia "open()":http://doc.qt.nokia.com/latest/qiodevice.html#open, care returneaza true daca fisierul a fost deschis. Nu vom intra aici in modalitati de tratare a erorilor dar puteti urmari link-uri din sectiunea studiati in continuare. Daca fisierul nu a fost deschis, folosim un "QMessageBox":http://doc.qt.nokia.com/latest/qmessagebox.html pentru a afista un mesaj de eroare (vedeti documentatia "QMessageBox":http://doc.qt.nokia.com/latest/qmessagebox.html pentru mai multe detalii).

Citirea datelor din fisier este triviala folosind functia "readAll()":http://doc.qt.nokia.com/latest/qiodevice.html#readAll, care returneaza toate datele din fisier sub forma unui "QByteArray":http://doc.qt.nokia.com/latest/qbytearray.html. Functia "constData()":http://doc.qt.nokia.com/latest/qbytearray.html#constData returneaza date ca si const char, pentru care "QString":http://doc.qt.nokia.com/latest/qstring.html are constructor. Continutul poate fi apoi afist in editorul de text. Inchidem apoi fisierul folosind "close()":http://doc.qt.nokia.com/latest/qiodevice.html#close pentru a returna descriptorul inapoi sistemului de operare.

Acum sa trecem la slot-ul save().

QString fileName = QFileDialog::getSaveFileName(this, tr("Save File"), "",
 tr("Text Files ('''.txt);;C++ Files ('''.cpp '''.h)"));

if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::WriteOnly)) {
 // error message
 } else {
 QTextStream stream(&file);
 stream << textEdit->toPlainText();
 stream.flush();
 file.close();
 }
}

Cand scriem continutul editorului de text intr-un fisier, folosim clasa "QTextStream":http://doc.qt.nokia.com/latest/qtextstream.html, care incapsuleaza un obiect "QFile":http://doc.qt.nokia.com/latest/qfile.html. QTextStream poate sa scrie direct QString in fisier; "QFile":http://doc.qt.nokia.com/latest/qfile.html accepta doar date neprelucrate (char) cu functile "write()":http://doc.qt.nokia.com/latest/qiodevice.html#write a unui "QIODevice":http://doc.qt.nokia.com/latest/qiodevice.html