View source for Getting Started with Qt/sl

{{Cleanup | reason=Auto-imported from ExpressionEngine.}}

= Pričetek programiranja s Qt-om =
Dobrodošli v svetu Qt-a – ogrodja za grafično programiranje za več platform. V tem začetnem vodiču se boste skozi implementacijo preprostega urejevalnika besedil naučili osnov Qt-a. Po zaključku branja tega vodiča boste pripravljeni, da se poglobite v branje pregledov tehnologij in dokumentacije programskega vmesnika ter tako najdete podatke, ki jih potrebujete za razvoj svoje aplikacije.

== Pozdravljen Urejevalnik ==

V prvem primeru preprosto ustvarimo in prikažemo polje za urejanje besedila, ki se nahaja v oknu na namizju. To predstavlja najpreprostejši možni program Qt z grafičnim uporabniškim vmesnikom.

p=. [[Image:http://doc.qt.nokia.com/latest/images/gs1.png|Zaslonski posnetek urejevalnika]]

Tukaj je koda:
<code>
#include <QApplication>
#include <QTextEdit>

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

 QTextEdit textEdit;
 textEdit.show();

 return app.exec();
}
</code>
Pa se sprehodimo po vsaki vrstici kode. V prvih dveh vrsticah vstavimo datoteki z glavo za razreda [http://doc.qt.nokia.com/latest/qapplication.html QApplication] in [http://doc.qt.nokia.com/latest/qtextedit.html QTextEdit], ki ju potrebujemo za ta primer. Vsi razredi v Qt imajo datoteko z glavo, ki ima enako ime kot ustrezen razred.

V 6. vrstici ustvarimo objekt razreda [http://doc.qt.nokia.com/latest/qapplication.html QApplication]. Ta objekt upravlja z viri za aplikacijo in je potreben za delovanje kateregakoli programa Qt, ki ima grafični uporabniški vmesnik. Parametra argv in args sta potrebna, ker Qt sprejme nekaj argumentov iz ukazne vrstice.

V 8. vrstici ustvarimo objekt razreda [http://doc.qt.nokia.com/latest/qtextedit.html QTextEdit]. Polje za urejanje besedila je v grafičnem uporabniškem vmesniku viden element. V Qt-u take elemente imenujemo gradniki. Primeri drugih gradnikov so drsniki, oznake in gumbi. Gradnik je lahko tudi vsebnik za druge gradnike. Tako je na primer pogovorno okno ali pa glavno okno programa.

V 9. vrstici polje za urejanje besedila prikažemo na zaslonu in sicer v svojem oknu. Ker gradniki služijo tudi kot vsebniki (npr. [http://doc.qt.nokia.com/latest/qmainwindow.html QMainWindow], ki vsebuje orodjarne, menije, vrstico stanja in druge gradnike), je posamezen gradnik moč prikazati v svojem oknu. Gradniki privzeto niso vidni. S klicem funkcije [http://doc.qt.nokia.com/latest/qwidget.html#show show()] postane gradnik viden.

V 11. vrstici zaženemo dogodkovno zanko objekta app, ki je razreda [http://doc.qt.nokia.com/latest/qapplication.html QApplication]. Med tekom programa Qt se sprožajo dogodki, ki se pošiljajo gradnikom programa. Primera dogodkov sta pritisk na gumb miške in pritisk tipke. Ko v gradnik polja za urejanje besedila tipkate besedilo, le-ta prejme dogodke pritiskov tipk in se odzove z izrisom natipkanega besedila.

Da zaženete program, odprite ukazno vrstico in se postavite v mapo, ki vsebuje datoteko'''.cpp z izvorno kodo programa. Naslednji ukazi zgradijo program:
<code>
qmake -project
qmake
make
</code>
Po tem bo v mapi ustvarjena izvršljiva datoteka (v Windows morate morda namesto make uporabiti nmake, izvršljiva datoteka pa bo v mapi debug ali release). qmake je Qt-ovo orodje za gradnjo, ki kot vhod sprejme nastavitveno datoteko (s končnico '''.pro). qmake le-to ustvari za nas,če mu podamo možnost -project. Pisanje lastnih nastavitvenih datotek si bomo ogledali kasneje.

h3. Naučite se več
|''. Tema|''. Tu|
|Gradniki in geometrija oken|[http://doc.qt.nokia.com/latest/application-windows.html| Window and Dialog Widgets]
|Dogodki in ravnanje z dogodki|[http://doc.qt.nokia.com/latest/eventsandfilters.html| The Event System]



== Dodajanje gumba Končaj ==
V pravi aplikaciji boste običajno potrebovali več kot en gradnik. Sedaj bomo pod polje za urejanje besedila dodali gumb razreda [http://doc.qt.nokia.com/latest/qpushbutton.html QPushButton]. Ko uporabnik pritisne (klikne z miško) na gumb, se bo program končal.

p=. [[Image:http://doc.qt.nokia.com/latest/images/gs2.png|Urejevalnik s gumbom Končaj]]

Pa si oglejmo kodo:
<code>
#include <QtGui>

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

QTextEdit textEdit;
 QPushButton quitButton("Končaj");

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

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

QWidget window;
 window.setLayout(&layout);

window.show();

return app.exec();
}
</code>
V 1. vrstici vstavimo [http://doc.qt.nokia.com/latest/qtgui.html QtGui], ki vsebuje vse Qt-ove razrede za grafični uporabniški vmesnik.

V 10. vrstici uporabimo Qt-ov mehanizem signalov in rež, s čimer omogočimo da se ob pritisku gumba Končaj aplikacija konča. Reža je funkcija, ki jo lahko prek njenega imena (kot literalenega niza) sprožimo med izvajanjem. Signal je funkcija, ki bo ob klicu sprožila reže, ki so registrirane pri njej. To imenujemo povezovanje reže s signalom in oddajanje signala.

Funkcija [http://doc.qt.nokia.com/latest/qcoreapplication.html#quit quit()] je reža razreda [http://doc.qt.nokia.com/latest/qapplication.html QApplication], ki konča aplikacijo. Funkcija [http://doc.qt.nokia.com/latest/qabstractbutton.html#clicked clicked()] je signal, ki je del razreda [http://doc.qt.nokia.com/latest/qpushbutton.html QPushButton] in se odda, ko je gumb pritisnjen. Statična funkcija [http://doc.qt.nokia.com/latest/qobject.html#connect QObject::connect()] poskrbi za povezavo reže s signalom. SIGNAL () in SLOT() sta dva nakra, ki sprejmeta podpisa funkcij signala in reže, ki bosta povezana. Podati moramo tudi kazalca na objekta, ki bosta poslala in prejela signal.

V 12. vrstici ustvarimo razpored razreda [http://doc.qt.nokia.com/latest/qvboxlayout.html QVBoxLayout]. Kot smo že omenili, lahko gradniki vsebujejo druge gradnike. Omejitve (položaj in velikost) vsebovanih gradnikov je moč nastaviti neposredno, vendar je običajno preprosteje uporabiti razpored. Razpored upravlja z omejitvami gradnikovih podgradnikov. [http://doc.qt.nokia.com/latest/qvboxlayout.html QVBoxLayout] podgradnike razporedi v stolpec.

V 13. in 14. vrstici urejevalno polje in gumb dodamo v razpored. V 17. razpored nastavimo na glavnem gradniku.

=== Naučite se več
|''. Tema|''. Tu|
|Signali in reže|[http://doc.qt.nokia.com/latest/signalsandslots.html| Signals and Slots]
|Razporedi|[http://doc.qt.nokia.com/latest/layout.html Layout Management], [http://doc.qt.nokia.com/latest/widgets-and-layouts.html Widgets and Layouts], [http://doc.qt.nokia.com/latest/examples-layouts.html| Layout Examples]
|Gradniki, ki pridejo s Qt|[http://doc.qt.nokia.com/latest/gallery.html Qt Widget Gallery], [http://doc.qt.nokia.com/latest/examples-widgets.html| Widget Examples] ===

== Izdelava podrazreda QWidget ==

Morda bi želeli, da se, ko uporabnik želi končati program, prikaže pogovorno okno, ki ga vpraša, če to res želi storiti. V tem primeru bomo izdelali podrazred razreda [http://doc.qt.nokia.com/latest/qwidget.html QWidget] in dodali režo, ki jo bomo povezali z gumbom Končaj.

p=. [[Image:http://doc.qt.nokia.com/latest/images/gs3.png|Urejevalnik z dedovanjem od QWidget]]

Pa si oglejmo kodo:
<code>
class Notepad : public QWidget
{
 Q_OBJECT

public:
 Notepad();

private slots:
 void quit();

private:
 QTextEdit *textEdit;
 QPushButton *quitButton;
};
</code>
Macro Q_OBJECT mora biti v definiciji razreda prvi in določa, da je naš razred [http://doc.qt.nokia.com/latest/qobject.html QObject] (seveda mora tudi dedovati od QObject). [http://doc.qt.nokia.com/latest/qobject.html QObject] običajnemu razredu C++ doda množico zmožnosti. Na primer, v času izvajanja lahko poizvedujemo po imenu razreda in imenih rež. Poizvedovati je možno tudi po tipih parametrov reže in jo izvesti.

V 13. vrstici deklariramo režo quit(). To je s pomočjo makra slots preprosto. Režo quit() lahko sedaj povežemo s signali, ki imajo ustrezen podpis (vsak signal, ki ne potrebuje nobenega parametra).

Namesto da bi postavili grafični uporabniški vmesnik in povezali režo v funkciji main(), uporabimo konstruktor razreda Notepad.
<code>
 Notepad::Notepad()
 {
 textEdit = new QTextEdit;
 quitButton = new QPushButton(tr("Končaj"));

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

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

 setLayout(layout);

 setWindowTitle(tr("Urejevalnik"));
 }
</code>
Kot smo videli v definiciji razreda, uporabljamo kazalce do naših [http://doc.qt.nokia.com/latest/qobject.html-ov QObject] (textEdit in quitButton). Kot splošno pravilo: [http://doc.qt.nokia.com/latest/qobject.html-e QObject] naj bi vedno ustvarjali na kopici in jih nikoli kopirali.

Sedaj okoli uporabniku vidnih nizov uporabimo funkcijo [http://doc.qt.nokia.com/latest/qobject.html#tr tr()]. Ta funkcija je potrebna, če želite svoj program ponuditi v več jezikih (npr. še v angleščini in kitajščini). Tu se ne bomo spuščali v podrobnosti, lahko pa sledite povezavi Qt Linguist v tabeli Naučite se več.

=== Ustvaritev datoke .pro ===
Za ta primer bomo napisali datoteko .pro po meri in ne bomo uporabili qmake-ove možnosti -project.
<code>
 HEADERS = notepad.h
 SOURCES = notepad.cpp  main.cpp
</code>
Naslednji ukazi zgradijo primer:
<code>
 qmake
 make
</code>
h3. Naučite se več:
|''. Tema|''. Tu|
|tr() in internacionalizacija|[http://doc.qt.nokia.com/latest/linguist-manual.html Qt Linguist Manual], [http://doc.qt.nokia.com/latest/i18n-source-translation.html Writing Source Code for Translation], [http://doc.qt.nokia.com/latest/linguist-hellotr.html Hello tr() Example], [http://doc.qt.nokia.com/latest/internationalization.html| Internationalization with Qt]
|[http://doc.qt.nokia.com/latest/qtwebkit-bridge.html#qobjects-i QObject] in Qt-ov objektni model (to je osnovno za razumevanje Qt-a)|[http://doc.qt.nokia.com/latest/object.html| Object Model]
|qmake in Qt-ov sistem za gradnjo|[http://doc.qt.nokia.com/latest/qmake-manual.html| qmake Manual]



== Uporaba QMainWindow ==
Za veliko programov bo koristno, če uporabite [http://doc.qt.nokia.com/latest/qmainwindow.html QMainWindow], ki ima svoj lasten razpored, v katerega lahko dodate menijsko vrstico, podokna, orodjarne in vrstico stanja. [http://doc.qt.nokia.com/latest/qmainwindow.html QMainWindow] ima osrednje področje, ki ga lahko zapolnjuje katerikoli gradnik. V našem primeru bo to naše urejevalno polje.

p=. [[Image:http://doc.qt.nokia.com/latest/images/gs4.png|Urejevalnik s QMainWindow]]

Pa si oglejmo novo definicijo razreda Notepad:
<code>
 #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;
 };
</code>
Dodamo dve novi reži za odpiranje in shranjevanje dokumenta. Reži bomo implementirali v naslednjem razdelku.

Pogosto se zgodi, da želimo v glavnem oknu isto režo izvesti iz več gradnikov. Primera sta menijski vnos in gumb orodjarne. Da bi bilo to čim lažje, Qt ponuja razred [http://doc.qt.nokia.com/latest/qaction.html QAction], ki ga lahko podamo več gradnikom in je povezan z režo. Na primer, [http://doc.qt.nokia.com/latest/qmenu.html QMenu] in [http://doc.qt.nokia.com/latest/qtoolbar.html QToolBar] lahko menijske vnose in gumbe orodjarne ustvarita iz istih [http://doc.qt.nokia.com/latest/qaction.html-ov QAction]. Kmalu bomo videli, kako to deluje.

Kot prej bomo za postavitev uporabniškega vmesnika uporabili konstruktor Notepad-a
<code>
 Notepad::Notepad()
 {
 saveAction = new QAction(tr("&Odpri …"), this);
 saveAction = new QAction(tr("&Shrani"), this);
 exitAction = new QAction(tr("Konča&j"), 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("&Datoteka"));
 fileMenu->addAction(openAction);
 fileMenu->addAction(saveAction);
 fileMenu->addSeparator();
 fileMenu->addAction(exitAction);

 textEdit = new QTextEdit;
 setCentralWidget(textEdit);

 setWindowTitle(tr("Urejevalnik"));
 }
</code>
[http://doc.qt.nokia.com/latest/qaction.html-e QAction] ustvarimo z besedilom, ki se pojavi na gradnikih, za katere uporabimo QAction-e (v našem primeru so to menijski vnosi). Če bi jih želeli uporabiti tudi za orodjarne, bi dejanjem lahko dodali tudi [http://doc.qt.nokia.com/latest/qicon.html ikone].

Ko sedaj uporabnik klikne na menijski vnos, bo vnos sprožil dejanje in izvedla se bo ustrezna reža.

h3. Naučite se več:
|''. Tema|''. Tu|
|Glavna okna in razredi glavnih oken|[http://doc.qt.nokia.com/latest/mainwindow.html Application Main Window], [http://doc.qt.nokia.com/latest/examples-mainwindow.html| Main Window Examples]
|Program z vmesnikom z več dokumenti|[http://doc.qt.nokia.com/latest/qmdiarea.html QMdiArea], [http://doc.qt.nokia.com/latest/mainwindows-mdi.html| MDI Example]



== Odpiranje in shranjevanje ==
V tem primeru bomo implementirali delovanje rež open() in save(), ki smo ju dodali v prejšnjem primeru.

p=. [[Image:http://doc.qt.nokia.com/latest/images/gs5.png|Pogovorno okno za odpiranje datotek]]

Zaželi bomo z režo open():
<code>
 QString fileName = QFileDialog::getOpenFileName(this, tr("Odpiranje datoteke"), "",
 tr("Besedilne datoteke ('''.txt);;Datoteke C++ ('''.cpp'''.h)"));

 if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::ReadOnly)) {
 QMessageBox::critical(this, tr("Napaka"),
 tr("Datoteke ni bilo moč odpreti"));
 return;
 }
 QString contents = file.readAll().constData();
 textEdit->setPlainText(contents);
 file.close();
 }
</code>
V prvem koraku uporabnika vprašamo po imenu datoteke, ki bo odprta. Qt prihaja s [http://doc.qt.nokia.com/latest/qfiledialog.html QFileDialog], ki je pogovorno okno, iz katerega lahko uporabnik izbere datoteko. Gornja slika prikazuje pogovorno okno na namizju KDE Plasma na Linuxu. Statična funkcija [http://doc.qt.nokia.com/latest/qfiledialog.html#getOpenFileName getOpenFileName()] prikaže pogovorno okno, ki je vedno nad vsemi programovimi okni in ne vrne nič, dokler uporabnik ne izbere datoteke. Pogovorno okno vrne polno pot do izbrane datoteke ali pa prazen niz, če je uporabnik preklical pogovorno okno.

Če imamo ime datoteke, datoteko poskušamo odpreti z [http://doc.qt.nokia.com/latest/qiodevice.html#open open()], ki vrne true, če je bilo datoteko moč odpreti. V podrobnosti rokovanja z napakami se tu ne bomo spuščali, lahko pa sledite povezavam v tabeli Naučite se več. Če datoteke ni bilo moč odpreti, uporabimo [http://doc.qt.nokia.com/latest/qmessagebox.html QMessageBox] in prikažemo pogovorno okno s sporočilom o napaki (za nadaljnje podrobnosti si oglejte opis [http://doc.qt.nokia.com/latest/qmessagebox.html-a QMessageBox]).

Dejanjsko branje podatkov je zahvaljujoč funkciji [http://doc.qt.nokia.com/latest/qiodevice.html#readAll readAll()] preprosto. Funkcija vse podatke iz datoteke vrne v objektu [http://doc.qt.nokia.com/latest/qbytearray.html QByteArray]. Funkcija [http://doc.qt.nokia.com/latest/qbytearray.html#constData constData()] vse podatke vrne kot const char''', za kar ima [http://doc.qt.nokia.com/latest/qstring.html QString] konstruktor. Vsebino potem lahko prikažemo v urejevalnem polju. Nazadnje še zapremo datoteko s klicem funkcije [http://doc.qt.nokia.com/latest/qiodevice.html#close close()] in tako opisovalnik datoteke vrnemo operacijskemu sistemu.

Nadaljujmo še z režo save():
<code>
 QString fileName = QFileDialog::getSaveFileName(this, tr("Shranjevanje datoteke"), "",
 tr("Besedilne datoteke ('''.txt);;Datoteke C++ ('''.cpp '''.h)"));

 if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::WriteOnly)) {
 // sporočilo o napaki
 } else {
 QTextStream stream(&file);
 stream << textEdit->toPlainText();
 stream.flush();
 file.close();
 }
 }
</code>
Za zapisovanje vsebine urejevalnega polja v datoteko uporabimo razred [http://doc.qt.nokia.com/latest/qtextstream.html QTextStream], ki ovija objekt [http://doc.qt.nokia.com/latest/qfile.html QFile]. Besedilni tok lahko nize [http://doc.qt.nokia.com/latest/qstring.html QString] zapisuje neposredno v datoteko. [http://doc.qt.nokia.com/latest/qfile.html QFile] s funkcijo [http://doc.qt.nokia.com/latest/qiodevice.html#write write()] iz [http://doc.qt.nokia.com/latest/qiodevice.html QIODevice] sprejema le surove podatke (char''').

=== Naučite se več
|''. Tema|''. Tu|
|Datoteke in V/I naprave|[http://doc.qt.nokia.com/latest/qfile.html QFile], [http://doc.qt.nokia.com/latest/qiodevice.html| QIODevice] ===