• 公开视频 -> 链接点击跳转公开课程
• 博客首页 -> ​​​链接点击跳转博客主页

目录

Qt布局系统(Layouts)

布局管理器基础

高级布局技巧

嵌套布局

设置间距和边距

常用控件详解

按钮类控件

QPushButton (标准按钮)

QRadioButton (单选按钮)

QCheckBox (复选框)

输入类控件

QLineEdit (单行输入)

QTextEdit (多行输入)

QSpinBox (数值输入)

显示类控件

QLabel (标签)

QProgressBar (进度条)

高级视图控件

Model-Based Views

QListView

QTreeView

Item-Based Widgets

QListWidget

QTableWidget

容器控件

QGroupBox

QTabWidget

QScrollArea

样式和外观

样式表

属性设置

---

Qt布局系统(Layouts)

布局管理器基础

Qt提供了强大的布局管理系统，用于自动管理控件的大小和位置。主要布局管理器包括：

1. QHBoxLayout (水平布局)

    QHBoxLayout* hLayout = new QHBoxLayout;hLayout->addWidget(new QPushButton("按钮1"));hLayout->addWidget(new QPushButton("按钮2"));hLayout->addWidget(new QPushButton("按钮3"));this->setLayout(hLayout);

1. QVBoxLayout (垂直布局)

    QVBoxLayout* vLayout = new QVBoxLayout;vLayout->addWidget(new QLabel("标签1"));vLayout->addWidget(new QLabel("标签2"));vLayout->addWidget(new QLabel("标签3"));this->setLayout(vLayout);

1. QGridLayout (网格布局)

    QGridLayout* gridLayout = new QGridLayout;gridLayout->addWidget(new QPushButton("1"), 0, 0);gridLayout->addWidget(new QPushButton("2"), 0, 1);gridLayout->addWidget(new QPushButton("3"), 1, 0, 1, 2); // 跨列this->setLayout(gridLayout);

1. QFormLayout (表单布局)

QFormLayout* formLayout = new QFormLayout;formLayout->addRow("姓名:", new QLineEdit);formLayout->addRow("年龄:", new QSpinBox);formLayout->addRow("简介:", new QTextEdit);this->setLayout(formLayout);

高级布局技巧

嵌套布局

    QVBoxLayout* mainLayout = new QVBoxLayout;QHBoxLayout* topLayout = new QHBoxLayout;topLayout->addWidget(new QPushButton("左"));topLayout->addWidget(new QPushButton("中"));topLayout->addWidget(new QPushButton("右"));mainLayout->addLayout(topLayout);mainLayout->addWidget(new QTextEdit);this->setLayout(mainLayout);

设置间距和边距

layout->setSpacing(10);              // 控件间距  
layout->setContentsMargins(10,10,10,10); // 边距

常用控件详解

按钮类控件

QPushButton (标准按钮)

QPushButton* btn = new QPushButton("点击我");  
btn->setIcon(QIcon(":/icons/click.png"));  

QRadioButton (单选按钮)

  // 创建按钮组QButtonGroup* group = new QButtonGroup(this);// 创建单选按钮QRadioButton* radio1 = new QRadioButton("选项1", this);QRadioButton* radio2 = new QRadioButton("选项2", this);// 将按钮添加到按钮组group->addButton(radio1);group->addButton(radio2);// 创建垂直布局QVBoxLayout* layout = new QVBoxLayout;// 将单选按钮添加到布局中layout->addWidget(radio1);layout->addWidget(radio2);// 设置布局setLayout(layout);

QCheckBox (复选框)

    QCheckBox* check = new QCheckBox("同意条款", this);connect(check, &QCheckBox::stateChanged, this, [](int state){qDebug() << "状态变更:" << state;});

输入类控件

QLineEdit (单行输入)

    QLineEdit* lineEdit = new QLineEdit(this);lineEdit->setPlaceholderText("请输入用户名");lineEdit->setMaxLength(20);

QTextEdit (多行输入)

    QTextEdit* textEdit = new QTextEdit(this);textEdit->setPlaceholderText("请输入描述");textEdit->setAcceptRichText(true);

QSpinBox (数值输入)

    QSpinBox* spinBox = new QSpinBox(this);spinBox->setRange(0, 100);spinBox->setSingleStep(5);spinBox->setValue(50);

显示类控件

QLabel (标签)

    QLabel* label = new QLabel(this);label->setText("Hello <b>Qt</b>");label->setTextFormat(Qt::RichText);

QProgressBar (进度条)

    QProgressBar* progressBar = new QProgressBar(this);progressBar->setRange(0, 100);progressBar->setValue(75);progressBar->setTextVisible(true);

高级视图控件

Model-Based Views

QListView

    QStringListModel* model = new QStringListModel;model->setStringList(QStringList() << "项目1" << "项目2" << "项目3");QListView* listView = new QListView(this);listView->setModel(model);listView->setEditTriggers(QAbstractItemView::NoEditTriggers);

QTreeView

    QStandardItemModel* model = new QStandardItemModel;QStandardItem* parentItem = model->invisibleRootItem();parentItem->appendRow(new QStandardItem("父节点1"));parentItem->child(0)->appendRow(new QStandardItem("子节点1"));QTreeView* treeView = new QTreeView(this);treeView->setModel(model);

Item-Based Widgets

QListWidget

    QListWidget* listWidget = new QListWidget(this);listWidget->addItem("项目1");listWidget->addItem("项目2");listWidget->addItem("项目3");connect(listWidget, &QListWidget::itemClicked, this, [](QListWidgetItem* item){qDebug() << "选中:" << item->text();});

QTableWidget

QTableWidget* tableWidget = new QTableWidget(3, 3, this);tableWidget->setHorizontalHeaderLabels({"列1", "列2", "列3"});tableWidget->setItem(0, 0, new QTableWidgetItem("单元格(0,0)"));

容器控件

QGroupBox

    QGroupBox* groupBox = new QGroupBox("选项组",this);QVBoxLayout* layout = new QVBoxLayout;layout->addWidget(new QRadioButton("选项1"));layout->addWidget(new QRadioButton("选项2"));groupBox->setLayout(layout);

QTabWidget

    QTabWidget* tabWidget = new QTabWidget(this);tabWidget->addTab(new QWidget, "标签1");tabWidget->addTab(new QWidget, "标签2");tabWidget->setTabPosition(QTabWidget::North);

样式和外观

样式表

// 按钮样式  
QString buttonStyle = R"(  QPushButton {  background-color: #4CAF50;  border: none;  color: white;  padding: 8px 16px;  border-radius: 4px;  }  QPushButton:hover {  background-color: #45a049;  }  QPushButton:pressed {  background-color: #3d8b40;  }  
)";  
button->setStyleSheet(buttonStyle);

属性设置

widget->setProperty("class", "primary");  
widget->setMinimumSize(100, 30);  
widget->setFont(QFont("Arial", 12));