QT学习笔记12布局管理器

所谓 GUI 界面，归根结底，就是一堆组件的叠加。我们创建一个窗口，把按钮放上面，把图标放上面，这样就成了一个界面。在放置时，组件的位置尤其重要。我们必须要指定组件放在哪里，以便窗口能够按照我们需要的方式进行渲染。这就涉及到组件定位的机制。

Qt 提供了两种组件定位机制：绝对定位和布局定位。

绝对定位就是一种最原始的定位方法：给出这个组件的坐标和长宽值。
这样，Qt 就知道该把组件放在哪里以及如何设置组件的大小。但是这样做带来的一个问题是，如果用户改变了窗口大小，比如点击最大化按钮或者使用鼠标拖动窗口边缘，采用绝对定位的组件是不会有任何响应的。这也很自然，因为你并没有告诉 Qt，在窗口变化时，组件是否要更新自己以及如何更新。或者，还有更简单的方法：禁止用户改变窗口大小。但这总不是长远之计。

布局定位：你只要把组件放入某一种布局，布局由专门的布局管理器进行管理。当需要调整大小或者位置的时候，Qt 使用对应的布局管理器进行调整。

布局定位完美的解决了使用绝对定位的缺陷。

Qt 提供的布局中以下三种是我们最常用的：

QHBoxLayout：按照水平方向从左到右布局；

QVBoxLayout：按照竖直方向从上到下布局；

QGridLayout：在一个网格中进行布局，类似于 HTML 的 table；

1 水平/垂直/网格布局

下面我们通过一个例子来学习以下水平布局管理器的使用方法：

int main(int argc, char *argv[])
{
QApplication app(argc, argv);
 
QWidget window;
window.setWindowTitle("Enter your age");
 
QSpinBox *spinBox = new QSpinBox(&window);
QSlider *slider = new QSlider(Qt::Horizontal, &window);
spinBox->setRange(0, 130);
slider->setRange(0, 130);
 
QObject::connect(slider, &QSlider::valueChanged,

spinBox, &QSpinBox::setValue);
void (QSpinBox:: *spinBoxSignal)(int) = &QSpinBox::valueChanged;
QObject::connect(spinBox, spinBoxSignal,

slider, &QSlider::setValue);
spinBox->setValue(35);
 
     //给控件设置布局
QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(spinBox);
layout->addWidget(slider);
window.setLayout(layout);
 
window.show();
return app.exec();
}
我们在这段代码中引入了两个新的组件：QSpinBox和QSlider。QSpinBox就是只能输入数字的输入框，并且带有上下箭头的步进按钮。QSlider则是带有滑块的滑竿。



上面的代码中window.setLayout(layout);
是将布局设置到窗口window中，在窗口中设置布局还有另一种写法：

//给控件设置布局
QHBoxLayout *layout = new QHBoxLayout（window）;
layout->addWidget(spinBox);
layout->addWidget(slider);
在创建布局对象的时候给新对象指定父窗口，就等于给传入的窗口设置了布局。

另外布局与布局之间是可以嵌套使用的，使用addLayout（）方法。QVBoxLayout的使用方法与QHBoxLayout完全相同。

 

关于上述代码中信号和槽连接的解释：

当数字输入框显示的内容发生改变的时候，会发出一股信息，滑块会接收这一信号，并作出改变。如果二者的信号槽连接写成下边这样：

QObject::connect(spinBox, &QSpinBox::valueChanged,

slider, &QSlider::setValue);
编译器却会报错

no matching function for call to 'QObject::connect(QSpinBox*&, <unresolved overloaded function type>, QSlider*&, void (QAbstractSlider::*)(int))'
这是怎么回事呢？从出错信息可以看出，编译器认为QSpinBox::valueChanged是一个 overloaded 的函数。我们看一下QSpinBox的文档发现，QSpinBox的确有两个信号：

void valueChanged(int)

void valueChanged(const QString &)

当我们使用&QSpinBox::valueChanged取函数指针时，编译器不知道应该取哪一个函数（记住前面我们介绍过的，signal 也是一个普通的函数。）的地址，因此报错。解决的方法很简单，编译器不是不能确定哪一个函数吗？那么我们就显式指定一个函数。方法就是，我们创建一个函数指针，这个函数指针参数指定为 int：

void (QSpinBox:: *spinBoxSignal)(int) = &QSpinBox::valueChanged;
然后我们将这个函数指针作为 signal，与 QSlider 的函数连接：

QObject::connect(spinBox, spinBoxSignal,

slider, &QSlider::setValue);
这样便避免了编译错误。

动手

通过布局管理器搭建如下登陆界面：

2 自定义控件

在搭建Qt窗口界面的时候，在一个项目中很多窗口，或者是窗口中的某个模块会被经常性的重复使用。一般遇到这种情况我们都会将这个窗口或者模块拿出来做成一个独立的窗口类，以备以后重复使用。

在使用Qt的ui文件搭建界面的时候，工具栏栏中只为我们提供了标准的窗口控件，如果我们想使用自定义控件怎么办？

例如：我们从QWidget派生出一个类SmallWidget，实现了一个自定窗口，

// smallwidget.h
class SmallWidget : public QWidget
{
Q_OBJECT
public:
explicit SmallWidget(QWidget *parent = 0);
 
signals:
 
public slots:
private:
QSpinBox* spin;
QSlider* slider;
};
 
// smallwidget.cpp
SmallWidget::SmallWidget(QWidget *parent) : QWidget(parent)
{
spin = new QSpinBox(this);
slider = new QSlider(Qt::Horizontal, this);
 
// 创建布局对象
QHBoxLayout* layout = new QHBoxLayout;
// 将控件添加到布局中
layout->addWidget(spin);
layout->addWidget(slider);
// 将布局设置到窗口中
setLayout(layout);
 
// 添加消息响应
connect(spin,

static_cast<void (QSpinBox::*)(int)>(&QSpinBox::valueChanged),
slider, &QSlider::setValue);
connect(slider, &QSlider::valueChanged,

spin, &QSpinBox::setValue);
}



那么这个SmallWidget可以作为独立的窗口显示,也可以作为一个控件来使用：

打开Qt的.ui文件,因为SmallWidget是派生自Qwidget类,所以需要在ui文件中先放入一个QWidget控件, 然后再上边鼠标右键



弹出提升窗口部件对话框



添加要提升的类的名字,然后选择 添加



添加之后,类名会显示到上边的列表框中,然后单击提升按钮,完成操作.

我们可以看到, 这个窗口对应的类从原来的QWidget变成了SmallWidget



再次运行程序,这个widget_3中就能显示出我们自定义的窗口了.