本文分别介绍分割窗口类QSplitter、停靠窗口类QDockWidget、堆栈窗体类QStackWidget的使用,并通过实例展示效果。
(本文中的UI均由代码实现,注意添加相应库函数到头文件中)
一、分割窗口类QSplitter
QSplitter用于分割窗口的布局。
例1:三个窗口可以任意切割大小。
#include "widget.h"
#include <QApplication>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QSplitter *splitterMain = new QSplitter(Qt::Horizontal,0);
QTextEdit *textLeft = new QTextEdit(QObject::tr("Left TextEdit"),splitterMain);
textLeft->setAlignment(Qt::AlignCenter);
QSplitter *splitterRight = new QSplitter(Qt::Vertical,splitterMain);
splitterRight->setOpaqueResize(false);
//设置分割条拖动时是否实时更新,默认为true。设为false则在鼠标拖动完成之后才显示新位置的分割条。
//这里设置左右分割条实时更新,上下分割条分割完成后更新。
QTextEdit *textTop = new QTextEdit(QObject::tr("Top TextEdit"),splitterRight);
QTextEdit *textBottom = new QTextEdit(QObject::tr("Bottom TextEdit"),splitterRight);
textTop->setAlignment(Qt::AlignCenter);
textBottom->setAlignment(Qt::AlignCenter);
splitterMain->setStretchFactor(1,1);
//设定控件可伸缩性。第一个参数用于指定设置的控件序号,第二个参数大于0表示可伸缩。
//这里设置编号为1的splitterRight可伸缩,当整个窗口变化时,左侧宽度不变,右侧随大小调整。
splitterMain->setWindowTitle(QObject::tr("Splitter Test"));//设置窗口标题栏
splitterMain->show();
return a.exec();
}
输出
二、停靠窗口类QDockWidget
QDockWidget用于设置窗口的停靠功能。
设置停靠窗口的一般流程:
1、创建一个QDockWidget对象的停靠窗体;
2、设置此停靠窗体的属性,如setFeatures()和setAllowedAreas()两种方法。
例2:窗口1可在主窗口左右停靠,窗口2只能浮动和在右部停靠且不能移动,窗口3可实现各种方式的停靠。
#include "dockwidget.h"
#include "ui_dockwidget.h"
DockWidget::DockWidget(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::DockWidget)
{
ui->setupUi(this);
setWindowTitle(tr("DockWindow"));
QTextEdit *tx = new QTextEdit(this);
//定义一个文本编辑框作为一个主窗口
tx->setText(tr("Main Window"));
tx->setAlignment(Qt::AlignCenter);
setCentralWidget(tx);
//设置文本编辑框为主窗口的中央窗体
QDockWidget *dock = new QDockWidget(tr("DockWindow1"),this);
dock->setFeatures(QDockWidget::DockWidgetMovable);
//设置dock属性为可移动
dock->setAllowedAreas(Qt::LeftDockWidgetArea|Qt::RightDockWidgetArea);
//设置可移动范围为左右区域
QTextEdit *tx1 = new QTextEdit();
tx1->setText(tr("Window1"));
dock->setWidget(tx1);
addDockWidget(Qt::RightDockWidgetArea,dock);
dock = new QDockWidget(tr("DockWindow2"),this);
dock->setFeatures(QDockWidget::DockWidgetClosable|QDockWidget::DockWidgetFloatable);
//设置dock属性为可关闭、可浮动
QTextEdit *tx2 = new QTextEdit();
tx2->setText(tr("window2"));
dock->setWidget(tx2);
addDockWidget(Qt::RightDockWidgetArea,dock);
dock = new QDockWidget(tr("DockWindow3"),this);
dock->setFeatures(QDockWidget::AllDockWidgetFeatures);
//设置dock具备全部特性
QTextEdit *tx3 = new QTextEdit();
tx3->setText(tr("Window3"));
dock->setWidget(tx3);
addDockWidget(Qt::RightDockWidgetArea,dock);
}
DockWidget::~DockWidget()
{
delete ui;
}
三、堆栈窗体类QStackedWidget
堆栈窗体常与列表框QListWidget和下拉列表框QComboBox配合使用。
例3:左侧选择不同选项,右侧显示相应的窗体。
stackwidget.cpp
#include "stackwidget.h"
#include "ui_stackwidget.h"
stackWidget::stackWidget(QWidget *parent) :
QDialog(parent),
ui(new Ui::stackWidget)
{
ui->setupUi(this);
setWindowTitle(tr("StackWidget"));
list = new QListWidget(this);
list->insertItem(0,tr("Window1"));
list->insertItem(1,tr("Window2"));
list->insertItem(2,tr("Window3"));
label1 = new QLabel(tr("windowtest1"));
label2 = new QLabel(tr("windowtest2"));
label3 = new QLabel(tr("windowtest3"));
stack = new QStackedWidget(this);
stack->addWidget(label1);
stack->addWidget(label2);
stack->addWidget(label3);
mainLayout = new QHBoxLayout(this);
mainLayout->setMargin(5);
mainLayout->setSpacing(5);
mainLayout->addWidget(list);
mainLayout->addWidget(stack,0,Qt::AlignHCenter);
mainLayout->setStretchFactor(list,1);
mainLayout->setStretchFactor(stack,3);
connect(list,SIGNAL(currentRowChanged(int)),stack,SLOT(setCurrentIndex(int)));
}
stackWidget::~stackWidget()
{
delete ui;
}
stackwidget.h
#ifndef STACKWIDGET_H
#define STACKWIDGET_H
#include <QDialog>
#include <QListWidget>
#include <QStackedWidget>
#include <QLabel>
#include <QHBoxLayout>
namespace Ui {
class stackWidget;
}
class stackWidget : public QDialog
{
Q_OBJECT
public:
explicit stackWidget(QWidget *parent = 0);
~stackWidget();
private:
Ui::stackWidget *ui;
QStackedWidget *stack;
QListWidget *list;
QLabel *label1;
QLabel *label2;
QLabel *label3;
QHBoxLayout *mainLayout;
};
#endif // STACKWIDGET_H
四、基本布局QLayout
Qt提供了几种基本的布局管理,分别是水平排列布局(QHBoxLayout)、垂直排列布局(QVBoxLayout)、网格排列布局(QGridLayout),他们之间继承关系如下:
layout.h
#ifndef LAYOUT_H
#define LAYOUT_H
#include <QDialog>
#include <QLabel>
#include <QLineEdit>
#include <QComboBox>
#include <QTextEdit>
#include <QGridLayout>
#include <QPushButton>
#include <QFrame>
#include <QTextCodec>
namespace Ui {
class layout;
}
class layout : public QDialog
{
Q_OBJECT
public:
explicit layout(QWidget *parent = 0);
~layout();
private:
Ui::layout *ui;
QLabel *UserNameLabel;
QLabel *NameLabel;
QLabel *SexLabel;
QLabel *DepartmentLabel;
QLabel *AgeLabel;
QLabel *OtherLabel;
QLineEdit *UserNameLineEdit;
QLineEdit *NameLineEdit;
QComboBox *SexComboBox;
QTextEdit *DepartmentTextEdit;
QLineEdit *AgeLineEdit;
QGridLayout *LeftLayout;
//右侧
QLabel *HeadLabel; //右上角部分
QLabel *HeadIconLabel;
QPushButton *UpdateHeadBtn;
QHBoxLayout *TopRightLayout;
QLabel *IntroductionLabel;
QTextEdit *IntroductionTextEdit;
QVBoxLayout *RightLayout;
//底部
QPushButton *OkBtn;
QPushButton *CancelBtn;
QHBoxLayout *ButtomLayout;
};
#endif // LAYOUT_H
layout.cpp
#include "layout.h"
#include "ui_layout.h"
layout::layout(QWidget *parent) :
QDialog(parent),
ui(new Ui::layout)
{
ui->setupUi(this);
setWindowTitle(tr("UserInfo"));
/************** 左侧 ******************************/
UserNameLabel =new QLabel(tr("user:"));
UserNameLineEdit =new QLineEdit;
NameLabel = new QLabel(tr("name:"));
NameLineEdit = new QLineEdit;
SexLabel = new QLabel(tr("sex:"));
SexComboBox = new QComboBox;
SexComboBox->addItem(tr("female"));
SexComboBox->addItem(tr("male"));
DepartmentLabel = new QLabel(tr("department"));
DepartmentTextEdit = new QTextEdit;
AgeLabel = new QLabel(tr("age"));
AgeLineEdit = new QLineEdit;
OtherLabel = new QLabel(tr("mark:"));
OtherLabel->setFrameStyle(QFrame::Panel|QFrame::Sunken);
LeftLayout =new QGridLayout();
LeftLayout->addWidget(UserNameLabel,0,0); //用户名
LeftLayout->addWidget(UserNameLineEdit,0,1);
LeftLayout->addWidget(NameLabel,1,0); //姓名
LeftLayout->addWidget(NameLineEdit,1,1);
LeftLayout->addWidget(SexLabel,2,0); //性别
LeftLayout->addWidget(SexComboBox,2,1);
LeftLayout->addWidget(DepartmentLabel,3,0); //部门
LeftLayout->addWidget(DepartmentTextEdit,3,1);
LeftLayout->addWidget(AgeLabel,4,0); //年龄
LeftLayout->addWidget(AgeLineEdit,4,1);
LeftLayout->addWidget(OtherLabel,5,0,1,2); //其他
LeftLayout->setColumnStretch(0,1);
LeftLayout->setColumnStretch(1,3);
/*********右侧*********/
HeadLabel = new QLabel(tr("picture")); //右上角部分
HeadIconLabel = new QLabel;
QPixmap icon("312.png");
HeadIconLabel->setPixmap(icon);
HeadIconLabel->resize(icon.width(),icon.height());
UpdateHeadBtn = new QPushButton(tr("update"));
TopRightLayout = new QHBoxLayout();
TopRightLayout->setSpacing(20);
TopRightLayout->addWidget(HeadLabel);
TopRightLayout->addWidget(HeadIconLabel);
TopRightLayout->addWidget(UpdateHeadBtn);
IntroductionLabel = new QLabel(tr("description")); //右下角部分
IntroductionTextEdit = new QTextEdit;
RightLayout = new QVBoxLayout();
RightLayout->setMargin(10);
RightLayout->addLayout(TopRightLayout);
RightLayout->addWidget(IntroductionLabel);
RightLayout->addWidget(IntroductionTextEdit);
/*--------------------- 底部 --------------------*/
OkBtn = new QPushButton(tr("Ok"));
CancelBtn = new QPushButton(tr("Cancel"));
ButtomLayout = new QHBoxLayout();
ButtomLayout->addStretch();
ButtomLayout->addWidget(OkBtn);
ButtomLayout->addWidget(CancelBtn);
/*---------------------------------------------*/
QGridLayout *mainLayout = new QGridLayout(this);
mainLayout->setMargin(15);
mainLayout->setSpacing(10);
mainLayout->addLayout(LeftLayout,0,0);
mainLayout->addLayout(RightLayout,0,1);
mainLayout->addLayout(ButtomLayout,1,0,1,2);
mainLayout->setSizeConstraint(QLayout::SetFixedSize);
}
layout::~layout()
{
delete ui;
}