Layout Design
-
-
Yes, you're right.
I finished my example of the structure of the wireframe. Using QMainWindow.
The Screenshot:
!http://i.minus.com/i8sPHZX6gaXl.png!
The Code:
main.cpp
@
#include <QApplication>
#include "mainwindow.h"int main(int argc, char *argv[])
{QApplication application(argc, argv); MainWindow window; window.setWindowTitle("Gui Code"); window.resize(600, 400); window.show(); application.exec();}
@mainwindow.cpp
@
#include "mainwindow.h"MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent)
{
window = new QWidget;MenuBar = new QMenuBar; fileMenu = new QMenu("&File");; editMenu = new QMenu("&Edit"); buildMenu = new QMenu("&Build"); toolsMenu = new QMenu("&Tools"); MenuBar->addMenu(fileMenu); MenuBar->addMenu(editMenu); MenuBar->addMenu(buildMenu); MenuBar->addMenu(toolsMenu); GlobalWrapper = new QVBoxLayout; FooterWrapper = new QVBoxLayout; TabsWrapper = new QHBoxLayout; leftTab = new QTabWidget; middleTab = new QTabWidget; rightTab = new QTabWidget; footerTab = new QTabWidget; leftWidget = new QWidget; middleWidget = new QWidget; rightWidget = new QWidget; footerWidget = new QWidget; leftTab->addTab(leftWidget, "Tab 1"); leftTab->addTab(new QPushButton("Tab 2"), "Tab 2"); middleTab->addTab(middleWidget, "Tab 1"); middleTab->addTab(new QPushButton("Tab 2"), "Tab 2"); rightTab->addTab(rightWidget, "Tab 1"); rightTab->addTab(new QPushButton("Tab 2"), "Tab 2"); footerTab->addTab(footerWidget, "Tab 1"); footerTab->addTab(new QPushButton("Tab 2"), "Tab 2"); TabsWrapper->addWidget(leftTab); TabsWrapper->addWidget(middleTab); TabsWrapper->addWidget(rightTab); FooterWrapper->addWidget(footerTab); GlobalWrapper->addLayout(TabsWrapper); GlobalWrapper->addLayout(FooterWrapper); window->setLayout(GlobalWrapper); this->setMenuBar(MenuBar); setCentralWidget(window);}
@mainwindow.h
@
#ifndef MAINWINDOW_H
#define MAINWINDOW_H#include <QMainWindow>
#include <QtGui>
#include <QtCore>class MainWindow : public QMainWindow
{Q_OBJECTpublic:
explicit MainWindow(QWidget *parent = 0);signals:
public slots:
private:
QMenuBar *MenuBar; QWidget *window, *leftWidget, *middleWidget, *rightWidget, *footerWidget; QMenu *fileMenu, *editMenu, *buildMenu, *toolsMenu; QHBoxLayout *TabsWrapper; QVBoxLayout *GlobalWrapper, *FooterWrapper; QTabWidget *leftTab, *middleTab, *rightTab, *footerTab;};
#endif // MAINWINDOW_H
@@
SOURCES += main.cpp
mainwindow.cpp
HEADERS += mainwindow.h
@I hope I have helped.
It now remains only to create some methods as CreateMenu (), to better organize the code.
Next time i'll post the ToolBar and StatusBar.
-
l3e0wulf, a view behind the scenes of QtDesigner for you:
When you design complex interfaces in QtDesigner it is as simple as drag-and-drop and some property editing, much like in Delphi or C++ Builder. But there is a difference: Delphi and Builder add GUI elements to the main class of your app. So your header there looks like
@
// C++ Builder snippet, Delphi is the same, but Object Pascal - style
class MyWindow : public TForm {
TButton *btn1;
TButton *btn2;
// .... whatever GUI elements you use
};
@
and that is all. Their properties are stored in *.dfm files and you don't see how they are tied togather. Some job is done "hiddenly" Sad :(In Qt you have .ui file, that describes how to build your GUI, and it is this file, that you (implicitly) create, by dragging and dropping widgets. This is plain xml file. What gets generated is a special class with the same code you are trying to make by hand. Just create a hello-world like app and look for ui_foo.h - named file in that projects directory. This file is generated as part of compilation process. When you want those widgets added to some, hm.., another widget (say a QMainWindow or just simple QWidget) there is only one function to call - *setupUi(QWidget parent). This function does all the job of creating widgets and layouts and is part of the generated class.
So my point is: Qt Designer lets you see the "hidden" job done by himself, and there is no need to worry! =)
-
Thank you elephanten. :D