首页 > 技术文章 > QT 添加带有滚动条的窗口,并使之滚动起来

leocc325 2021-07-20 15:33 原文

QT  ui designer中提供了一个叫做QScrollBar的控件,但这导致了人们的一个误区,就是必须要使用这个控件,才能使窗口滚动起来

虽然可以通过这个控件来达到目的,但是需要自己去绑定和窗口滚动的一些信号和槽函数,非常麻烦。

因此,我们通常选择另一种方案来实现窗口滚动:QScrollArea控件。

这个控件自带了滚动条,我们只需要在使用前设置好这个控件的一些参数即可。

 

这个控件自带了一个子控件:QWidget:scrollAreaWidget。 我们需要对这个控件的一些参数进行设置。

要想看到滚动条的一个必要条件就是scrollAreaWidget的尺寸大于scrollArea。

 

 

 

 

 这里我们可以看到,两个控件尺寸都相同,此时运行程序,是不会看到右边有垂直滚动条的

 

 

 我们修改scrollAreaWidget的尺寸高度为1000

 

 

 再次运行程序

 

 

 结果还是没有垂直滚动条,这是什么原因呢? 

因为QScrollArea在Qt designer中有一个属性:WidgetResizable。 它的默认属性为true(勾选),false(未勾选)

我们需要取消这个钩,将其属性设置为false,之后再次运行程序

 

 

 这是就可以看到右边出现了滚动条,此时出现的滚动条已经可以通过鼠标滚轮,鼠标左键拖拽,点击来控制显示区域了,都不需要自己去实现什么函数。

和QScrollBar相比,简直不要太方便。

但是,再界面上需要动态添加控件的时候,给scrollAreaWidget设置一个固定的尺寸就不合适了,因为当控件的坐标超出scrollAreaWidget的尺寸时,依然无法显示

此时,就需要在动态生成控件的时候添加一个判断,判断控件的位置+尺寸是否超出了scrollAreaWidget的显示范围,如果超出,则需要使用函数

ui->scrollAreaWidget->setGeometry(0, 0, 340, ui->scrollAreaWidget->height()+30);

动态的设置scrollAreaWidget的尺寸大小,这样就能保证无论生成多少动态控件,始终都在scrollAreaWidget范围内,而且可以通过滚动条滚动来显示不同区域的控件

 

补充使用代码添加滚动区域的方法

首先在界面上随便放置一个容器,我们这里放置了一个groupbox

 

然后在头文件中添加如下代码

    QHBoxLayout *layout;
    QScrollArea *scrollarea;
    QWidget *scrollareacontent;

然后在构造函数中添加如下代码

Widget::Widget(QWidget *parent) :QWidget(parent),ui(new Ui::Widget)
{
    ui->setupUi(this);

    scrollarea = new QScrollArea(ui->groupBox);
    scrollarea->setWidgetResizable(true);
    scrollarea->setGeometry(0,0,ui->groupBox->width(),ui->groupBox->height());

    layout = new QHBoxLayout(ui->groupBox);
    scrollareacontent = new QWidget(ui->groupBox);

    scrollareacontent->setLayout(layout);
    scrollarea->setWidget(scrollareacontent);
}

注意,这里设置的父对象是ui->groupbox,就是我们前面添加在主界面上的groupbox控件

然后添加按钮槽函数,实现点击一个按钮就在groupbox中添加一个新按钮的功能,准确的说,应该是在scrollareacontent中添加新的按钮

void Widget::on_pushButton_clicked()
{
    QPushButton *btn = new QPushButton(scrollareacontent);
    btn->setMinimumSize(btn->size());
    layout->addWidget(btn);
}

新建按钮的时候,它的父对象是scrollareacontent,如果是别的父对象,滚动条将不会生效。

之后,点击这个按钮就可以生成新的按钮控件,并且自动布局,布局大小超出scrollareacontent之后,会自动出现滚动条。

 参考网址:https://www.cnblogs.com/ybqjymy/p/14592422.html

推荐阅读