qt 布局学习笔记

qt下载地址：

[widget 宽高](#widget 宽高)

管理信息列表源码

c++版：

pro文件：

[qt 设置水平布局，里面有两个按钮，每个按钮就变的很宽，怎么设置按钮的精确位置](#qt 设置水平布局，里面有两个按钮，每个按钮就变的很宽，怎么设置按钮的精确位置)

设置固定大小：

使用弹性空间（Spacer）

使用布局比例：

[qt c++ 加载ui文件：](#qt c++ 加载ui文件：)

[方法1: 使用Qt Designer UI文件直接加载](#方法1: 使用Qt Designer UI文件直接加载)

[方法2: 将UI文件转换为C++代码](#方法2: 将UI文件转换为C++代码)

qt下载地址：

Download Qt: Install and get started

管理信息列表源码

python 复制代码

import sys
from PyQt5.QtWidgets import QApplication, QMainWindow, QListWidget, QListWidgetItem, QLabel, QWidget, QVBoxLayout, QHBoxLayout
from PyQt5.QtGui import QPixmap
from PyQt5.QtCore import QSize

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("Student Information List")
        self.setGeometry(100, 100, 450, 400)

        self.listWidget = QListWidget(self)
        self.setCentralWidget(self.listWidget)

        # 示例数据
        students = [
            {"name": "John Doe", "id": "123456789", "gender": "Male", "age": "20", "height": "180cm", "avatar": "res/drawable/head.png"},
            {"name": "Jane Smith", "id": "987654321", "gender": "Female", "age": "22", "height": "170cm", "avatar": "res/drawable/head.png"},
            {"name": "aaaa", "id": "fsadf", "gender": "sfd", "age": "sdf", "height": "170cm", "avatar": "res/drawable/head.png"},
            # 添加更多学生数据
        ]

        for student in students:
            self.add_student(student)

    def add_student(self, student):
        # 创建一个自定义的QWidget
        widget = QWidget()
        hbox = QHBoxLayout()
        hbox.setContentsMargins(10, 0, 10, 0)
        hbox.setSpacing(5);
        # 头像
        label_avatar = QLabel()
        pixmap = QPixmap(student["avatar"]).scaled(75, 82)  # 假设头像图片的路径正确
        label_avatar.setPixmap(pixmap)

        label_avatar.setFixedSize(80, 90)

        hbox.addWidget(label_avatar)

        # 其他信息
        info_widget = QWidget()
        vbox = QVBoxLayout()

        # 第一行信息：名字和身份证号
        label_name_id = QLabel(f"姓名：{student['name']} 性别：{student['gender']}, {student['id']}")

        label_name_id.setFixedSize(300, 20)

        vbox.addWidget(label_name_id)

        # 第二行信息：性别，年龄，身高
        label_details = QLabel(f"类型：{student['age']}  单位：{student['age']} years old, {student['height']}")

        label_details.setFixedSize(300, 20)
        vbox.addWidget(label_details)

        # 第二行信息：性别，年龄，身高
        label_details = QLabel(f"职务：{student['age']}  证件号：{student['age']} years old, {student['height']}")

        label_details.setFixedSize(300, 20)
        vbox.addWidget(label_details)

        vbox.setContentsMargins(10, 10, 10, 10)
        vbox.setSpacing(5);
        info_widget.setLayout(vbox)
        hbox.addWidget(info_widget)
        widget.setLayout(hbox)

        # 将自定义widget加入到QListWidgetItem中
        item = QListWidgetItem()
        item.setSizeHint(widget.sizeHint())  # 必须设置sizeHint
        self.listWidget.addItem(item)
        self.listWidget.setItemWidget(item, widget)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    window.show()
    sys.exit(app.exec_())

c++版：

main.cpp

cpp 复制代码

#include <QApplication>
#include <QMainWindow>
#include <QListWidget>
#include <QListWidgetItem>
#include <QWidget>
#include <QHBoxLayout>
#include <QVBoxLayout>
#include <QLabel>
#include <QPixmap>

// 示例数据
struct Student {
    QString name;
    QString id;
    QString gender;
    QString age;
    QString height;
    QString avatar;
};

class MainWindow : public QMainWindow {
public:
    MainWindow(QWidget *parent = nullptr) : QMainWindow(parent) {
        setWindowTitle("Student Information List");
        setGeometry(100, 100, 450, 400);

        auto listWidget = new QListWidget(this);
        setCentralWidget(listWidget);



        QVector<Student> students = {
            {"John Doe", "123456789", "Male", "20", "180cm", "111.jpg"},
            {"Jane Smith", "987654321", "Female", "22", "170cm", "111.jpg"},
            {"aaaa", "fsadf", "sfd", "sdf", "170cm", "111.jpg"}
            // 添加更多学生数据
        };

        for (auto &student : students) {
            addStudent(student, listWidget);
        }
    }

    void addStudent(const Student &student, QListWidget *listWidget) {
        auto widget = new QWidget();
        auto hbox = new QHBoxLayout(widget);
        hbox->setContentsMargins(10, 0, 10, 0);
        hbox->setSpacing(5);

        // 头像
        auto labelAvatar = new QLabel();
        QPixmap pixmap(student.avatar);
        labelAvatar->setPixmap(pixmap.scaled(75, 82));
        labelAvatar->setFixedSize(80, 90);
        hbox->addWidget(labelAvatar);

        // 其他信息
        auto infoWidget = new QWidget();
        auto vbox = new QVBoxLayout(infoWidget);

        // 第一行信息：名字和身份证号
        auto labelNameId = new QLabel(QString("姓名：%1 性别：%2, %3").arg(student.name, student.gender, student.id));
        labelNameId->setFixedSize(300, 20);
        vbox->addWidget(labelNameId);

        // 第二行信息：年龄，身高
        auto labelDetails = new QLabel(QString("年龄：%1 years old, 身高：%2").arg(student.age, student.height));
        labelDetails->setFixedSize(300, 20);
        vbox->addWidget(labelDetails);

        vbox->setContentsMargins(10, 10, 10, 10);
        vbox->setSpacing(5);
        hbox->addWidget(infoWidget);

        auto item = new QListWidgetItem();
        item->setSizeHint(widget->sizeHint());
        listWidget->addItem(item);
        listWidget->setItemWidget(item, widget);
    }
};

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);
    MainWindow window;
    window.show();
    return app.exec();
}

pro文件：

bash 复制代码

QT       += core gui
QT += core gui widgets
greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

CONFIG += c++11

# The following define makes your compiler emit warnings if you use
# any Qt feature that has been marked deprecated (the exact warnings
# depend on your compiler). Please consult the documentation of the
# deprecated API in order to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

# You can also make your code fail to compile if it uses deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0

SOURCES += \
    main.cpp

HEADERS += \
    mainwindow.h

FORMS += \
    mainwindow.ui

# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

qt 设置水平布局，里面有两个按钮，每个按钮就变的很宽，怎么设置按钮的精确位置

设置固定大小：

可以为按钮设置固定的宽度和高度，这样按钮就不会根据布局自动调整大小了。

cpp 复制代码

QPushButton *button1 = new QPushButton("Button 1");
QPushButton *button2 = new QPushButton("Button 2");

button1->setFixedSize(100, 30); // 设置按钮的固定大小
button2->setFixedSize(100, 30);

QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(button1);
layout->addWidget(button2);

使用弹性空间（Spacer）

：你可以在按钮之间或按钮周围添加空间，这样可以更精确地控制按钮的位置。

cpp 复制代码

QPushButton *button1 = new QPushButton("Button 1");
QPushButton *button2 = new QPushButton("Button 2");

QHBoxLayout *layout = new QHBoxLayout;
layout->addStretch(1); // 在布局开始处添加弹性空间
layout->addWidget(button1);
layout->addStretch(1); // 在两个按钮之间添加弹性空间
layout->addWidget(button2);
layout->addStretch(1); // 在布局结束处添加弹性空间

使用布局比例：

使用 QSizePolicy 来设置控件的大小策略，允许更细致的控制。

cpp 复制代码

QPushButton *button1 = new QPushButton("Button 1");
QPushButton *button2 = new QPushButton("Button 2");

button1->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);
button2->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);

QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(button1, 1);
layout->addWidget(button2, 1);

qt c++ 加载ui文件：

方法1: 使用Qt Designer UI文件直接加载

在这种方法中，你可以使用QUiLoader类来动态加载UI文件。这种方式的优点是你可以在不重新编译程序的情况下更改UI设计，但缺点是可能会增加程序的启动时间和复杂性。

包括必要的头文件：

复制代码

#include <QUiLoader> 
#include <QFile> 
#include <QWidget>

加载.ui文件：你可以创建一个函数来加载UI文件，并返回一个指向加载的界面的指针。

cpp 复制代码

QWidget* loadUiFile(QWidget* parent)
{
    QFile file(":/path/to/your.ui");
    file.open(QFile::ReadOnly);

    QUiLoader loader;
    QWidget* formWidget = loader.load(&file, parent);
    file.close();

    return formWidget;
}

在主窗口中使用加载的UI：

cpp 复制代码

#include <QApplication>
#include <QVBoxLayout>

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;

    QWidget* myForm = loadUiFile(&window);

    QVBoxLayout* layout = new QVBoxLayout;
    layout->addWidget(myForm);
    window.setLayout(layout);

    window.show();
    return app.exec();
}

方法2: 将UI文件转换为C++代码

Qt提供了一个名为uic的工具，它可以将UI文件转换为C++类。这种方法的优点是执行效率更高，因为UI直接编译到程序中，但缺点是每次UI改变都需要重新编译。

在.pro文件中添加UI文件：将UI文件添加到Qt项目文件中以自动调用uic工具。
复制代码
```
FORMS += mainwindow.ui
```
使用转换后的类 ： uic工具会生成一个头文件，通常命名为ui_<filename>.h，你可以在你的C++类中包含这个文件，并使用其中的类。

cpp 复制代码

#include "ui_mainwindow.h"

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr)
    {
        ui.setupUi(this);
    }

private:
    Ui::MainWindow ui;
};

在主函数中创建和显示窗口：

cpp 复制代码

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    MainWindow mainWindow;
    mainWindow.show();
    return app.exec();
}

这两种方法可以根据不同的开发需求选择使用。如果需要灵活性和频繁的UI更改，推荐使用方法1；如果追求性能和稳定性，推荐使用方法2。