[Qt Programming] GUI 設計介紹

  Qt 提供二種方式設計GUI, 一種是傳統的拖拉點放

  另一種則是類似java, 用"手"刻出GUI. 在這裡介紹使用程式設計GUI

  當使用者新增一個應用程式專案時,除了設定專案環境之外,再來便是決定GUI

  和VS一樣,Qt creator提供Mainwindow和Dialog二種GUI類別(QWidget是它們的基礎類別)

  首先來看Mainwindow,

  新增一Qt圖形介面應用程式的專案時,來到類別資訊選擇QMainWindow

  QMainWindow的layout以下圖所示

    我們可以把它想成一應用程式的主視窗,其中最重要的便是Central widget. 剛開始設計時,寫了很多GUI的程式碼,卻沒有顯示在視窗上,原因便是出在這,以下是個簡單的範例

Mainwindow.h

#include <QMainWindow>
#include <QGroupBox>
#include <QPushButton>
#include <QVBoxLayout>

namespace Ui {
 class MainWindow;
}

class MainWindow : public QMainWindow
{

    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    QGroupBox *buttonBox;
    QPushButton *enterPButton;
    QPushButton *cancelPButton;

private:
    Ui::MainWindow *ui;
};
#endif // MAINWINDOW_H

MainWindow.cpp

#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    buttonBox = new QGroupBox(tr("Buttons"));
    enterPButton = new QPushButton(tr("Enter"));
    cancelPButton = new QPushButton(tr("Cancel"));
    //宣告一widget物件將其置於central widget
    QWidget *widget = new QWidget;
    setCentralWidget(widget);
    //設定widget layout
    QVBoxLayout *vbox = new QVBoxLayout;
    vbox->addWidget(enterPButton);
    vbox->addWidget(cancelPButton);
    buttonBox->setLayout(vbox);
    widget->setLayout(vbox);

}

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

  
執行畫面

以上便是簡單的MainWindow範例,而Dialog的GUI差別在CentralWidget,將在下一篇介紹