Qt应用中的布局管理问题

Question

我有一个应用程序，它在网格中显示一些图像，其余的小部件在各自的位置上显示。就像这样

从this中汲取灵感，我设法解决了在调整大小的同时保持图像的纵横比。

问题是什么：

1. 如果缩小了QLabel小部件(图像小部件)，QMainWindow就会重叠。检查下面的图像

​

1. 整个应用程序显然不适合不同的屏幕。在笔记本电脑上运行这个应用程序，布局就完全混乱了。

我做了什么：

下面是我创建的MVCE代码

//ImageWidget.h

#ifndef IMAGEWIDGET_H
#define IMAGEWIDGET_H

#include <QLabel>
#include <QResizeEvent>
#include <QWidget>

class ImageWidget : public QLabel
{
    Q_OBJECT

public:
    explicit ImageWidget(QWidget* parent = nullptr);
    virtual QSize sizeHint() const;
    QPixmap scaledPixmap() const;
    virtual int widthForHeight(int height) const;

public slots:
    void setPixmap ( const QPixmap& p);
    void resizeEvent(QResizeEvent* ev);

private:
    QPixmap pix;
};

#endif // IMAGEWIDGET_H

ImageWidget.cpp

#include "imagewidget.h"



ImageWidget::ImageWidget(QWidget* parent) :
    QLabel(parent)
{
    setStyleSheet("QLabel{margin-left: 10px; border-radius: 25px; background: white; color: #4A0C46;}");

    QSizePolicy sizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    sizePolicy.setWidthForHeight(true);
    setSizePolicy(sizePolicy);

    setMinimumSize(sizeHint());
}



void ImageWidget::setPixmap (const QPixmap& p)
{
    pix = p;
    QLabel::setPixmap(scaledPixmap());
}




/* virtual */ int ImageWidget::widthForHeight(int height) const
{
    return pix.isNull() ? height * pix.height() / pix.width() : height;
}



QSize ImageWidget::sizeHint() const
{
    if(pix.width() != 0)
    {
        int h = this->height();
        return QSize(widthForHeight(h), h);
    }
    else
    {
        return QSize(300, 300);
    }
}



QPixmap ImageWidget::scaledPixmap() const
{
    auto scaled = pix.scaled(this->size() * devicePixelRatioF(), Qt::KeepAspectRatio, Qt::SmoothTransformation);
    scaled.setDevicePixelRatio(devicePixelRatioF());
    return scaled;
}



void ImageWidget::resizeEvent(QResizeEvent* )
{
    if (!pix.isNull())
    {
        QLabel::setPixmap(scaledPixmap());
    }
}

MainWindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QPushButton>
#include <QTableWidget>
#include "imagewidget.h"

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

protected:

    virtual void resizeEvent(QResizeEvent* event) override;

private:
    Ui::MainWindow *ui;
    ImageWidget* lbl1;
    ImageWidget* lbl2;
    ImageWidget* lbl3;
    ImageWidget* lbl4;

    QPushButton* btn1;
    QPushButton* btn2;
    QPushButton* btn3;
    QPushButton* btn4;

    QTableWidget* tableWidget;

};

#endif // MAINWINDOW_H

MainWindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QVBoxLayout>
#include <QTabWidget>
#include <QGridLayout>
#include <QHBoxLayout>
#include <QLabel>
#include <QTabBar>



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

    QVBoxLayout* mainLayout = new QVBoxLayout;
    QVBoxLayout* tabLay = new QVBoxLayout;
    QHBoxLayout* buttonLay = new QHBoxLayout;
    QGridLayout* gridLay = new QGridLayout;
    QHBoxLayout* dockLay = new QHBoxLayout;

    btn1 = new QPushButton(this);
    btn1->setText("Button1");
    btn2 = new QPushButton(this);
    btn2->setText("Button2");
    btn3 = new QPushButton(this);
    btn3->setText("Button3");
    btn4 = new QPushButton(this);
    btn4->setText("Button4");

    QTabWidget* tabView = new QTabWidget(this);
    tabView->addTab(new QWidget(), "Table");
    tabView->setMinimumSize(500, 300);
    tabView->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Expanding);

    tableWidget = new QTableWidget(this);
    tableWidget->setFixedHeight(200);

    lbl1 = new ImageWidget(this);
    lbl2 = new ImageWidget(this);
    lbl3 = new ImageWidget(this);
    lbl4 = new ImageWidget(this);

    QPixmap lbl1Pix("1.png");
    QPixmap lbl2Pix("2.png");
    QPixmap lbl3Pix("3.png");
    QPixmap lbl4Pix("4.png");

    lbl1->setPixmap(lbl1Pix);
    lbl1->show();

    lbl2->setPixmap(lbl2Pix);
    lbl2->show();

    lbl3->setPixmap(lbl3Pix);
    lbl3->show();

    lbl4->setPixmap(lbl4Pix);
    lbl4->show();

    buttonLay->addWidget(btn1);
    buttonLay->addWidget(btn2);
    buttonLay->addWidget(btn3);
    buttonLay->addWidget(btn4);

    tabLay->addWidget(tabView);
    gridLay->addWidget(lbl1, 0, 0);
    gridLay->addWidget(lbl2, 0, 1);
    gridLay->addWidget(lbl3, 1, 0);
    gridLay->addWidget(lbl4, 1, 1);

    dockLay->addLayout(gridLay);
    dockLay->addLayout(tabLay);

    mainLayout->addLayout(dockLay);
    mainLayout->addLayout(buttonLay);
    mainLayout->addWidget(tableWidget);

    centralWidget()->setLayout(mainLayout);

    setMinimumSize(200,200);

    show();
}



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



void MainWindow::resizeEvent(QResizeEvent * /*event*/)
{
    // get label dimensions
    int h = lbl1->height();
    int w = lbl1->widthForHeight(h);

    lbl1->setFixedWidth(w);
    lbl2->setFixedWidth(w);
    lbl3->setFixedWidth(w);
    lbl4->setFixedWidth(w);
}

Main.cpp

#include "mainwindow.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();

    return a.exec();
}

我想要什么：

1. 将最小大小设置为整个应用程序，这样图像维数就不会重叠。
2. 让整个应用程序在任何电脑或笔记本电脑屏幕上工作，具有不同的分辨率。
3. 图像维数应该占据可用的空间，同时保持图像的高宽比，右边的QTabWidget应该有固定的大小。

也许有一个简单的解决方案，但我对Qt布局管理系统有点困惑。

EDIT1:添加了具有重叠小部件的图像

Answer 1

以下是我认为正在发生的事情。当您在这里设置像素映射时：

QLabel::setPixmap(scaledPixmap());

标签将图像的大小设置为最小大小。从那时起，标签上的尺寸就不能再小了。

我在此找到的解决方案是为构造函数中的QLabel设置以下调整大小标志：

QSizePolicy sizePolicy(QSizePolicy::Ignored, QSizePolicy::Ignored);
setSizePolicy(sizePolicy);

这样，QLabel在任何时候都可以调整大小。或者你可能需要调整最小宽度。

我不知道这是否真的是这样，但也许这是一个好的开始。告诉我你是怎么想的。