26、布局管理器综合实例

26、向导界面

练习开发一个向导用户界面:

在同一个界面上展现不同的向导页面,

通过上一步和下一步按钮进行切换

不同页面上的元素组件和组件排布都不相同,

页面中的组件通过布局管理器进行排布。

通过布局嵌套进行界面设计:

26、布局管理器综合实例_第1张图片

通过QStackedLayout管理不同的页面

QStackedLayout-->QWidget1,,QWidget2,,QWidget3

26、布局管理器综合实例_第2张图片

通过子组件的方式生成不同的页面

QWidget->QLayout ->组件一,组件二

#ifndef _WIDGET_H_
#define _WIDGET_H_
#include
#include
#include
#include
#include
class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton preBtn;
    QPushButton nextBtn;
    QLabel fLbl1;
    QLabel fLbl2;
    QLabel fLbl3;
    QLabel fLbl4;
    QLineEdit sLineEdit;
    QPushButton tPushBtn1;
    QPushButton tPushBtn2;
    QStackedLayout sLayout;
    void initControl();
    QWidget* get1stPage();
    QWidget* get2ndPage();//三个页面
    QWidget* get3rdPage();
private slots:
    void onPreBtnClicked();
    void onNextBtnClicked();
public:
    Widget(QWidget* parent = 0);
    ~Widget();
};

#endif // _WIDGET_H_

#include "Widget.h"
#include
#include
#include
#include
#include
Widget::Widget(QWidget *parent) : QWidget(parent)
{
    initControl();
}
void Widget::initControl()
{
    QVBoxLayout* vLayout = new QVBoxLayout();
    QHBoxLayout* hLayout = new QHBoxLayout();
    preBtn.setText("Pre Page");
    preBtn.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
    preBtn.setMinimumSize(160, 30);//按钮设置
    nextBtn.setText("Next Page");
    nextBtn.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
    nextBtn.setMinimumSize(160, 30);
    connect(&preBtn, SIGNAL(clicked()), this, SLOT(onPreBtnClicked()));
    connect(&nextBtn, SIGNAL(clicked()), this, SLOT(onNextBtnClicked()));
    hLayout->addWidget(&preBtn);
    hLayout->addWidget(&nextBtn);
    sLayout.addWidget(get1stPage());
    sLayout.addWidget(get2ndPage());
    sLayout.addWidget(get3rdPage());
    vLayout->addLayout(&sLayout);
    vLayout->addLayout(hLayout);
    setLayout(vLayout);
}


QWidget* Widget::get1stPage()
{
    QWidget* ret = new QWidget();
    QGridLayout* layout = new QGridLayout();
    fLbl1.setText("This");
    fLbl2.setText("is");
    fLbl3.setText("1st");
    fLbl4.setText("page");
    layout->addWidget(&fLbl1, 0, 0);
    layout->addWidget(&fLbl2, 0, 1);
    layout->addWidget(&fLbl3, 1, 0);//设置标签位置
    layout->addWidget(&fLbl4, 1, 1);
    ret->setLayout(layout);
    return ret;
}

QWidget* Widget::get2ndPage()
{
    QWidget* ret = new QWidget();
    QFormLayout* layout = new QFormLayout();
    sLineEdit.setText("This is 2rd page");
    layout->addRow("Hint:", &sLineEdit);
    ret->setLayout(layout);
    return ret;
}

QWidget* Widget::get3rdPage()
{
    QWidget* ret = new QWidget();
    QVBoxLayout* layout = new QVBoxLayout();
    tPushBtn1.setText("This is");
    tPushBtn2.setText("3rd page");
    layout->addWidget(&tPushBtn1);
    layout->addWidget(&tPushBtn2);
    ret->setLayout(layout);
    return ret;
}

void Widget::onPreBtnClicked()
{
    int index = ((sLayout.currentIndex() - 1) + 3) % 3;
    sLayout.setCurrentIndex(index);
}

void Widget::onNextBtnClicked()
{
    int index = (sLayout.currentIndex() + 1) % 3;
    sLayout.setCurrentIndex(index);
}

Widget::~Widget()

}

#include
#include "Widget.h"
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();
    return a.exec();

}

注意事项:任意容器类的组件都可以指定布局管理器,同一个布局管理器中的组件拥有相同的父组件,设置布局管理的同时隐式的指定了父子关系。

26、布局管理器综合实例_第3张图片

组件1和组件2被同一个布局管理器管理,拥有相同的父组件。

小结:布局管理器可以相互嵌套构成复杂用户界面,任意容器组件均可设置 布局管理器,同一个布局管理器中的组件拥有相同父组件。组件间的父子关系是qt中内存管理的重要方式。

你可能感兴趣的:(26、布局管理器综合实例)