内容目录
大家如果喜欢，求一键三连，点个关注😭😭😭，小柏谢谢各位大佬了🍗
1. 布局管理
对于一个完善的软件，布局管理却是必不可少的。无论是想要界面中部件有一个很整齐的排列，还是想要界面能适应窗口的大小变化，都要进行布局管理。Qt中主要提供了QLayout类及其子类来作为布局管理器，它们可以实现常用的布局管理功能
这个东西就是对窗口上面的控件进行排版，而排版的作用就是好看，所以布局管理的作用就是为了让界面能整洁好看，布局管理有4种，这4种之间是可以嵌套的
1.1 水平布局
1.2 垂直布局
1.3 再窗体布局中布局
1.4 格栅布局
格栅布局实例——切图
将一张完整的图片进行切割，最后放入label控件中
widget.h
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
#include <QGridLayout>
namespace Ui {
class Widget;
}
class Widget : public QWidget
{
Q_OBJECT
public:
explicit Widget(QWidget *parent = 0);
~Widget();
private:
Ui::Widget *ui;
QGridLayout *gridLayout;
};
#endif // WIDGET_H
widget.cpp
#include "widget.h"
#include "ui_widget.h"
#include <QImageReader>
#include <QLabel>
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
gridLayout=new QGridLayout(ui->scrollAreaWidgetContents);//把格栅布局作用控件上
gridLayout->setContentsMargins(0,0,0,0);//设置边距
for(int i=0;i<30;i++)
{
for(int j=0;j<30;j++)
{
QImageReader reader;
reader.setFileName(":/c.bmp");//读取图片
reader.setScaledClipRect(QRect(i*989/30,j*989/30,989/30,989/30));//截取图片
QImage img;
img=reader.read();//图片保存img中
QLabel *l=new QLabel(ui->scrollAreaWidgetContents);
l->setScaledContents(true);
l->setPixmap(QPixmap::fromImage(img));//img转为Pixmap
gridLayout->addWidget(l,i,j);
}
}
}
Widget::~Widget()
{
delete ui;
}
效果展示
2. 样式表
样式表是用来做什么的？
自定义Qt Widgets
使用样式表时，每个小部件都被视为具有四个同心矩形的框：空白矩形、边框矩形、填充矩形和内容矩形。盒子模型对此进行了更详细的描述。
四方同心矩阵👇
2.1 添加内容
添加资源
添加渐变
添加颜色
添加字体
2.2 css语法改变样式(QSS)
css语法改变样式
这里说QSS是因为是在QT所以说是QSS
例：多个重复的pushButton
如果出现很多pushButton按钮，我们都想要改变他们的样式，那我们上面写的css语法是不能够满足单独的
前面加个#，要写对象名，不能写类型名字
#pushbutton{
background-color: rgb(0, 0, 0);
}
2.2.1 pushButton
border:5px groove blue; 边框5px 3d，蓝色
border-radius:10px; 圆角，弧度10px
| none | 定义无边框 |
|---|---|
| hidden | 与 “none” 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。 |
| dotted | 定义点状边框。在大多数浏览器中呈现为实线。 |
| dashed | 定义虚线。在大多数浏览器中呈现为实线。 |
| solid | 定义实线。 |
| double | 定义双线。双线的宽度等于 border-width 的值。 |
| groove | 定义 3D 凹槽边框。其效果取决于 border-color 的值。 |
2.2.2 radioButton
QRadioButton::indicator::unchecked{ //没有被选中时，的选中按钮为图片
image: url(:/png/png/blueStone.png);
width: 50px;
height:50px;
}
QRadioButton::indicator::checked { //选中时
image: url(:/png/png/redStone.png);
}
QRadioButton::indicator:checked:hover { //选中时，并且鼠标在上面
image: url(:/png/png/downloadsfolder.png);
}
2.2.3 progressbar
QProgressBar::chunk { 显示的进度条里面的内容
background-color: #CD96CD;
width: 10px;
margin: 0.5px;
}
QProgressBar { 进度条的边框，及文字
border: 2px solid grey;
border-radius: 5px;
text-align: center;
}
2.2.4 combox
QComboBox { //去掉边框
border:none;
}
QComboBox::drop-down { //下拉的也去掉边框，设置大小，图片
border:none;
image: url(:/png/png/downloadsfolder.png);
width:30;
height:30;
}
2.2.5 lcdnumber
QPalette lcdpat=ui->lcdNumber->palette();
lcdpat.setColor(QPalette::Normal,QPalette::WindowText,Qt::red);//设置字体颜色为
红色
ui->lcdNumber->setPalette(lcdpat);//红色字体
2.3 Qt中的子类控件
3. 贴图（实现自定义视图）
这里不展示项目了，不是很难，主要用的代码就是下面三行👇
this->setWindowFlag(Qt::FramelessWindowHint);//隐藏标题栏
setWindowOpacity(0.4); //窗口透明度
setAttribute(Qt::WA_TranslucentBackground); //是窗口透明，但是上面的空间不透明
欢迎各位大佬批评指正，如果喜欢一键三连，可以关注我，我后续会更新下面的内容
