QT常用控件 - 技术栈

对于QT窗口的开发，QT本身已经为我们内置了许多控件，我们直接就可以拿来用，不过我们需要对这些控件了解清除。
Widget 是 Qt 中的核⼼概念. 英⽂原义是 "⼩部件", 我们此处也把它翻译为 "控件" . 控件是构成⼀个图形化界⾯的基本要素。
按钮, 列表视图, 树形视图, 单⾏输⼊框, 多⾏输⼊框, 滚动条, 下拉框等, 都可以称为 "控件". Qt 作为⼀个成熟的 GUI 开发框架, 内置了⼤量的常⽤控件. 这⼀点在 Qt Designer 中就可以看到端倪。

2. QWidget 核⼼属性

在 Qt 中, 使⽤ QWidget 类表⽰ "控件". 像按钮, 视图, 输⼊框, 滚动条等具体的控件类, 都是继承⾃
QWidget. 可以说, QWidget 中就包含了 Qt 整个控件体系中。
每一个控件都有许多属性，我们可以通过查询文档来了解控件的属性，一般我们在设置对应的属性使用set+属性名，就是对应得方法，这里我们简单的介绍一些属性。

设置组件是否可用

|--------------|-----------------------------------|
| isEnabled() | 获取当前组件状态是否为可用，返回值为bool |
| setEnabled（） | 设置控件是否可使⽤. true 表⽰可⽤, false 表⽰禁⽤. |

获取组件当前位置和尺⼨

其实是四个属性的统称:
• x 横坐标 • y 纵坐标 • width 宽度 • height ⾼度

|--------------|----------------------------------------------------------------------|
| move | 移动部件的位置（x，y） |
| geometry | 位置和尺⼨. 包含 x, y, width, height 四个部分.其中坐标是以左上角为参考进⾏设置的.返回值为一个Qrect对象。 |
| FrameGometry | 与geometry作用一样，不过范围包括窗口标题，窗口栏额外区域 |
| WindowTile | 设置窗口标题 |

对于Qrect对象，对于它的四个坐标进行加减：

加一个正数 x:向右移动 y：向下移动 width：向右延长 height:向下延长

加一个负数 x:向左移动 y：向上移动 width：向左缩小 height:向上缩小

move 移动以左上角为起点为当前给定的坐标。

    int width=ui->pushButton_refuse->width();
    int height=ui->pushButton_refuse->height();
    int x=rand()%width;
    int y=rand()%height;
    ui->pushButton_refuse->move(x,y);
    QRect rect1=ui->pushButton_accept->frameGeometry();//范围包括了window Frame
    QRect rect2=ui->pushButton_accept->geometry();//范围包括了window Frame
    qDebug()<<rect1;
    qDebug()<<rect2;

QWidget的图标

|---------------|---------------------------------|
| WindowIcon | 获取 widget 图标返回QIcon,只针对顶层窗口 |
| setWindowIcon | 设置 widget 图标参数为QIcon对象,只针对顶层窗口 |

对于图片资源等使用，我们在开发中并不能保证用户的路径与我们这里的一致，并且确保用户不会搞没我们的图片，因此QT右提供了一种方法，我们可以在该项目中在引入一个xml文件-后缀为qrc文件，将你使用的资源导入该文件里即可，QT在编译时会自动提取相关数据并编译到程序当中。

不过无法导入资源较大的文件，文件名不要带中文与特殊符号。

qrc的本质是把图片二进制数据提取转为c++代码，之后再编译到exe中，所以我们需要把文件导入qrc文件中：

1.创建前缀profix

2.导入资源 --要求该资源的目录在与qrc的同级目录或者子目录。

 QIcon imag(":/R.jpg");//构建qrc文件进行资源导入
 this->setWindowIcon(imag);
 float opacity=this->windowOpacity();
 qDebug()<<opacity;

组件的透明度设置

|--------------------|----------------------------------------|
| WindowOpacity() | 获取 widget 透明度,取值0.0-1.0，0是完全透明，1是完全不透明 |
| setWindowOpacity() | 设置 widget 透明度,取值0.0-1.0，0是完全透明，1是完全不透明 |

这里注意浮点数使用的是IEE754的标准，二进制表示有效数字，每一位是一个小数（0.5，0.25，0.125，，）最后按照权重相加，由于flaot与double长度有限，因有效数组表示范围有限，最后很难凑出0.1这样的数，因此平时写代码的时候，两个浮点数不能直接==，这样有概率两个数不是相等的，可以做差比较。

在进行模块交互的时候，我们一般获取用双重判定，使得在交互中即使出现了问题，也不会出现较大的问题。集体开发代码编写参考《代码大全》这本书。

QWidget光标的设置

|-----------------------------------------------------------|----------------------------------------------------------------|
| cursor() | ⿏标悬停时显⽰的图标形状. 是普通箭头, 还是沙漏, 还是⼗字等形状在 Qt Designer 界⾯中可以清楚看到可选项. |
| setCursor() | 设置光标形状，只有处于widget时才生效 |
| QGuiApplication::setOverrideCursor(const Cursor& cursor) | 设置全局的光标形状 |

光标的设置，我们既可以手动设置，也可以进行ui设置找到Cursor属性进行设置，使用setShape方法，QT中内置了许多光标形状。

除此之外还可以用多种对象构造光标：

可以使用图像设置光标，除此之外我们还可以去阿里巴巴的iconfont网站寻找你的素材

 QPixmap pixmap(":/basketball.png");//该对象可表示一个照片
 pixmap=pixmap.scaled(20,20);//缩放或者设置大小后重新赋值
 QCursor sor(pixmap,10,10);//默认图片左上角作为实际光标点击，我们还可以设置为10，10

字体的设置

一般用来设置组件的文本文字

|-----------|---------------------------|
| font（） | 获取当前widget的字体信息，返回Qfont对象 |
| setFont() | 设置字体 |

首先创建字体对象，进行属性设置，之后在创建Qpalette对象进行setcolor设置，最后将这两个对象设置到组件中。

  //文本设置，以标签为例
    QLabel * label =new QLabel (this);
    label->move(80,30);
    label->setText("修对故人思故国，且将新火试新茶，诗酒趁年华");
    QFont font;
    font.setFamily("仿宋");//字体
    font.setBold(true);//加粗
    font.setPixelSize(30);//字体大小
    font.setItalic(true);//倾斜
    font.setUnderline(true);//下划线
    label->setFont(font);
    QPalette green;            //设置字体颜色
    green.setColor(QPalette::WindowText,Qt::green);
    label->setPalette(green); // 设置QLabel的颜色

组件提示

|------------------|---------------------------------------------|
| setToolTip | 设置 toolTip. ⿏标悬停在该 widget 上时会有提⽰说明. |
| setToolTipDuring | 设置 toolTip 提⽰的时间. 单位 ms. 时间到后 toolTip ⾃动消失. |

ui->pushButton_accept->setToolTip("按下则女神接受");
ui->pushButton_accept->setToolTipDuration(2000);

设置组件获取到焦点的策略

简单来说：假设有一个文本框，只有选中之后才能输入，此时就是获取该组件的焦点，一般对于键盘输入较为明显。

比如说选中文本框输入，判断是否跳出此页面都是聚焦实现的。

|-------------------------------------------|----------------------------------------------|
| focusPolicy() | 获取该 widget 的 focusPolicy, 返回 Qt::FocusPolicy |
| setFocusPolicy(Qt::FocusPolicy policy ) | 设置 widget 的 focusPolicy |

返回的focusPolicy是一个枚举类型，包括如下：

Qt::FocusPolicy 是⼀个枚举类型. 取值如下
• Qt::NoFocus ：控件不会接收键盘焦点 --键盘无法输入
• Qt::TabFocus ：控件可以通过Tab键接收焦点
• Qt::ClickFocus ：控件在⿏标点击时接收焦点
• Qt::StrongFocus ：控件可以通过Tab键和⿏标点击接收焦点 (默认值)
• Qt::WheelFocus : 类似于 Qt::StrongFocus , 同时控件也通过⿏标滚轮获取到焦点 (新增
的选项, ⼀般很少使⽤).

以LineEdit为例：创建两个文本框，按下table键就会自动跳到下一个文本框，或者使用鼠标点击选中，这都是通过鼠标或者键盘去获取组件的焦点，当然我们也可以修改它这个聚焦类型，如上面的设置TableFcous，就会使得只能使用table键进行选择聚焦。

stylesheet样式表

通过 CSS 设置 widget 的样式.
CSS (Cascading Style Sheets 层叠样式表) 本⾝属于⽹⻚前端技术. 主要就是⽤来描述界⾯的
样式. 所谓 "样式", 包括不限于⼤⼩, 位置, 颜⾊, 间距, 字体, 背景, 边框等.
我们平时看到的丰富多彩的⽹⻚, 就都会⽤到⼤量的 CSS. Qt 虽然是做 GUI 开发, 但实际上和⽹⻚前端有很多异曲同⼯之处. 因此 Qt 也引⼊了对于 CSS的⽀持----- QSS.
我们还是以两种方式来实验：
以ui界面为例：
或者右键有一个改变样式表

样式表内是以键值对的形式进行设置。

我们也可以通过代码的方式进行央视的设置。具体里面可以写的内容设置的样式我们都可以向官方文档。

官网的样式表链接：http://doc.qt.io/archives/qt-4.8/stylesheet.html

各种控件的样式：http://doc.qt.io/archives/qt-4.8/stylesheet-reference.html

QSS语法：http://www.w3school.com.cn/css/css_syntax.asp

这里建议具体内容参考CSS来看

    this->setStyleSheet("background-color:white;");
    ui->lineEdit->setStyleSheet("background-color:green;color:white; ");
    ui->pushButton->setStyleSheet("color:white;");
    ui->pushButton_2->setStyleSheet("color:white;");

当然对于颜色是有无数种的，计算机中使用RGB进行颜色设计，使用一个字节G，一个字节B，一个字节R，255则表示对应颜色拉满，一般我们使用取色器去获取其他颜色的字节表示。

3.常用组件

这些组件都继承子Qwidget.

QPushButton

QPushButton就是一个简单的按钮，也是我们最常用最熟悉的按钮，他是继承了QAbstrcatButton。

|--------------------|-----------------------------------------------------------------------------------------------------------|
| 属性 | 说明 |
| tex | 按钮中的⽂本 |
| icon | 按钮中的图标 |
| iconSize | 按钮中图标的尺⼨ |
| shortCut | 按钮对应的快捷键 |
| autoRepeat | 按钮是否会重复触发. 当⿏标左键按住不放时, 如果设为 true, 则会持续产⽣⿏标点击事件; 如果设为 false, 则必须释放⿏标, 再次按下⿏标时才能产⽣点击事件. (相当于游戏⼿柄上的 "连发" 效果) |
| autoRepeatDelay | 重复触发的延时时间. 按住按钮多久之后, 开始重复触发. |
| autoRepeatInterval | 重复触发的周期. |

//设置按钮图标
    QRect rect=ui->pushButton_godess->geometry();
    ui->pushButton_godess->setGeometry(rect.x(),rect.y(),50,50);
    QIcon icon(QPixmap(":/start.png"));
    ui->pushButton_godess->setIcon(icon);
    ui->pushButton_godess->setIconSize(QSize(50,50));//设置图标的大小
    ui->pushButton_godess->setFlat(true);//设置边框不可见

RadioButton

单选按钮，使我们可以多个选项中选择一个，除了以上相同的属性外，radiobutton存在着与之不同的方法。

|---------------|-------------------------------------------------|
| checkable | 是否能选中 |
| checked | 是否已经被选中. checkable 是 checked 的前提条件. |
| autoExclusive | 选中⼀个按钮之后是否会取消其他按钮的选中. 对于 QRadioButton 来说默认就是排他的 |

多个单选按钮，在选择的时候，默认来说是选择一个的。
可是如果我们在这么多单选按钮中，需求是分为几组，每组中只有一个才可以被选择，如何实现呢?
QT中引入了QButtonGroup，对按钮进行分组。
我们只需与将需要的按钮放到一个组中即可实现按钮分组，此时单选按钮单旋只作用的在一个组中。

 QButtonGroup *group=new QButtonGroup();
 group->addButton(ui->radioButton_test);
 group->addButton(ui->radioButton_test1);

Check Box

Check Box表示复选按钮，一次性可以选择多个和 QCheckBox 最相关的属性也是 checkable 和 checked , 都是继承⾃ QAbstractButton . ⾄于 QCheckBox 独有的属性 tristate ⽤来实现 "三态复选框" ，不过这个东西比较冷门。

用法基本类似，只不过复选按钮没有单选按钮的排他机制了。

QLabel

QLabel是一种显示组件，名叫标签.以下是关于QLabel的属性

|-------------------|-------------------------------------------------------------------------------------------------------------------------|
| text | QLabel 中的⽂本 |
| textFormat | ⽂本的格式. • Qt::PlainText 纯⽂本 • Qt::RichText 富⽂本(⽀持 html 标签) • Qt::MarkdownText markdown 格式 • Qt::AutoText 根据⽂本内容⾃动决定⽂本格式. |
| pixmap | QLabel 内部包含的图⽚. |
| scaledContents | 设为 true 表⽰内容⾃动拉伸填充 QLabel设为 false 则不会⾃动拉伸 |
| alignment | 对⻬⽅式.可以设置⽔平和垂直⽅向如何对⻬. |
| wordWrap | 设为 true 内部的⽂本会⾃动换⾏. 设为 false 则内部⽂本不会⾃动换⾏. |
| indent | 设置⽂本缩进. ⽔平和垂直⽅向都⽣效. |
| margin | 内部⽂本和边框之间的边距. 不同于于 indent, 但是是上下左右四个⽅向都同时有效. ⽽ indent 最多只是两个⽅向有效(具体哪两个⽅向有效取决于 alignment ) |
| openExternalLinks | 是否允许打开⼀个外部的链接. (当 QLabel ⽂本内容包含 url 的时候涉及到) |
| buddy | 给 QLabel 关联⼀个 "伙伴" , 这样点击 QLabel 时就能激活对应的伙伴. 例如伙伴如果是⼀个 QCheckBox, 那么该 QCheckBox 就会被选中. |

对于编写的文本，QT支持textFormat多样式，其中就右通过添加标签的方式（类似HTML）修改文本样式的富文本，还有Markdown文本。

 label->setText("<b>竹杖芒鞋轻胜马，谁怕，一蓑烟雨任平生</b>");//b标签用来加粗

对于标签的图片，我们可以调用方法setscaledcontents（）,可以根据组件的大小，图片自动填充满组件。

在QT中除了信号机制，还有一种机制称为事件，例如在拖拽窗口，修改窗口大小时就会触发事件ReSize，此时我们一般去重写父类中的虚函数来对事件进行处理。

除了以上标签的属性，还有对于标签中文本内容属性的设置：

设置文本对齐方式：

ui->label->setAlignment(Qt::AlignCenter | Qt:: AlignVCenter);//设置内容垂直且水平居中对齐

   ui->label->setWordWrap(true);//设置自动换行
   ui->label->setIndent(50);//设置缩进50个像素
   ui->label->setMargin(20);//设置文本边距;

setbuddy 设置伙伴，将两个无关系的组件关联起来。Lable的快捷键的格式是在文本中使用&+一个键，就可以表示该标签的快捷键，例如，将一个按钮与一个标签关联起来，给标签设置快捷键，点击快捷键（Alt+快捷键），触发按钮选中。标签的快捷键相对于按钮快捷键要弱很多。

LCD Number

QLCDNumer 是⼀个专⻔⽤来显⽰数字的控件.

|-------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| intValue | QLCDNumber 显⽰的数字值(int). |
| value | QLCDNumber 显⽰的数字值(double).和 intValue 是联动的. 例如给 value 设为 1.5, intValue 的值就是 2. 另外, 设置 value 和 intValue 的⽅法名字为 display , ⽽不是 setValue 或者 setIntValue . |
| digitCount | 显⽰⼏位数字. |
| mode | 数字显⽰形式. 1. QLCDNumber::Dec ：⼗进制模式，显⽰常规的⼗进制数字。 2. QLCDNumber::Hex ：⼗六进制模式，以⼗六进制格式显⽰数字。 3. QLCDNumber::Bin ：⼆进制模式，以⼆进制格式显⽰数字。 4. QLCDNumber::Oct ：⼋进制模式，以⼋进制格式显⽰数字。只有⼗进制的时候才能显⽰⼩数点后的内容. |
| segmentStyle | 设置显⽰⻛格. 1. QLCDNumber::Flat ：平⾯的显⽰⻛格，数字呈现在⼀个平坦的表⾯上。 2. QLCDNumber::Outline ：轮廓显⽰⻛格，数字具有清晰的轮廓和阴影效果。 3. QLCDNumber::Filled ：填充显⽰⻛格，数字被填充颜⾊并与背景区分开。 |
| smallDecimalPoint | 设置⽐较⼩的⼩数点. |

其中QT中也提供了计时器对象，方便我们结合这个一起使用。

如果想使用线程的方式使用循环的方式去计时递减，由于主窗口时有主线程维护的，而QT为了保证主窗口的线程安全，因此是不允许其他线程修改界面的。因此只能在主线程里改：

//设置LCDNumber
ui->lcdNumber->display(10);//设置初始值
time=new QTimer(this);//创建timea对象
connect(time,&QTimer::timeout,this,&Widget::handle);
time->start(1000);//参数出发定时器为周期，单位ms
connect(this,Widget::pushButton_music_clicked,this,Widget::on_pushButton_music_clicked);
void Widget::handle()
{
    int num=ui->lcdNumber->intValue();
    if(num<=0)
    {
        this->time->stop();
        emit pushButton_music_clicked();
        return ;
    }
    ui->lcdNumber->display(num-1);
}

QProgessBar

使⽤ QProgressBar 表⽰⼀个进度条.

|------------------|-------------------------------------------------------------------------------------------------------------------------|
| minimum | 进度条最⼩值 |
| maximum | 进度条最⼤值 |
| value | 进度条当前值 |
| alignment | alignment ⽂本在进度条中的对⻬⽅式. • Qt::AlignLeft : 左对⻬ • Qt::AlignRight : 右对⻬ • Qt::AlignCenter : 居中对⻬ • Qt::AlignJustify : 两端对⻬ |
| Qt::AlignJustify | 两端对⻬ |
| textVisible | 进度条的数字是否可⻅. |
| orientation | 进度条的⽅向是⽔平还是垂直 |
| textDirection | ⽂本的朝向. |
| format | 展⽰的数字格式. • %p ：表⽰进度的百分⽐（0-100） • %v ：表⽰进度的数值（0-100） • %m ：表⽰剩余时间（以毫秒为单位） • %t ：表⽰总时间（以毫秒为单位 |

进度条的使用我们一般都会联合QTimer一起使用。基于QTimer的属性对进度条进行更新。

time=new QTimer(this);//创建timea对象
connect(time,&QTimer::timeout,this,&Widget::handle);
time->start(1000);//参数出发定时器为周期，单位ms
void Widget::handle()
{

int val =ui->progressBar->value();
 if(val>=100)
   {
      this->time->stop();
      return ;
   }
    ui->progressBar->setValue(val+10);
}

QProgressBar::chunk {background-color:red;}//修改样式表设置为红色进度条

QCalendarWidget 表⽰⼀个 "⽇历" ,

|------------------------|------------------------|
| selectDate | 当前选中的⽇期 |
| minimumDate | 最⼩⽇期 |
| maximumDate | 最⼤⽇期 |
| firstDayOfWeek | 每周的第⼀天(也就是⽇历的第⼀列) 是周⼏. |
| gridVisible | 是否显⽰表格的边框 |
| selectionMode | 是否允许选择⽇期 |
| navigationBarVisible | ⽇历上⽅标题是否显⽰ |
| horizontalHeaderFormat | ⽇历上⽅标题显⽰的⽇期格式 |
| verticalHeaderFormat | ⽇历第⼀列显⽰的内容格式 |
| dateEditEnabled | 是否允许⽇期被编辑 |

void Widget::on_calendarWidget_selectionChanged()
{
    QDate date=ui->calendarWidget->selectedDate();
    ui->label_date->setText(date.toString());
}

Line Edit

Line Edit就是一个文本框，用户可以去输入。

|--------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------|
| text | 输⼊框中的⽂本 |
| inputMask | 输⼊内容格式约束 |
| maxLength | 最⼤⻓度 |
| frame | 是否添加边框 |
| echoMode | 显⽰⽅式. • QLineEdit::Normal ：这是默认值，⽂本框会显⽰输⼊的⽂本。 • QLineEdit::Password ：在这种模式下，输⼊的字符会被隐藏，通常⽤星号（*）或等号（=）代替。 • QLineEdit::NoEcho ：在这种模式下，⽂本框不会显⽰任何输⼊的字符。 |
| cursorPosition | 光标所在位置 |
| alignment | ⽂字对⻬⽅式, 设置⽔平和垂直⽅向的对⻬. |
| dragEnabled | 是否允许拖拽 |
| readOnly | 是否是只读的(不允许修改) |
| placeHolderText | 当输⼊框内容为空的时候, 显⽰什么样的提⽰信息 |
| clearButtonEnabled | 是否会⾃动显⽰出 "清除按钮 |

 ui->lineEdit_name->setPlaceholderText("请输入名字");
 ui->lineEdit_password->setPlaceholderText("请输入密码");
 ui->lineEdit_password->setEchoMode(QLineEdit::Password);
 ui->lineEdit_name->setClearButtonEnabled(true);
 ui->lineEdit_password->setClearButtonEnabled(true);
 ui->lineEdit_password->setInputMask("000-000-000");//固定格式为000-000-000，0代表舒数字

说到这里的内容格式约束，不得不说到一个语法，正则表达式：

关于正则表达式
正则表达式是⼀种在计算机中常⽤的, 使⽤特殊字符描述⼀个字符串的特征的机制. 在进⾏字
符串匹配时⾮常有⽤. 正则表达式的语法还⽐较复杂, ⼀般都是随⽤随查, 不需要背下来.
参考:
正则表达式⽂档 https://learn.microsoft.com/zh-cn/previous
versions/visualstudio/visual-studio-2008/ae5bf541(v=vs.90)?redirectedfrom=MSDN
正则表达式在线⼯具: https://regextester.buyaocha.com/

//在构造函数中创建正则表达式验证器
QRegularExpression reg("^1\\d{10}$");//例如创建一个验证电话号码的。
//^1表示以1开头，之后\d表示数字（需要多加/防止转义字符），，{10}，表示前面的内容出现十次，$结尾
ui->lineEdit_password->setValidator(new QRegularExpressionValidator(reg));
//通过该对象去检测密码输入的合法性


void Widget::on_lineEdit_password_textEdited(const QString &arg1)//输入内容就会产生信号
{
    QString content=arg1;
    int pos=0;
    //验证是否通过的操作
    if (ui->lineEdit_password->validator()->validate(content,pos)==QValidator::Acceptable)
    {
        //如果通过按钮才可用
        ui->pushButton->setEnabled(false);
    }else
    {
         ui->pushButton->setEnabled(true);
    }
}



void Widget::on_checkBox_show_toggled(bool checked)
{
    if(checked==true)
    {
         ui->lineEdit_password->setEchoMode(QLineEdit::Normal);
    }else
    {
         ui->lineEdit_password->setEchoMode(QLineEdit::Password);
    }
}

QTextEdit

QTextEdit 表⽰多⾏输⼊框. 也是⼀个富⽂本 & markdown 编辑器. 并且能在内容超出编辑框范围时⾃动提供滚动。除了表示文本，还可以使用html和markdown进行渲染。

|-------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| markdown | 输⼊框内持有的内容. ⽀持 markdown 格式. 能够⾃动的对markdown ⽂本进⾏渲染成 html |
| html | 输⼊框内持有的内容. 可以⽀持⼤部分 html 标签. 包括 img 和 table 等 |
| placeHolderText | 输⼊框为空时提⽰的内容. |
| readOnly | 是否是只读的 |
| 是否是只读的 | 是否开启 undo / redo 功能.按下 ctrl + z 触发 undo |
| autoFormating | 开启⾃动格式化. |
| tabstopWidth | 按下缩进占多少空间 |
| overwriteMode | 是否开启覆盖写模式 |
| acceptRichText | 是否接收富⽂本内容 |
| verticalScrollBarPolicy | 垂直⽅向滚动条的出现策略 • Qt::ScrollBarAsNeeded : 根据内容⾃动决定是否需要滚动条。这是默认值。 • Qt::ScrollBarAlwaysOff : 总是关闭滚动条。 • Qt::ScrollBarAlwaysOn : 总是显⽰滚动条。 horizontalScrollBarPolicy ⽔平⽅向滚动条的出现策略 • Qt::ScrollBarAsNeeded : 根据内容⾃动决定是否需要滚动条。这是默认值。 • Qt::ScrollBarAlwaysOff : 总是关闭滚动条。 • Qt::ScrollBarAlwaysOn : 总是显⽰滚动条 |

信号

|-------------------------|-----------------|
| textChanged() | ⽂本内容改变时触发 |
| selectionChanged() | 选中范围改变时触发 |
| cursorPositionChanged() | 光标移动时触发 |
| undoAvailable(bool) | 可以进⾏ undo 操作时触发 |
| 可以进⾏ redo 操作时触发 | 可以进⾏ redo 操作时触发 |
| copyAvaiable(bool) | ⽂本被选中/取消选中时触发 |

QCombo Box

QCombo Box叫做复选框，其实就是下拉框。

|--------------------------|-----------------------------------------------------------------|
| currentText | 当前选中的⽂本 |
| currentIndex | 当前选中的条⽬下标从 0 开始计算. 如果当前没有条⽬被选中, 值为 -1 |
| editable | 是否允许修改设为 true 时, QComboBox 的⾏为就⾮常接近 QLineEdit , 也可以设置 validator |
| iconSize | 下拉框图标 (⼩三⻆) 的⼤⼩ |
| maxCount | 最多允许有多少个条⽬ |
| addItem(const QString&) | 添加⼀个条⽬ |
| currentIndex() | 获取当前条⽬的下标从 0 开始计算. 如果当前没有条⽬被选中, 值为 -1 |
| currentText() | 获取当前条⽬的⽂本内容 |

信号

|--------------------------------------------------------------------|-------------------------------------------------------|
| activated(int) activated(const QString & text) | 当⽤⼾选择了⼀个选项时发出.这个时候相当于⽤⼾点开下拉框, 并且⿏标划过某个选项此时还没有确认做出选择.. |
| currentIndexChanged(int) currentIndexChanged(const QString& text) | 当前选项改变时发出. 此时⽤⼾已经明确的选择了⼀个选项. ⽤⼾操作或者通过程序操作都会触发这个信号. |
| editTextChanged(const QString & text) | 当编辑框中的⽂本改变时发出 (editable 为 true 时有效) |

//构造
std::ifstream fp("D:\\QTcode\\edittext\\test.txt",std::ifstream::out);
    if(!fp.is_open())
    {
        qDebug()<<"文件打开失败";
        return ;
    }
    std::string line;
    while(std::getline(fp,line))
    {
        ui->comboBox->addItem(QString::fromStdString(line));
    }
    fp.close();


void Widget::on_comboBox_currentIndexChanged(int index)//选中的下拉框的内容显示给标签
{
    QString content=ui->comboBox->currentText();
    ui->label_2->setText(content);
}

QSpin Box

使⽤ QSpinBox 或者 QDoubleSpinBox 表⽰ "微调框", 它是带有按钮的输⼊框. 可以⽤来输⼊整数/浮点数. 通过点击按钮来修改数值⼤⼩. 由于 SpinBox 和 QDoubleSpinBox ⽤法基本相同, 就只介绍 SpinBox 的使⽤了.

|-------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| value | 存储的数值. |
| singleStep | 每次调整的 "步⻓". 按下⼀次按钮数据变化多少 |
| displayInteger | 数字的进制. 例如 displayInteger 设为 10, 则是按照 10 进制表⽰. 设为 2 则为 2 进制表⽰. |
| minimum | 最⼩值 |
| maximum | 最⼤值 |
| suffix | 后缀 |
| prefix | 前缀 |
| wrapping | 是否允许换⾏ |
| frame | 是否带边框 |
| alignment | ⽂字对⻬⽅式. |
| . readOnly | 是否允许修改 |
| buttonSymbol | 按钮上的图标 |
| buttonsymbol | 按钮上的图标. UpDownArrows 上下箭头形式 • PlusMinus 加减号形式 • NoButtons 没有按钮 |
| accelerated (加速的) | 按下按钮时是否为快速调整模式 |
| correctionMode | 输⼊有误时如何修正. • QAbstractSpinBox::CorrectToPreviousValue : 如果⽤⼾输⼊了⼀个⽆效的值（例如，在只能显⽰正整数的SpinBox中输⼊了负数），那么 SpinBox会恢复为上⼀个有效值。例如，如果SpinBox的初始值是1，⽤⼾输⼊了-1（⽆效），然后SpinBox会恢复为1。 • QAbstractSpinBox::CorrectToNearestValue : 如果⽤⼾输⼊了⼀个⽆效的值，SpinBox会恢复为最接近的有效值。例如，如果SpinBox的初始值是1，⽤⼾输⼊了-1（⽆效），那么SpinBox会恢复为0。 |
| keyboardTrack | 是否开启键盘跟踪. 设为 true, 每次在输⼊框输⼊⼀个数字, 都会触发⼀次 valueChanged() 和 textChanged() 信号. 设为 false, 只有在最终按下 enter 或者输⼊框失去焦点, 才会触发 valueChanged() 和 textChanged() 信号 |

信号

|----------------------|----------------------------------------|
| textChanged(QString) | 微调框的⽂本发⽣改变时会触发. 参数 QString 带有前缀和后缀. |
| valueChanged(int) | 微调框的⽂本发⽣改变时会触发. 参数 int, 表⽰当前的数值 |

    //设置微调框
    ui->spinBox->setRange(1,5);//设置范围
    ui->spinBox->setValue(1);//设置初始值
    int valu=ui->spinBox->value();//获取微调框当前值

QDateTimeEdit

QDateTimeEdit其实也是微调框，但是是操作时间的，对于时间的为条框有三个，如下所示：
使⽤ QDateEdit 作为⽇期的微调框.
使⽤ QTimeEdit 作为时间的微调框.
使⽤ QDateTimeEdit 作为时间⽇期的微调框.
QDateTimeEdit 核⼼属性

|-----------------|------------------------------------------------------------------------------------------|
| dateTime | 时间⽇期的值. 形如 2000/1/1 0:00:00 |
| date | 单纯⽇期的值. 形如 2001/1/1 |
| time | 单纯时间的值. 形如 0:00:00 |
| displayFormat | 时间⽇期格式. 形如 yyyy/M/d H:mm • y 表⽰年份 • M 表⽰⽉份 • d 表⽰⽇期 • H 表⽰⼩时 • m 表⽰分钟 • s 表⽰秒 |
| minimumDateTime | 最⼩时间⽇期 |
| maximumDateTime | 最⼤时间⽇期 |
| timeSpec | • Qt::LocalTime ：显⽰本地时间。 • Qt::UTC ：显⽰协调世界时（UTC）。 • Qt::OffsetFromUTC ：显⽰相对于UTC的偏移量(时差). |

信号

|----------------------------|----------------|
| dateChanged(QDate) | ⽇期改变时触发. |
| timeChanged(QTime) | 时间改变时触发. |
| dateTimeChanged(QDateTime) | 时间⽇期任意⼀个改变时触发. |

对于日期对象，我们可以调用QDateTime中自身内置的函数
使⽤ daysTo 函数可以计算两个⽇期的天数.
• 使⽤ secsTo 函数可以计算两个时间的秒数.
• 通过 ( 秒数 / 3600) 换算成⼩时数, 再余上 24 得到零⼏个⼩时.
• 使⽤ QString::number 把整数转成 QString 进⾏拼接

QDateTime time=ui->dateEdit->dateTime();
    QDateTime time2=ui->dateEdit_2->dateTime();
    int day=time.daysTo(time2);//time与time2两者做差，求出天数差
    int seconds=time.secsTo(time2);//求相差的秒数
    qDebug()<<day;
    qDebug()<<seconds;

QDial

使⽤ QDial 表⽰⼀个旋钮. 有些程序, 通过⿏标拖动旋钮旋转, 即可完成⼀些相关的设置

|----------------|------------------------------------------------|
| value | 持有的数值. |
| minimum | 最⼩值 |
| maximum | 最⼤值 |
| singleStep | 按下⽅向键的时候改变的步⻓. |
| pageStep | 按下 pageUp / pageDown 的时候改变的步⻓. |
| sliderPosition | 界⾯上旋钮显⽰的初始位置 |
| tracking | 外观是否会跟踪数值变化. 默认值为 true. ⼀般不需要修改. |
| wrapping | 是否允许循环调整. 即数值如果超过最⼤值, 是否允许回到最⼩值. (调整过程能否 "套圈") |
| notchesVisible | 是否显⽰刻度线 |
| notchTarget | 刻度线之间的相对位置. 数字越⼤, 刻度线越稀疏. |

信号：

|------------------------|---------|
| valueChanged(int) | 数值改变时触发 |
| rangeChanged(int, int) | 范围变化时触发 |

可以通过代码，也可以在ui中技能设置，设置wrapping，可以循回，设置nothtarget（设置为10）,设置初始旋钮的位置（数值），设置旋钮整圈的范围（最大值与最小值）。编写一个代码，通过旋钮调节窗口透明度。

void Widget::on_dial_valueChanged(int value)
{
    int val=ui->dial->value();
    double opacity=(double(val)/100);
    this->setWindowOpacity(opacity);
}

QverticalSlider

使⽤ verticalSlider 表⽰⼀个滑动条.
verticalSlider 和 QDial 都是继承⾃ QAbstractSlider , 因此⽤法上基本相同.

|--------------------|----------------------------------|
| value | 持有的数值. |
| minimum | 最⼩值 |
| maximum | 最⼤值 |
| singleStep | 按下⽅向键的时候改变的步⻓. |
| pageStep | 按下 pageUp / pageDown 的时候改变的步⻓. |
| sliderPosition | 滑动条显⽰的初始位置 |
| tracking | 外观是否会跟踪数值变化. 默认值为 true. ⼀般不需要修改. |
| orientation | 滑动条的⽅向是⽔平还是垂直 |
| invertedAppearance | 是否要翻转滑动条的⽅向 |
| tickPosition | 刻度的位置. |
| tickInterval | 刻度的密集程度 |

|------------------------|---------|
| valueChanged(int) | 数值改变时触发 |
| rangeChanged(int, int) | 范围变化时触发 |

除了和旋转按钮一样的功能，我们还可以给他设置快捷键：

  //给滑动条添加快捷键
    QShortcut *shortcut=new QShortcut(this);//先创建快捷键对象
    shortcut->setKey(QKeySequence("w"));
    QShortcut *shortcut2=new QShortcut(this);//先创建快捷键对象
    shortcut2->setKey(QKeySequence("a"));
    //使用信号槽来触发
    connect(shortcut,&QShortcut::activated,this,&Widget::Sliderhandle);
    connect(shortcut2,&QShortcut::activated,this,&Widget::Sliderhandle2);



void Widget::Sliderhandle()
{
    int val=ui->verticalSlider->value();
    if(val>=ui->verticalSlider->maximum())
    {
        return ;
    }
    ui->verticalSlider->setValue(val+1);//每次加一
}
void Widget::Sliderhandle2()
{
    int val=ui->verticalSlider->value();
    if(val<=ui->verticalSlider->minimum())
    {
        return ;
    }
    ui->verticalSlider->setValue(val-1);//每次减一
}

4.多元素控件

Qt 中提供的多元素控件有:
• QListWidget
• QListView
前两个表示列表的组合控件
• QTableWidget
• QTableView
中间两个是表示表格的组合控件
• QTreeWidget
• QTreeView
最后两个是表示树形的组合控件
至于没什么每一组都两个，实际上在软件开发中 xxxView是一种MVC结构，指一种常用的组织形式。View只负责视图，不关注数据以及交互，使用view就需要自己实现交互以及数据部分，为了方便编写，又提供了xxxWidget,基于xxxView，帮我们提供了API方便我们去用。
这里我们就介绍WIdget类型的。

QListWidget

使⽤ QListWidget 能够显⽰⼀个纵向的列表.

|-------------------|--------------|
| currentRow | 当前被选中的是第⼏⾏ |
| count | ⼀共有多少⾏ |
| sortingEnabled | 是否允许排序 |
| isWrapping | 是否允许换⾏ |
| emAlignment | 元素的对⻬⽅式 |
| selectRectVisible | 被选中的元素矩形是否可⻅ |
| spacing | 元素之间的间隔 |

主要方法

|---------------------------------------------------------------------------------------------|----------------------------------------------|
| addItem(const QString& label) addItem(QListWidgetItem * item) | 列表中添加元素 |
| currentItem() | 返回 QListWidgetItem* 表⽰当前选中的元素 |
| setCurrentItem(QListWidgetItem* item) | 设置选中哪个元素 |
| setCurrentRow(int row) | 设置选中第⼏⾏的元素 |
| insertItem(const QString& label, int row) insertItem(QListWidgetItem * item, int row) | 在指定的位置插⼊元素 |
| item(int row) | 返回 QListWidgetItem* 表⽰第 row ⾏的元素 |
| takeItem(int row) | 删除指定⾏的元素, 返回 QListWidgetItem* 表⽰是哪个元素被删除了 |

槽函数

|----------------------------------------------------------------------|---------------------------------|
| currentItemChanged(QListWidgetItem* current, QListWidgetItem* old) | 选中不同元素时会触发. 参数是当前选中的元素和之前选中的元素. |
| currentRowChanged(int) | 选中不同元素时会触发. 参数是当前选中元素的⾏数. |
| itemClicked(QListWidgetItem* item) | 点击某个元素时触发 |
| itemDoubleClicked(QListWidgetItem* item) | 双击某个元素时触发 |
| itemEntered(QListWidgetItem* item) | ⿏标进⼊元素时触发 |

void Widget::on_pushButton_add_clicked()
{
    //根据文本插入
    QString content=ui->lineEdit->text();
    QListWidgetItem *item =new QListWidgetItem(ui->listWidget);
    item->setText(content);
    ui->listWidget->setStyleSheet("font-size:15px;color:green;");
    ui->listWidget->addItem(item);
    //也可以之家additemQString
}

void Widget::on_pushButton_del_clicked()
{
    //根据选中的行删除
    int row=ui->listWidget->currentRow();
    ui->listWidget->takeItem(row);
}

QTabelWidget

使⽤ QTableWidget 表⽰⼀个表格控件. ⼀个表格中包含若⼲⾏, 每⼀⾏⼜包含若⼲列.
表格中的每个单元格, 是⼀个 QTableWidgetItem 对象

|-----------------------------------------------------|--------------------------------|
| item(int row, int column) | 根据⾏数列数获取指定的 QTableWidgetItem* |
| setItem(int row, int column, QTableWidget*) | 根据⾏数列数设置表格中的元素 |
| currentItem() | 返回被选中的元素 QTableWidgetItem* |
| currentRow() | 返回被选中元素是第⼏⾏ |
| currentColumn() | 返回被选中元素是第⼏列 |
| row(QTableWidgetItem* | 获取指定 item 是第⼏⾏ |
| column(QTableWidgetItem* ) | 获取指定 item 是第⼏列 |
| rowCount() | 获取⾏数 |
| columnCount() | 获取列数 |
| insertRow(int row) | 在第 row ⾏处插⼊新⾏ |
| insertColumn(int column) | 在第 column 列插⼊新列 |
| removeRow(int row) | 删除第 row ⾏ |
| removeColumn(int column) | 删除第 column 列 |
| setHorizontalHeaderItem(int column, QTableWidget*) | 设置指定列的表头 |
| setVerticalHeaderItem(int row, QTableWidget*) | 设置指定⾏的表头 |

信号

|------------------------------------------------------------------------------|------------|
| cellClicked(int row, int column) | 点击单元格时触发 |
| cellDoubleClicked(int row, int column) | 双击单元格时触发 |
| cellEntered(int row, int column) | ⿏标进⼊单元格时触发 |
| currentCellChanged(int row, int column, int previousRow, int previousColumn) | 选中不同单元格时触发 |

QTableWidgetItem 核⼼⽅法

|-----------------------------|----------|
| row() | 获取当前是第⼏⾏ |
| column() | 获取当前是第⼏列 |
| setText(const QString&) | 设置⽂本 |
| setTextAlignment(int) | 设置⽂本对⻬ |
| setIcon(const QIcon&) | 设置图标 |
| setSelected(bool) | 设置被选中 |
| setSizeHints(const QSize&) | 设置尺⼨ |
| setFont(const QFont&) | 设置字体 |

表格的属性就像我们在mysql学习到的表格，有列的属性，行的属性。第几行第几行就是一个item.

/创建三行三列的表格
    ui->tableWidget->insertRow(0);
    ui->tableWidget->insertRow(1);
    ui->tableWidget->insertRow(2);
    ui->tableWidget->insertColumn(0);
    ui->tableWidget->insertColumn(1);
    ui->tableWidget->insertColumn(2);

    //设置列名
    ui->tableWidget->setHorizontalHeaderItem(0,new QTableWidgetItem("姓名"));
    ui->tableWidget->setHorizontalHeaderItem(1,new QTableWidgetItem("性别"));
    ui->tableWidget->setHorizontalHeaderItem(2,new QTableWidgetItem("年龄"));
    //添加元素
    ui->tableWidget->setItem(0,0,new QTableWidgetItem("张三"));
    ui->tableWidget->setItem(0,1,new QTableWidgetItem("男"));
    ui->tableWidget->setItem(0,2,new QTableWidgetItem("00001"));


void Widget::on_pushButton_insert_clicked()
{
    int row=ui->tableWidget->rowCount();
    //下标即为对应的行
    //获取当前的行数就可以表示下一行
    ui->tableWidget->insertRow(row);

}


void Widget::on_pushButton_clicked()
{
    int column=ui->tableWidget->columnCount();
    //下标即为对应的行
    //获取当前的行数就可以表示下一行
    ui->tableWidget->insertColumn(column);
    QString content=ui->lineEdit_table->text();
    ui->tableWidget->setHorizontalHeaderItem(column,new QTableWidgetItem(content));
}

使⽤ QTreeWidget 表⽰⼀个树形控件. ⾥⾯的每个元素, 都是⼀个 QTreeWidgetItem , 每个
QTreeWidgetItem 可以包含多个⽂本和图标, 每个⽂本/图标为⼀个列. 可以给 QTreeWidget 设置顶层节点(顶层节点可以有多个), 然后再给顶层节点添加⼦节点, 从⽽构成树形结构。

|---------------------------------------------|-------------------------------------------|
| clear | 清空所有⼦节点 |
| addTopLevelItem(QTreeWidgetItem* item) | 新增顶层节点 |
| topLevelItem(int index) | 获取指定下标的顶层节点. |
| opLevelItemCount() | 获取顶层节点个数 |
| indexOfTopLevelItem(QTreeWidgetItem* item) | 查询指定节点是顶层节点中的下标 |
| takeTopLevelItem(int index) | 删除指定的顶层节点. 返回 QTreeWidgetItem* 表⽰被删除的元素 |
| currentItem() | 获取到当前选中的节点, 返回 QTreeWidgetItem |
| setCurrentItem(QTreeWidgetItem* item) | 选中指定节点 |
| setExpanded(bool) | 展开/关闭节点 |
| setHeaderLabel(const QString& text) | 设置 TreeWidget 的 header 名称. |

QTreeWidget 核⼼信号

|----------------------------------------------------------------------|-----------|
| currentItemChanged(QTreeWidgetItem* current, QTreeWidgetItem* old) | 切换选中元素时触发 |
| itemClicked(QTreeWidgetItem* item, int col) | 点击元素时触发 |
| itemDoubleClicked(QTreeWidgetItem* item, int col) | 双击元素时触发 |
| itemEntered(QTreeWidgetItem* item, int col) | 元素被展开时触发 |
| itemExpanded(QTreeWidgetItem* item) | 元素被展开时触发 |
| itemCollapsend(QTreeWidgetItem* item) | 元素被折叠时触发 |

QTreeWidgetItem 核⼼属性

|--------------------------------------|--------------------------------|
| addChild(QTreeWidgetItem* child) | 新增⼦节点 |
| childCount() | ⼦节点的个数 |
| child(int index) | 获取指定下标的⼦节点. 返回 QTreeWidgetItem |
| takeChild(int index) | 删除对应下标的⼦节点 |
| removeChild(QTreeWidgetItem* child) | 删除对应的⼦节点 |
| parent() | 获取该元素的⽗节点 |

当目录使用

    //设置树形结构
    QStringList headerLabels;
    headerLabels << "Name" << "Age" << "Location";
    ui->treeWidget->setHeaderLabels(headerLabels);//设置根节点的列名
    //新增顶层节点，顶层目录即最高层次的目录
    QTreeWidgetItem *item=new QTreeWidgetItem();
    item->setText(0,"目录");//0表示所处的目录列号
    //给顶层目录添加子目录
    QTreeWidgetItem *itemchild=new QTreeWidgetItem();
    itemchild->setText(0,"子目录");
    QTreeWidgetItem *itemchild2=new QTreeWidgetItem();
    itemchild2->setText(0,"子目录2");
    item->addChild(itemchild);
    item->addChild(itemchild2);
    ui->treeWidget->addTopLevelItem(item);
    //添加到树中
    QTreeWidgetItem *item1=new QTreeWidgetItem();
    item1->setText(0,"目录1");
    //添加到树中
    ui->treeWidget->addTopLevelItem(item1);
    QTreeWidgetItem *item2=new QTreeWidgetItem();
    item2->setText(0,"目录2");
    //添加到树中
    ui->treeWidget->addTopLevelItem(item2);

即一个列下可能会有许多子目录。

5.容器类控件

容器类控件有两种 Group Box 分组框，QTab WIdget标签页

Group Box

我们可以将一些组件放到这个框框里头，同时左上角还可以设置这整个框的名字。

|-----------|-----------------------------------------|
| title | 分组框的标题 |
| alignment | 分组框内部内容的对⻬⽅式 |
| flat | 是否是 "扁平" 模式 |
| checkable | 是否可选择. 设为 true, 则在 title 前⽅会多出⼀个可勾选的部分. |
| checked | 描述分组框的选择状态 (前提是 checkable 为 true) |

使⽤ QTabWidget 实现⼀个带有标签⻚的控件, 可以往⾥⾯添加⼀些 widget. 进⼀步的就可以通过标签⻚来切换.

|-------------------|-----------------------------------------------------|
| tabPosition | 标签⻚所在的位置. • North 上⽅ • South 下⽅ • West 左侧 • East 右侧 |
| currentIndex | 当前选中了第⼏个标签⻚ (从 0 开始计算) |
| currentTabText | 当前选中的标签⻚的⽂本 |
| currentTabName | 当前选中的标签⻚的名字 |
| currentTabIcon | 当前选中的标签⻚的图标 |
| currentTabToolTip | 当前选中的标签⻚的提⽰信息 |
| absCloseab | 标签⻚是否可以关闭 |
| movable | 标签⻚是否可以移动 |

|--------------------------|--------------------------------|
| currentChanged(int) | 在标签⻚发⽣切换时触发, 参数为被点击的选项卡编号. |
| tabBarClicked(int) | 在点击选项卡的标签条的时候触发. 参数为被点击的选项卡编号. |
| tabBarDoubleClicked(int) | 在双击选项卡的标签条的时候触发. 参数为被点击的选项卡编号. |
| tabCloseRequest(int) | 在标签⻚关闭时触发. 参数为被关闭的选项卡编号 |

我们首先可以去ui界面设计，拖动一个标签table，我们可以选择一个页面往里面添加其他组件，同时i我们也可以右键添加或删除页，同时还有许多共功能。

使用ui访问具体的某个标签页时，我们不是用objectname，而失去使用currentTabName，

//创建新的标签页
void Widget::on_pushButton_add_clicked()
{
    QWidget * wid=new QWidget();
    int num=ui->tabWidget->count();//标签页数量
    ui->tabWidget->addTab(wid,QString("标签页")+QString::number(num+1));//三个参数，第一个为widget指针表示窗口，第二个为icon表示图标,第三个为 QString表示标题

}
//删除选中标签页
void Widget::on_pushButton_del_clicked()
{
   int idnext=ui->tabWidget->currentIndex();
    ui->tabWidget->removeTab(idnext);
}

布局管理器

之前使⽤ Qt 在界⾯上创建的控件, 都是通过 "手动定位" 的⽅式来设定的. 也就是每个控件所在的位置, 都需要计算坐标, 最终通过 setGeometry 或者 move ⽅式摆放过去. 这种设定⽅式其实并不⽅便. 尤其是界⾯如果内容⽐较多, 不好计算. ⽽且⼀个窗⼝⼤⼩往往是可以调整的, 按照绝对定位的⽅式, 也⽆法⾃适应窗⼝⼤⼩. 因此 Qt 引⼊ "布局管理器" (Layout) 机制, 来解决上述问题。

垂直布局QVBoxLayout

使⽤ QVBoxLayout 表⽰垂直的布局管理器. V 是 vertical 的缩写.
五个核心属性

|--------------------|-------------------------------------|
| layoutLeftMargin | 左侧边距 |
| layoutRightMargin | 右侧边距 |
| layoutTopMargin | 上⽅边距 |
| layoutBottomMargin | 下⽅边距 |
| layoutSpacing | 相邻元素之间的间距 Layout 只是⽤于界⾯布局, 并没有提供信号. |

一个窗口只能设置一个布局管理器。但是我们用QT Desgner可以拖很多个layout，实际上时先创建了一个widget，在对widget设置垂直布局。其次虽然只能设谁一个布局管理，但是里面可以进行布局管理器的嵌套。、

QPushButton * button1=new QPushButton("按钮一");
    QPushButton * button2=new QPushButton("按钮二");
    QPushButton * button3=new QPushButton("按钮三");
    //创建布局管理器
    QVBoxLayout * layout=new QVBoxLayout();
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    //添加布局管理器到窗口中
    this->setLayout(layout);

我们试着嵌套布局管理器看看：

QVBoxLayout * layout=new QVBoxLayout();
    this->setLayout(layout);
    QPushButton * button1=new QPushButton("按钮一");
    QPushButton * button2=new QPushButton("按钮二");
    layout->addWidget(button1);
    layout->addWidget(button2);
    QHBoxLayout * hboxlayout=new QHBoxLayout();
    //把水平布局添加到垂直布局当中
    layout->addLayout(hboxlayout);
    QPushButton * button3=new QPushButton("按钮三");
    QPushButton * button4=new QPushButton("按钮四");
    hboxlayout->addWidget(button3);
    hboxlayout->addWidget(button4);

⽔平布局QHBoxLayout

使⽤ QHBoxLayout 表⽰垂直的布局管理器. H 是 horizontal 的缩写.
属性与垂直布局一样，用法也一样，区别时水平布局，注重水平方向的的布置管理。上述例子也演示了水平布局。

网格布局QGridLayout

Qt 中还提供了 QGridLayout ⽤来实现⽹格布局的效果,可以达到 M * N 的这种⽹格的效果
网格布局会根据坐标自动进行划分。

|-------------------------|---------------|
| layoutLeftMargin | 左侧边距 |
| layoutRightMargin | 右侧边距 |
| layoutTopMargin | 上⽅边距 |
| layoutBottomMargin | 下⽅边距 |
| layoutHorizontalSpacing | 相邻元素之间⽔平⽅向的间距 |
| layoutVerticalSpacing | 相邻元素之间垂直⽅向的间距 |
| layoutRowStretch | ⾏⽅向的拉伸系数 |
| layoutColumnStretch | 列⽅向的拉伸系数 |

想不与上面的布局，网格布局队列和行的间距以及拉伸系数提供了修改。

    QGridLayout *gridlayout=new QGridLayout();
    this->setLayout(gridlayout);
    QPushButton * button1=new QPushButton("按钮一");
    QPushButton * button2=new QPushButton("按钮二");
    QPushButton * button3=new QPushButton("按钮三");
    QPushButton * button4=new QPushButton("按钮四");
    gridlayout->addWidget(button1,0,0);//添加时可以指定行与列
    gridlayout->addWidget(button2,0,1);
    gridlayout->addWidget(button3,1,0);
    gridlayout->addWidget(button4,1,1);
}

通过将坐标设置为同一行或者同一列，就可以实现水平或者垂直布局。
即使两者坐标相差极大，但是也会根据窗口大小在窗口内按照布局显示。

 gridlayout->addWidget(button1,0,0);//添加时可以指定行与列
    gridlayout->addWidget(button2,1,1);
    gridlayout->addWidget(button3,50,50);
    gridlayout->addWidget(button4,100,100);

直接进行组建的布局，各个组件的大小是均等的，如果你想改变某个组件或者某列或者某行的大小，你就可以修改他的拉伸系数。

 gridlayout->setColumnStretch(0,1);//设置第一列的拉伸系数为一
 gridlayout->setColumnStretch(1,2);//设置第2列的拉伸系数为二

出列列拉伸，我们还可以进行行拉伸，但是直接拉伸，我们会发现并不会有我们想看到的效果，这是因为widget中有一个sizepolicy的限制。

使⽤ setSizePolicy 设置按钮的尺⼨策略. 可选的值如下:
• QSizePolicy::Ignored : 忽略控件的尺⼨，不对布局产⽣影响。
• QSizePolicy::Minimum : 控件的最⼩尺⼨为固定值，布局时不会超过该值。
• QSizePolicy::Maximum : 控件的最⼤尺⼨为固定值，布局时不会⼩于该值。
• QSizePolicy::Preferred : 控件的理想尺⼨为固定值，布局时会尽量接近该值。
• QSizePolicy::Expanding : 控件的尺⼨可以根据空间调整，尽可能占据更多空间。
• QSizePolicy::Shrinking : 控件的尺⼨可以根据空间调整，尽可能缩⼩以适应空间

    QGridLayout *gridlayout=new QGridLayout();
    this->setLayout(gridlayout);
    QPushButton * button1=new QPushButton("按钮一");
    QPushButton * button2=new QPushButton("按钮二");
    QPushButton * button3=new QPushButton("按钮三");
    QPushButton * button4=new QPushButton("按钮四");
    QPushButton * button5=new QPushButton("按钮五");
    QPushButton * button6=new QPushButton("按钮六");
    button1->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    button2->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    button3->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    button4->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    button5->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    button6->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Ignored);
    gridlayout->addWidget(button1,0,0);//添加时可以指定行与列
    gridlayout->addWidget(button2,0,1);
    gridlayout->addWidget(button3,1,0);
    gridlayout->addWidget(button4,1,1);
    gridlayout->addWidget(button5,2,0);
    gridlayout->addWidget(button6,2,1);
    gridlayout->setRowStretch(0,1);
    gridlayout->setRowStretch(1,3);

表单布局

除了上述的布局管理器之外, Qt 还提供了 QFormLayout , 属于是 QGridLayout 的特殊情况, 专
⻔⽤于实现两列表单的布局. 这种表单布局多⽤于让⽤⼾填写信息的场景. 左侧列为提⽰, 右侧列为输⼊框。
在该布局添加item时，使用方法addRow(),参数分别为左侧的部件，与右侧的部件，因为他是两列的结构，也可以写空指针，表示这个位置不放部件。

// 把上述元素添加到 layout 中
 layout->addRow(label1, lineEdit1);
 layout->addRow(label2, lineEdit2);
 layout->addRow(label3, lineEdit3);
 layout->addRow(NULL, btn);

Spacer

使⽤布局管理器的时候, 可能需要在控件之间, 添加⼀段空⽩. 就可以使⽤ QSpacerItem 来表⽰

|--------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| width | 宽度 |
| height | ⾼度 |
| hData | ⽔平⽅向的 sizePolicy • QSizePolicy::Ignored : 忽略控件的尺⼨，不对布局产⽣影响。 • QSizePolicy::Minimum : 控件的最⼩尺⼨为固定值，布局时不会超过该值。 • QSizePolicy::Maximum : 控件的最⼤尺⼨为固定值，布局时不会⼩于该值。 • QSizePolicy::Preferred : 控件的理想尺⼨为固定值，布局时会尽量接近该值 QSizePolicy::Expanding : 控件的尺⼨可以根据空间调整，尽可能占据更多空间。 • QSizePolicy::Shrinking : 控件的尺⼨可以根据空间调整，尽可能缩⼩以适应空间。 |
| vData | 垂直⽅向的 sizePolicy |

我们可以将空白也想象成一个组件表示空白，进行两个组件空白的设置时，按顺序，依次添加到布局管理中：

QSpacerItem主要用于在Qt中的水平布局和垂直布局中添加空白空间。
它可以通过布局管理器的方法（如addSpacing()、insertSpacing()、addStretch()和insertStretch()）直接添加到布局中。
在网格布局中，虽然不直接使用QSpacerItem，但可以通过调整行和列的"弹性"来间接实现类似的效果。
在更复杂的布局场景中，QSpacerItem仍然是一个有用的工具，可以帮助控制部件之间的间距和布局的整体外观。

QPushButton* btn1 = new QPushButton("按钮1");
QPushButton* btn2 = new QPushButton("按钮2");
// 创建 Spacer
QSpacerItem* spacer = new QSpacerItem(200, 20);
layout->addWidget(btn1);
// 在两个 widget 中间添加空⽩
layout->addSpacerItem(spacer);
layout->addWidget(btn2);