Sachez que la fenêtre Qwidget remplit toute la fenêtre principale et zoome automatiquement avec le glissement de la souris

Sachez que la fenêtre Qwidget remplit toute la fenêtre principale et zoome automatiquement avec le glissement de la souris

Créer une nouvelle fenêtre, je veux mettre un QWidget sur cette fenêtre, et ce QWidget peut couvrir toute la fenêtre, et peut également être zoomé automatiquement avec le glissement de la souris

1. Tout d'abord, permettez-moi de vous présenter une bibliothèque de composants utiles : qt-material-widgets

(1) Adresse open source (basée sur QWidgets)

https://github.com/laserpants/qt-material-widgets

Basé sur Qt Quick (QML), vous pouvez vous référer aux projets open source suivants :

https://github.com/uwerat/qskinny

(2) Préparation du fichier de bibliothèque statique

• Clonez d'abord le code source du projet, puis double-cliquez sur qt-material-widgets.pro pour l'ouvrir avec Qt creator
• Construisez Debug pour générer le chemin du fichier de bibliothèque statique libcomponents.a (build-qt-material-widgets-Desktop_Qt_5_15_2_MinGW_64_bit-Debug\components\debug\libcomponents.a)
• Créez un nouveau dossier sdk/material/staticLib dans votre projet
• Copiez libcomponents.a dans sdk/material/staticLib/libcomponents.a ;
• Copiez le dossier des composants du code source dans sdk/matériel dans son ensemble ; (Remarque : le dossier des composants est le qt-matériel-widgets\components du code source sous clone)

(3) Introduire la bibliothèque dans le projet

• qmake-way.pro

  #MaterialSDK
  LIBS += $$PWD/sdk/material/staticLib/libcomponents.a
  INCLUDEPATH += $$PWD/sdk/material/components
  PRE_TARGETDEPS += $$PWD/sdk/material/staticLib/libcomponents.a
  

• CMake way CmakeLists.txt

  add_library(
      libcomponents 
      STATIC
      IMPORTED
  )
   set_target_properties(
      libcomponents
      PROPERTIES IMPORTED_LOCATION
      ${CMAKE_SOURCE_DIR}/src/SDK/Material/lib/libcomponents.a
  )
  
  target_link_libraries(${PROJECT_NAME} PRIVATE libcomponents)
  
  

2. Introduisez le fichier qss dans main.cpp :

#include "material.h"

#include <QApplication>
#include <QFile>

int main(int argc, char *argv[])
{
    
    
    QApplication app(argc, argv);
    // 引入qss文件
    QFile file(":/style/style.qss");
    if ( file.exists() ) {
    
    
        // 以只读的方式打开
        file.open(QFile::ReadOnly);
        // 以字符串的方式保存读出的结果
        QString styleSheet = QLatin1String(file.readAll());
        // 设置全局样式
        qApp->setStyleSheet(styleSheet);
        // 关闭文件
        file.close();
    }
    // 初始化一个material窗口
    Material material;
    // 显示主窗口
    material.show();
    return app.exec();
}

Le contenu du fichier style.qss est le suivant, ajoutez une couleur de fond à mainWidget pour faciliter l'observation des changements

#mainWidget {
    
    
  background-color: red;
}

3. Créez un nouveau fichier material.h avec le contenu suivant :

#ifndef MATERIAL_H
#define MATERIAL_H

#include <QWidget>
#include <qtmaterialtoggle.h>

QT_BEGIN_NAMESPACE
namespace Ui {
    
     class Material; }
QT_END_NAMESPACE

class Material : public QWidget
{
    
    
    Q_OBJECT

public:
    Material(QWidget *parent = nullptr);
    ~Material();

private:
    Ui::Material *ui;

protected:
    /* 1、将函数声明为virtual的作用是允许这两个函数在派生类中被重写(override)，
     * 因为resizeEvent()和moveEvent()是QWidget类中的虚函数，因此在派生类中也要将其声明为virtual，
     * 这样就可以在派生类中重新定义这两个函数，以实现派生类中对窗口大小改变和窗口移动事件的处理 
     */
    virtual void resizeEvent(QResizeEvent *event);
    virtual void moveEvent(QMoveEvent *event);

private:
    QWidget *mainWidget; // 1、添加mainWidget成员变量


};
#endif // MATERIAL_H

4. Créez un nouveau fichier material.cpp avec le contenu suivant :

#include "material.h"
#include "ui_material.h"

#include <QHBoxLayout>
#include <QLabel>
#include <QPushButton>

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

    // 使用Material-widgets
    QtMaterialToggle *switchToggle = new QtMaterialToggle();
    //switchToggle->setGeometry(50, 50, 164, 96);

    // 1、创建一个mainWidget容器，放到Material窗口上
    mainWidget = new QWidget(this);
    // 设置 objectName 属性，QSS 文件中使用 #objectName 来定位到该控件
    mainWidget->setObjectName("mainWidget");
    // 设置mainWidget的大小策略，就是当窗口大小变化时，mainWidget怎么调整自己的大小，第一个参数是水平方向上的策略，第二个参数是垂直方向上的策略
    mainWidget->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    // 设置mainWidget容器的大小和位置
    mainWidget->setGeometry(0, 0, width(), height());


    // Qt中设置窗体大小的方法
    // 设置它的最大窗口值和最小窗口值，并且使最大值和最小值相等，窗口的最大化按钮将变得不可用
    // mainWidget->setMinimumSize(200, 200);
    // mainWidget->setMaximumSize(200, 200);
    // 后来发现还有一个方法就是 resize，在构造函数中直接调用他设置大小就可以
    //mainWidget->resize( QSize( 1128, 761 ));
  
    // 在mainWidget上创建一个垂直布局，下面的2种方法都可以
    // mainWidget->setLayout(layout);
    QHBoxLayout *layout = new QHBoxLayout(mainWidget);
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");

    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(switchToggle);

    layout->setSpacing(60);  // 设置部件间距为60像素
    // Qt::AlignLeft    水平方向靠左
    // Qt::AlignRight   水平方向靠右
    // Qt::AlignHCenter 水平方向居中
    // Qt::AlignTop     垂直方向靠上
    layout->setAlignment(Qt::AlignCenter);

    //有时候会想让我们的程序窗体固定大小，而该大小是我们在编辑时的大小
    //int width = this->geometry().width();   // 找到该窗体的物理大小
    //int height = this->geometry().height();
    //this->setFixedSize(width,height);       //设置窗体固定大小

    // 设置窗口的大小，微信PC应用是1138x761
    // 设置它的最大窗口值和最小窗口值，并且使最大值和最小值相等，窗口的最大化按钮将变得不可用
    // this->setMinimumSize(1128, 761);
    // this->setMaximumSize(1128, 761);
    // 后来发现还有一个方法就是 resize。在构造函数中直接调用他设置大小就可以
    //this->resize( QSize( 1128, 761 ));

    this->setWindowTitle("QWidget布局");
}

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

/* 2、如果要实现widget窗口跟随鼠标拖动并自动跟随窗口缩放，
 * 需要在QWidget类中重写resizeEvent()函数和moveEvent()函数
 */
// 在resizeEvent()函数中，重新设置widget窗口的大小和位置
void Material::resizeEvent(QResizeEvent *event)
{
    
    
    QWidget::resizeEvent(event); // 调用父类的resizeEvent()函数
    if(this->mainWidget) // 判断是否有widget被添加到Material窗口中
    {
    
    
        // 获取Material窗口的大小
        int w = this->width();
        int h = this->height();
        // 设置widget的大小为Material窗口的大小
        this->mainWidget->setGeometry(0, 0, w, h);
    }
}

// 在moveEvent()函数中，重新设置widget窗口的位置
void Material::moveEvent(QMoveEvent *event)
{
    
    
    QWidget::moveEvent(event);
    if(this->mainWidget)
    {
    
    
        this->mainWidget->move(0, 0);
    }
}

5. Affichage des effets

6. Terminer