Saturday, May 16, 2009

GUI Programming in C++ using the Qt Library under Linux

GUI Programming in C++ using the Qt Library, part 1 LG #78
In the vast world of GUI Development Libraries there stands apart a Library, known as 'Qt' for C++ developed by Trolltech AS. 'Qt' was commercially introduced in 1996 and since then many of the sophisticated user interfaces have been developed using this Library for varied applications.

Qt is cross-platform as it supports MS/Windows,Unix/X11 (Linux, Sun Solaris, HP-UX, Digital Unix, IBM AIX, SGI IRIX and many other flavors),Macintosh ( Mac OS X ) and Embedded platforms. Apart from this 'Qt' is object oriented, component based and has a rich variety of widgets available at the disposal of a programmer to choose from. 'Qt' is available in its commercial versions as 'Qt Professional' and 'Qt Enterprise Editions'. The free Edition is the non-commercial version of Qt and is freely available for download (www.trolltech.com).
Getting Started

First of all you need to download the library, i assume that you have downloaded the Qt/X11 version for Linux as the examples will be taken for the same.

You might require the superuser privlileges to install, so make sure you are 'root'.

Let's untar it into /usr/local directory :

[root@Linux local]# tar -zxvf qt-x11-free-3.0.1

[root@Linux local]# cd qt-x11-free-3.0.1

Next you will need to compile and install the library with the options you require to use.'Qt' Library can be compiled with custom options suiting your needs.We will compile it so that we get gif reading, threading , STL, remote control, Xinerama,XftFreeType (anti-aliased font) and X Session Management support apart from the basic features.

Before we proceed further, remember to set some environment variables that point to the correct location as follows:

QTDIR=/usr/local/qt-x11-free-3.0.1
PATH=$QTDIR/bin:$PATH
MANPATH=$QTDIR/man:$MANPATH
LD_LIBRARY_PATH=$QTDIR/lib:$LD_LIBRARY_PATH

export QTDIR PATH MANPATH LD_LIBRARY_PATH

You can include this information in your .profile in your home directory.

[root@Linux qt-x11-free-3.0.1]# ./configure -qt-gif -thread -stl -remote -xinerama -xft -sm

[root@Linux qt-x11-free-3.0.1]# make install

If all goes well, you will have the 'Qt' library installed on your system.



Your First Steps With 'Qt'

In order to start writing programs in C++ using the 'Qt' library you will need to understand some important tools and utilities available with 'Qt' Library to ease you job.


Qmake

Qmake let's you generate makefiles with the information based on a '.pro' file.


A simple project file looks something like this:

SOURCES = hello.cpp
HEADERS = hello.h
CONFIG += qt warn_on release
TARGET = hello

Here, 'SOURCES' can be used to define all the implementation source for the application, if you have more than one source file you can define them like this:

SOURCES = hello.cpp newone.cpp

or alternatively by:

SOURCES += hello.cpp
SOURCES += newone.cpp

Similarly 'HEADERS' let's you specify the header files belonging to your source.The 'CONFIG' section facilitates to give qmake info about the application configuration.This Project file's name should be the same as the application's executable. Which in our case is 'hello.pro'.

The Makefile can be generated by issuing the command:

[root@Linux mydirectory]# qmake -o Makefile hello.pro

or qmake -makefile hello.pro

Qt Designer

Qt Designer is a tool that let's you visually design and code user interfaces using the 'Qt' Library. The WYSIWYG interface comes in very handy for minutely tweaking the user interface and experimenting with various widgets.The Designer is capable of generating the entire source for the GUI at any time for you to enhance further. You will be reading more about the 'Qt Designer' in the articles that will follow.


Hello World!

Let's begin by understanding a basic 'Hello World' Program.Use any source editor of your choice to write the following code:

#include
#include

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

QApplication a( argc, argv );
QPushButton hello( "Hello world!", 0 );
hello.resize( 100, 30 );
a.setMainWidget( &hello );
hello.show();
return a.exec();

}

Save this code as a plain text file('hello.cpp'). Now let's compile this code by making a project file (.pro) as follows:

TEMPLATE = app
CONFIG += qt warn_on release
HEADERS =
SOURCES = hello.cpp
TARGET = hello


Let's save this file as 'hello.pro' in the same directory as that of our source file and continue with the generation of the Makefile.

[root@Linux mydirectory]# qmake -o Makefile hello.pro

Compile it using 'make'

[root@Linux mydirectory]# make


You are now ready to test your first 'Qt' Wonder. Provided you are in 'X', you can launch the
program executable.

[root@Linux mydirectory]# ./hello

You should see something like this:


Snapshot





Let's understand the individual chunks of the code we've written.

The First two lines in our code include the QApplication and QPushButton class definitions.
Always remember that there has to be just one QApplication object in your entire Application.

As with other c++ programs, the main() function is the entry point to your program and
argc is the number of command-line arguments while argv is the array of command-line arguments.

Next you pass these arguments received by Qt as under:

QApplication a(argc, argv)

Next we create a QPushButton object and initialize it's constructor with two arguments, the
label of the button and it's parent window (0 i.e., in it's own window in this case).

We resize our button with the following code:

hello.resize(100,30);

Qt Applications can optionally have a main widget associated with it.On closure of the main
widget the Application terminates.

We set our main widget as:

a.setMainWidget( &hello );

Next, we set our main widget to be visible. You have to always call show() in order to make
your widget visible.

hello.show();

Next we will finally pass the control to Qt. An important point to be noted here is that exec()
keeps running till the application is alive and returns when the application exits.

From: http://tldp.org/LDP/LG/issue78/taneja.html

No comments:

Post a Comment

Google+