目錄
一、環境與目標
二、實現邏輯(純代碼)與效果
三、參考代碼
四、總結
一、環境與目標
qt版本:5.12.7
windows 11 下的?Qt Designer (已搭建)
目標:使用嵌套布局的方式將兩個按鈕顯示在窗口右上角,使兩個按鈕直接無間距且與窗口右邊距為零。
二、實現邏輯(純代碼)與效果
1.創建新工程并在主窗口創建中心部件
2.在中心部件運用垂直布局
3.對兩個按鈕使用水平布局并通過拉伸項將按鈕推到最右側,同時設置按鈕間距及布局邊距。
4.將水平布局加入到垂直布局中并設置為右對齊
5.在垂直布局添加完水平布局后再添加拉伸項使按鈕被置于頂部
6.模擬效果如下:
三、參考代碼
mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H#include <QMainWindow>
#include <QDebug>
#include <QPushButton>
#include <QHBoxLayout>
#include <QVBoxLayout>QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACEclass MainWindow : public QMainWindow
{Q_OBJECTpublic:MainWindow(QWidget *parent = nullptr);~MainWindow();private:Ui::MainWindow *ui;QWidget *btn_ctl_Widget;QPushButton *set_btn;QPushButton *wifi_btn;QHBoxLayout *btn_hlayout; //水平布局QVBoxLayout *btn_vlayout; //垂直布局};
#endif // MAINWINDOW_H
mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{ui->setupUi(this);// 設置窗口大小resize(800, 1280); // 寬度為800像素,高度為1280像素btn_ctl_Widget = new QWidget(this); // 創建中心部件this->setCentralWidget(btn_ctl_Widget); // 設置為中心部件// 創建垂直布局btn_vlayout = new QVBoxLayout(btn_ctl_Widget);//創建按鈕,并設置按鈕樣式set_btn=new QPushButton("set");set_btn->setFixedSize(50, 50);wifi_btn=new QPushButton("wifi");wifi_btn->setFixedSize(50, 50);// 創建水平布局并將按鈕添加到其中btn_hlayout = new QHBoxLayout();// 在按鈕之前添加一個拉伸項,這樣按鈕就會被推到布局的右側btn_hlayout->addStretch(1);btn_hlayout->addWidget(set_btn);btn_hlayout->addWidget(wifi_btn);// 設置水平布局內按鈕之間的間距為0btn_hlayout->setSpacing(0);btn_hlayout->setContentsMargins(0, 0, 0, 0); // 設置布局邊距為0// 在垂直布局的末尾添加拉伸因子,并將水平布局添加到垂直布局中btn_vlayout->addLayout(btn_hlayout,Qt::AlignRight); // 將水平布局設置為右對齊btn_vlayout->addStretch(1); // 添加拉伸因子,使按鈕位于頂部}MainWindow::~MainWindow()
{delete ui;
}
四、總結
學習與使用qt的布局功能,在邊學邊用的過程中簡單的做個記錄,防止自己忘記。