Programming in Qt 1 - Absolute Basics

INDEX:
Purpose
Prerequisites
First program in depth

Purpose 
             As a somewhat new programmer (less than a year) I have run into some irritating tutorials in my experiences. When I began to learn the Qt framework and the Qt creator Integrated Development Environment (IDE) these experiences were ubiquitous. This is in part due to the self-explanatory documentation of the library, since the documentation is enough for some people to learn their way around. Through the few good online tutorials and documentation I have taught myself the basics of Qt and am now ready to share my learning process with the internet so that upcoming programmers can learn from my breakthroughs and mistakes.

Prerequisites
               During the next posts pertaining to this I will cover Qt, Qt creator and all of its parts, and .deb packaging later on. Qt is absolutely required, and Qt creator is required for this tutorial since I will use information specific to that IDE, but Qt development can be done without it. The main reason I choose to write about and use Qt creator is for its GUI designer. You can download Qt creator and Qt at http://qt.nokia.com/downloads. Qt is a huge library, so be patient.

First program in depth
            There really is nothing more that you need to do once you have a working version of Qt creator. Launch it and we can begin writing the first program. Launch Qt creator and do the following: Create project > Qt Widget project (Qt GUI Application) > (name it and put it in the folder) > use default settings > Default settings > Finish.

             You should now be placed in mainwindow.cpp, where the constructor and deconstructor are defined. There should be a folder on the left side of the application called "Forms" with an arrow. Click on it and click on mainwindow.ui. This is a blank canvas of a user interface. Next, take a push button from the left and drag it onto the canvas. The button will read "PushButton". The code you write now will show you how to change this to demonstrate control over the UI. You do not have to do this since you can edit the text right from the Gui designer, but this will be an introduction to external UI control.

         Hit edit on the left hand side and you will be brought to the QML (Q markup langauge) for the user interface. Ignore this and move back go mainwindow.cpp under sources.

        The user interface is accessed with "ui->" from mainwindow.cpp, So, after the code ui->setupUi(this); we can change the text of the push button. After it, write ui and hit ".". The . will convert itself into -> and you will have a list of UI items. The entries with a blue block are Qt classes, including pushButton, which is what we want. Type p and enter to select the push button. Now, use "." again to see a list of variables and functions relating to pushButton. Use setText("text here"); to change the button to whatever you wish.

The final code should look like this: ui->setupUi(this); ui->pushButton->setText("text here");
      
       This code is executed right after the program sets itself up, so the user never sees "PushButton" on the button.

In the next tutorial I will show you how to use Signals and Slots, which are the Qt equivalent of Swing's events. You will make it so the button toggles its name on every click.