Writing a basic Qt project with Qt Creator

2016-10-10 Programming Qt Tutorials Niclas Roßberger

I’m assuming you are already able to program and at least had a look at C++. For example I won’t explain why int main(int argc, char *argv[]) is in the C++ source code.

If you create a “Qt Console Application” you will have the following code:

#include <QCoreApplication>

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

    return a.exec();
}

The line QCoreApplication a(argc, argv) will pass the command line parameters over to the Qt-Framework and initialize it. After that you can use the framework. It’s very rare, that any other commands are executed before this line. To start the processing of events in the main event-loop a.exec() is called. This method doesn’t exit until said to do so. If no events are in the loop, it waits for new ones. To quit the program you can call QCoreApplication::quit() or QCoreApplication::exit() both methods are equivalent. They will enqueue an event to exit the event-loop. So even though the method returns immediately the program will not exit until all events enqueued before are executed. If you want to learn more about this topic it’s very helpful to visit the (well written) Qt(5) Documentation and search for the topic or to use Google instead.

Between QCoreApplication a(argc, argv) and a.exec() you normally do the initialization of your code. In case of a “Qt Widgets Application” you’ll initialize the MainWindow.

#include "mainwindow.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();

    return a.exec();
}

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}

This code will display an empty window. The missing header-file ui_mainwindow.h is one reason why Qt is so popular. It will be generated by Qt with the contents of mainwindow.ui. It contains all the layouts, buttons, views, basically everything that is displayed to the user. You can edit this file with a graphical WYSIWYG editor. This way your code has a separation of the ui and function by default. If you want, you can still use code to design your ui, you can even mix both, but you don’t have to. By using the ui-file you can eliminate a lot of boilerplate code; and as we all know less code equals less possible bugs.

Let’s add a button to our ui. First you need to open the ui-file. In my case it’s mainwindow.ui. Then it’s as simple as dragging the “Push Button” to the position you like on your ui and drop it. There it is on the ui; and if you compile & run your app, it’s already on the real ui.

Now we change the text on the button. Just mark the button, then go to the bottom right of Qt-Creator and search for text. Change the content to what ever you like, I’ll change it to say hello. Compile & run, and you see the change already happened.

But what if I want to display a text on the console if the button is pressed? No problem, just click right on the button and select Go to slot.... A pop-up will open, and you can select a signal (= event), on which you want to execute something. In our case it’s clicked(). Confirm with OK and let Qt-Creator do it’s work. Now you have a method called on_pushButton_clicked() (if you left the objectName at its default value “pushButton”). Now just write your code to print a line on the console: qDebug() <<"Hello World"; (and don’t forget to include QDebug). Compile & run your application. If you now press the button, Hello World is displayed on the console. If you have problems with this tutorial, just ask in the comments or checkout the working example at github.com/nidomiro/BasicWidgetsApplication.

The best way to learn anything [in my opinion] is to just do it and see if it works the way you want. In programming, you can do this easily. So just play around, checkout some existing Qt applications and change some code and see what the result is. And as a last tip for this post: if something doesn’t compile or link but should do so, try cleaning the project and run qmake again.

Continue in this series: