PDA

View Full Version : Create multi UI screen application using C++ and navigate through it using PushButton



sask1236
30th August 2013, 07:14
Hello All,
I want to create multi UI screen application using C++ and navigate through it using PushButtons.
Suppose on every screen there are many other objects and Next and Previous PushButtons. When I press the button the respective screen must appear and previous screen must get closed. I have gone through net and found that using QStackWidget this is possible and easy, like:



QWidget *firstPageWidget = new QWidget;
QWidget *secondPageWidget = new QWidget;
QWidget *thirdPageWidget = new QWidget;

QStackedWidget *stackedWidget = new QStackedWidget;
stackedWidget->addWidget(firstPageWidget);
stackedWidget->addWidget(secondPageWidget);
stackedWidget->addWidget(thirdPageWidget);



With setCurrentIndex ( int index )

Problem:
I am not getting how to use it, suppose I have 2 UI’s 1. MainWindow.UI and 2. MainWindow2.UI. So how to fit my MainWindow.UI and MainWindow2.UI there.

Can someone please share a simple working project for the same. I am new to QT and so not able to construct from help available on net.

Thanks in Advance
Sahil Kulkarni.

wagmare
30th August 2013, 07:19
go through this example
http://qt-project.org/doc/qt-4.8/dialogs-configdialog.html

Santosh Reddy
30th August 2013, 08:16
I have gone through net and found that using QStackWidget this is possible and easy, like:
Did you consider using QWizard, it might be better for your need, it already has forward and backward navigation between multiple pages (widgets)

wysota
30th August 2013, 08:24
Can someone please share a simple working project for the same. I am new to QT and so not able to construct from help available on net.
A simple working project for the same is available in QStackedWidget docs.

sask1236
30th August 2013, 12:31
Did you consider using QWizard, it might be better for your need, it already has forward and backward navigation between multiple pages (widgets)

Thanks, but basically i mean Goto specific screen on pushbutton press. Sorry i should have mentioned that.
I am still not able to link it, how to add MainWindow.UI and MainWindow1.UI to QStackWidget and access them by index.

Thanks in Advance
Sahil Kulkarni

Santosh Reddy
30th August 2013, 12:36
Thanks, but basically i mean Goto specific screen on pushbutton press. Sorry i should have mentioned that.
That can be done using QWizard, the push button can be linked to any wizard page.


I am still not able to link it, how to add MainWindow.UI and MainWindow1.UI to QStackWidget and access them by index.
Load mainwindow.ui into widget, load mainwindow1.ui into widget1 and then put widget and widget1 into QStackedWidget

sask1236
31st August 2013, 19:46
That can be done using QWizard, the push button can be linked to any wizard page.


Load mainwindow.ui into widget, load mainwindow1.ui into widget1 and then put widget and widget1 into QStackedWidget

I have attached my project files, can you please help with loding ui files. I am not so trong in C++, i am studing for it.

I am using Qt Creator 2.4.1
Based on Qt 4.8.0 (32 bit)
Built on Mar 21 2012

main.cpp


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

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

return a.exec();
}


mainwindow.cpp


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

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

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

void MainWindow::on_pushButton_clicked()
{
// Load Screen 2
}

void MainWindow::on_pushButton_2_clicked()
{
// Load Screen 3
}


mainwindow.h


#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 slots:
void on_pushButton_clicked();

void on_pushButton_2_clicked();

private:
Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H


mainwindow.ui


<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow</class>
<widget class="QMainWindow" name="MainWindow">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>300</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<widget class="QWidget" name="centralWidget">
<widget class="QPushButton" name="pushButton">
<property name="geometry">
<rect>
<x>50</x>
<y>170</y>
<width>131</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 2</string>
</property>
</widget>
<widget class="QPushButton" name="pushButton_2">
<property name="geometry">
<rect>
<x>237</x>
<y>170</y>
<width>121</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 3</string>
</property>
</widget>
<widget class="QLabel" name="label">
<property name="geometry">
<rect>
<x>150</x>
<y>60</y>
<width>81</width>
<height>21</height>
</rect>
</property>
<property name="text">
<string>Screen 1</string>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menuBar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>25</height>
</rect>
</property>
</widget>
<widget class="QToolBar" name="mainToolBar">
<attribute name="toolBarArea">
<enum>TopToolBarArea</enum>
</attribute>
<attribute name="toolBarBreak">
<bool>false</bool>
</attribute>
</widget>
<widget class="QStatusBar" name="statusBar"/>
</widget>
<layoutdefault spacing="6" margin="11"/>
<resources/>
<connections/>
</ui>


Now using Add New... -> Qt Designer Form Class -> Main Window i have created 2 UI
mainwindow1.cpp


#include "mainwindow1.h"
#include "ui_mainwindow1.h"

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

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

void MainWindow1::on_pushButton_clicked()
{
// Load Screen 1
}

void MainWindow1::on_pushButton_2_clicked()
{
// Load Screen 3
}


mainwindow1.h


#ifndef MAINWINDOW1_H
#define MAINWINDOW1_H

#include <QMainWindow>

namespace Ui {
class MainWindow1;
}

class MainWindow1 : public QMainWindow
{
Q_OBJECT

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

private slots:
void on_pushButton_clicked();

void on_pushButton_2_clicked();

private:
Ui::MainWindow1 *ui;
};

#endif // MAINWINDOW1_H


mainwindow1.ui


<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow1</class>
<widget class="QMainWindow" name="MainWindow1">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>300</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<widget class="QWidget" name="centralwidget">
<widget class="QPushButton" name="pushButton">
<property name="geometry">
<rect>
<x>57</x>
<y>150</y>
<width>111</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 1</string>
</property>
</widget>
<widget class="QPushButton" name="pushButton_2">
<property name="geometry">
<rect>
<x>230</x>
<y>150</y>
<width>121</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 3</string>
</property>
</widget>
<widget class="QLabel" name="label">
<property name="geometry">
<rect>
<x>150</x>
<y>50</y>
<width>66</width>
<height>17</height>
</rect>
</property>
<property name="text">
<string>Screen 2</string>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>25</height>
</rect>
</property>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<resources/>
<connections/>
</ui>

mainwindow2.cpp


#include "mainwindow2.h"
#include "ui_mainwindow2.h"

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

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

void MainWindow2::on_pushButton_clicked()
{
// Load Screen 1
}

void MainWindow2::on_pushButton_2_clicked()
{
// Load Screen 2
}

mainwindow2.h


#ifndef MAINWINDOW2_H
#define MAINWINDOW2_H

#include <QMainWindow>

namespace Ui {
class MainWindow2;
}

class MainWindow2 : public QMainWindow
{
Q_OBJECT

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

private slots:
void on_pushButton_clicked();

void on_pushButton_2_clicked();

private:
Ui::MainWindow2 *ui;
};

#endif // MAINWINDOW2_H

mainwindow2.ui


<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow2</class>
<widget class="QMainWindow" name="MainWindow2">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>300</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<widget class="QWidget" name="centralwidget">
<widget class="QPushButton" name="pushButton">
<property name="geometry">
<rect>
<x>40</x>
<y>160</y>
<width>121</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 1</string>
</property>
</widget>
<widget class="QPushButton" name="pushButton_2">
<property name="geometry">
<rect>
<x>217</x>
<y>160</y>
<width>121</width>
<height>27</height>
</rect>
</property>
<property name="text">
<string>Go To Screen 2</string>
</property>
</widget>
<widget class="QLabel" name="label">
<property name="geometry">
<rect>
<x>150</x>
<y>50</y>
<width>66</width>
<height>17</height>
</rect>
</property>
<property name="text">
<string>Screen 3</string>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>25</height>
</rect>
</property>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<resources/>
<connections/>
</ui>

MultiScr9.pro


#-------------------------------------------------
#
# Project created by QtCreator 2013-08-31T03:15:06
#
#-------------------------------------------------

QT += core gui

TARGET = MultiScr9
TEMPLATE = app


SOURCES += main.cpp\
mainwindow.cpp \
mainwindow1.cpp \
mainwindow2.cpp

HEADERS += mainwindow.h \
mainwindow1.h \
mainwindow2.h

FORMS += mainwindow.ui \
mainwindow1.ui \
mainwindow2.ui


Added after 8 minutes:

Please find the project attached


-
Sahil Kulkarni

Santosh Reddy
31st August 2013, 21:23
It is evident that you are reading the documentation, please do read the documentation it answers many of your initial startup questions.

Anyway, here is the some modified code to look at.

sask1236
2nd September 2013, 10:34
Thanks for your support,
The project worked fine and i could navigate using Next and Previous buttons.
But you have created a page using C++, and added objects using C++. For me its is but difficult to code the objects used and assign SLOT and SIGNAL to them using C++, thus i am interested in using UI file as a beginner level.
As in the attached application i have created 3 UI files, can you help me with UI based project.

Thanks in Advance,
Sahil Kulkarni

Santosh Reddy
2nd September 2013, 13:03
It is very similar, anyway I have attached updated project using ui files