设计界面时大概可以分三步：
- 构造出需要的所有控件
- 通过布局管理器确定控件位置
- 通过样式表优化控件样式
1.布局管理器
1. QBoxLayoutQHBoxLayout 水平布局QVBoxLayout 垂直布局1）setStretch 设置部件的拉伸系数2）setSpacing 设置部件之间的距离3）setStretchFactor 设置布局管理器之间的拉伸系数4）addSpacing 添加固定空间到长方体布局末尾5）addStretch 添加可拉伸空间到长方体布局末尾6）setMargin 设置布局管理器与边界的距离2. QGridLayout 栅格布局：将空间划分成若干个行和列，并将子控件放置到划好的小空间中；1）setRowStretch 设置行比例系数2）setColumnStretch 设置列比例系数3）setSpacing 设置部件之间的距离4）addWidget重载版本可设置控件所占行数和列数3. QFormLayout 表格布局：将布局空间分为两列，左边一般放标签，右边放edit之类的部件；1）setLabelAlignment 设置标签对其方式2）addRow 添加表单项3）setRowWrapPolicy 设置标签和文本框的排列方式4. QStackedLayout 栈式布局：将一系列部件排列成堆叠的形式，每次只有顶部的部件可见；
2.样式表
样式表有三种构建方式：
- 在qt designer中设置
- 直接使用setstylesheet函数在工程中设置
- 将样式表写在.qss文件中再加载到工程中设置
QFile qssFile(":/styleSheet.qss"); if(qssFile.open(QFile::ReadOnly)) {QString qss = qssFile.readAll();//qDebug()<<qss;this->setStyleSheet(qss);qssFile.close(); }
使用qt帮助文档搜索qt style sheets可以查看样式表文档：
1.The Style Sheet Syntax:介绍Qt样式表怎么使用（语法）
2.Qt Designer Integration：介绍了如何在设计器中使用Qt样式表
3.CustomizingQt Widgets Using Style Sheets：介绍了部件样式盒模型
4.Qt Style Sheets Reference：样式表属性列表，包括可以使用样式表的空间、属性、属性对应的值、子控件、伪状态
5.Qt Style Sheets Examples：列出了常用部件使用样式表的例子以下就是对qt帮助文档的总结：1. 样式表基本语法为： 选择器::子控件:伪状态 {属性：值} 其中子控件和伪状态不是必须的，例如：QPushButton{color:red}；多个选择器可以指定相同的声明，只需要使用逗号隔开，例如：QPushButton,QLineEdit,QComboBox{color:red}声明部分是一些属性：值对组成的列表，它们包含在大括号中，使用分号隔开。例如：QPushButton{color:red;background-color:white}2. 几种常用选择器1. 通用选择器*：匹配所有的控件，比如： *{color:red}2. 类型选择器： 匹配此类及其子类的实例，比如：QPushButton{color：red}3. 类选择器：匹配此类实例但不匹配其子类实例，比如：.QPushButton{color：red}4. ID选择器：匹配具有特定名字的此类实例，需要提前使用setObjectName函数起名字，例如：QPushButton#okButton{color：red}3. 子控件对一些复杂的部件修改样式，可能需要访问它们的子控件，例如QComboBox的下拉按钮，还有QSpinBox的向上和向下的箭头等。选择符可以包含子控件来对部件的特定子控件应用规则，例如：QComboBox::drop-down{image:url(dropdown.png)}
这样的规则可以改变所有的QComboBox部件的下拉按钮的样式。在Qt Style Sheets Reference关键字对应的帮助文档的List of Stylable Widgets一项中列出了所有
可以使用样式表来自定义样式的Qt部件，在List of Sub-Controls一项中列出了所有可用的子控件。4. 伪状态伪状态出现在选择符之后，用冒号隔离，例如：QPushButton:hover{color:white}这个规则表明当鼠标悬停在一个QPushButton部件上时才被应用。伪状态可以使用感叹号来表示否定，例如要当鼠标没有悬停在一个QRadioButton上时才应用规则，
那么这个规则可以写为：QRadioButton:!hover{color:red}伪状态还可以多个连用，达到逻辑与效果，例如当鼠标悬停在一个被选中的QCheckBox部件上时才应用规则，那么这个规则可以写为：QCheckBox:hover:checked{color:white}在Qt Style Sheets Reference关键字对应的帮助文档的List of Pseudo-States一项中列出了Qt支持的所有的伪状态。5. 解决冲突当多个样式规则用不同的值指定相同的属性时，就会出现冲突。比如以下样式表：QPushButton#okButton { color: gray } QPushButton { color: red }当遇到此类情况时，越具体的才会被应用，所以上面样式表指定名为oKButton的按钮字体为灰色
3.属性列表
1 background 背景 包括：颜色、图片、对其方式
2 border 边框 包括：颜色、图片、边角半径、风格、宽度
3 color 显示的文本的颜色
4 font 文本字体 包括：字体家族（新罗马等）、大小、风格
5 text-align 文本和图标在小部件内容中的对齐方式。
6 text-decoration 附加的文本效果（上划、下划线、删除线）
5 gridline-color QTableView网格线的颜色
6 height 子控件高度 也可设置最大最小高度
7 width 子控件宽度 也可设置最大最小宽度
8 icon-size 部件中图标的宽度和高度
9 margin 框上下左右边缘的长度
10 opacity 部件透明度 0~255->透明~不透明
11 padding 部件填充 上下左右
12 image 在子控件的内容矩形中绘制的图像（比如QLineEdit的内容矩形）
13 image-position 在子控件的内容矩形中绘制的图像的对其位置阿里巴巴矢量图标库 https://www.iconfont.cn/
