Anna University Results November - December 2011 available with your GPA only for Credit System

Exam Results 2012

Exam Results 2012 Inspirational Quotes

Tuesday, October 11, 2011

GUI Programming Using Qt Designer


GUI Programming Using Qt Designer

Aim :

Learn to write GUI programs using FOSS tools like Qt,GTK,Gambas, etc. in Linux.

Introduction :

GUI programming on Linux is based on the X Window system. X provides windowing on computer displays and manages keyboard, pointing device control functions and touch-screens. X provides the basic framework, or primitives, for building such GUI environments: drawing and moving windows on the display and interacting with a mouse, keyboard or touchscreen. X uses GUI toolkits to help the development of GUI programs. GUI toolkit is a set of widgets for use in designing applications with graphical user interfaces (GUIs). GUI toolkits can be based on different languages. The most commonly used languages are C/C++. Often the toolkits provide higher level language bindings which allow the user to program GUIs using an easier to use higher level language like Python, Ruby etc. There are two popular GUI toolkits which are widely used today. They are Qt and GTK+. Qt is written in C++ while GTK+ is written in C. Both toolkits provide bindings in a wide variety of languages. For users who are familiar with Visual basic, Gambas is a full-featured object language and development environment built on a BASIC interpreter which runs on top of the X window system. It in turn relies on the underlying GUI toolkits (both Qt and GTk+). This exercise consists of developing GUI programs using the Qt toolkit.

Description :

We will learn to setup their systems to develop using Qt and write 5 programs and test their results. The programs are of increasing complexity and introduce the students to more and more concepts. All the programs will be purely code drive, ie. the user interface is developed entirely using C++ code. None of the visual GUI builders will be used for these exercises.


Pre-requisites:

Qt Designer Installation :

Step 1:

Goto Terminal window

Step 2 :

Enter into root user account.

            $su
            Password : <your password>


Step 3 :
           
            Install Qt Development Tool using following Command

            # yum install qt-devel

Step 4 :

Install Qt Demo using following Command

            # yum install qt-demos

Step 5 :

Install Qt Examples using following Command

            # yum install qt-examples

Step 6 :

Install Qt Documents using following Command

            # yum install qt-doc

Step 7 :

Install GCC C++ Compiler tool using following Command

            # yum install gcc-c++
           

Step 8 :

            Now you can goto Applications -> Programming -> Qt4 Designer

            Use this Qt Designer Tool to develop the GUI Application …

            You can also use Qt Demo and Qt Assitant for example help

Step 9 :

            Now you can develop GUI application using Qt Designer

Simple Example GUI Application :
           
Example :

Menus and Toolbars

·         This program will display a menu which can be used to close the program.

·         we have 3 files as part of the program:

1.      mymenu.h
2.      mymenu.cpp
3.      main.cpp

·         Create a new directory “qtmenu” for the program.

# mkdir qtmenu

·         Go to the newly created directory “qtmenu”.

# cd qtmenu

·         Create the “mymenu.h“ file in the qtmenu directory.

                                    # sudo gedit mymenu.h

Type the following code in geditor

// mymenu.h

#include <QMainWindow>
class MyMenu : public QMainWindow
{
public:
MyMenu(QWidget *parent = 0);
};

·         Create the “mymenu.cpp“ file in the qtmenu directory.

# sudo gedit mymenu.cpp

Type the following code in geditor

//mymenu.cpp

#include "mymenu.h"
#include <QMenu>
#include <QMenuBar>
#include <QApplication>
MyMenu::MyMenu(QWidget *parent)
: QMainWindow(parent)
{
//create the quit action object
QAction *quit = new QAction("&Quit", this);
//create the file menu
QMenu *file;
file = menuBar()->addMenu("&File");
9
CS2406-Lab Manual - NRCFOSS/AU-KBC Centre, Anna University Chennai
//add the quit action to the new menu
file->addAction(quit);
//connect the triggered signal from the quit action menu
//to the global quit method which closes the application
connect(quit, SIGNAL(triggered()), qApp, SLOT(quit()));
}

·         Create the “main.cpp” file in the qtmenu directory.

                                    # sudo gedit main.cpp

Type the following code in geditor

//main.cpp

#include "mymenu.h"
#include <QDesktopWidget>
#include <QApplication>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
MyMenu window;
window.setWindowTitle("My menu");
window.show();
return app.exec();
}

·         Once the file has been saved, use the following commands to compile and execute the program.

                                    # qmake-qt4 –project

# qmake-qt4

# make

·         To run this GUI program goto “qtmenu” directory and Click “qtmenu.exe” File

·         On running the program we get a window with a menu “ File -> Quit” which allows us to close the program.

             Hope this will be helpful for you!!!

 Stay tuned for updates. If you find any problem or have any suggestions for improvements, you can always mail me.

All the best for Your Exam !!!!!


By M.Baran Mahamood