Qt—常用窗口部件

QFrame类族

QFrame基本属性概述

QFrame类是带有边框的部件的基类。它的子类有我们最为常用的标签部件QLabel，另外还有QLCDNumber、QSplitter、 QStackedWidget、QToo1Box和QAbstractScrollArea类。

带边框部件最主要的特点就是可以有一个明显的边界框架。QFrame类的主要功能也就是用来实现不同的边框效果，这主要是由边框形状(Shape)和边框阴影(Shadow) 组合来形成的。

这里需要说明的二个名词：lineWidth 和 midLineWidth
lineWidth 是边框边界线的宽度；
midLineWidth是边框额外插入的一条线的宽度；为了形成3D效果；
而且只有在BOX 、Hline和 VLine 表现为凸起或者凹陷时候有用。

QFrame类族的所有边框效果如下图所示

下面在程序中演示一下：
新建QT WIdget项目，名字为myframe，基类为QWidget，类名为MyWidget。
完成后打开ui界面，拖入一个Frame到界面上。

然后在右下方的属性栏更改其frameShape为Box，frameShadow为Sunken，lineWidth为5，midLineWidth为10.

其实直接在mywidget.cpp中的MyWidget构造函数中也可以实现

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::MyWidget)
{
    ui->setupUi(this);
    ui->frame->setFrameShape(QFrame::Box);
    ui->frame->setFrameShadow(QFrame::Sunken);
    // 以上两个函数可以使用setFrameStyle(QFrame::Box | QFrame::Sunken)代替
     ui->frame->setLineWidth(5);
     ui->frame->setMidLineWidth(10);
}

其余属性可以直接查找QFrame的手册
对于QFrame的子类，它们都继承QFrame的边框设置功能，所以下面对它的子类的介绍中就不再涉及这方面的内容了，而是讲解各个子类的独有特性；

1. QLabel

标签QLabel用来显示显示文本或者图片。

在设计器中向界面拖入一个Label，然后将其放大，在属性中设置对齐方式alignment的属性，水平的改为AlignHCenter，垂直的改为AlignVCenter，这样QLabel中的文本就会在正中间显示。

font属性可以对字体进行设置，也可以通过代码进行设置，下面打开mywidget.cpp文件，在构造函数中

QFont font;
    font.setFamily("华文行楷");
    font.setPointSize(20);
    font.setBold(true);
    font.setItalic(true);
    ui->label->setFont(font);

自动换行
QLabel属性栏中的wordWrap属性可以实现文本的自动换行。
如果不想自动换行，而是在后面自动省略，那么可以使用QFontMetrics类，该类用来计算给定字体的字符或字符串大小。要使用QFontMetrics类，则可以通过创建对象的方式，或者通过**QWidget::fontMetrics()**来返回当前部件字体的QFontMetrics对象

QString string = tr("标题太长，需要进行省略！");
    QString str = ui->label->fontMetrics().elidedText(string, Qt::ElideRight, 180);
    ui->label->setText(str);

elidedText()函数是用来进行文本省略的，elidedText(string, Qt::ElideRight, 180);
elidedText(1要省略的文本，2省略模式(…出现位置)，3文本长度);
指定的文本超过这个长度就会进行省略
///
缩放

//图片
下面在标签中使用图片
添加头文件
#include < QPixmap>
然后在构造函数里面添加一行代码

ui->label->setPixmap(QPixmap("C:/QtCode/wailaidaima/myframe/logo.png"));
 //自己图片路径修改

也可以使用相对路径，把图片放在项目文件的bulid debug中。直接写logo.png就行了

其实，最好的方法是使用资源管理器，放在程序里面
QT–使用QT资料文件管理

ui->label->setPixmap(QPixmap(":/image/logo.png"));

这样也行

也可以添加gif动态图片
添加头文件#include <QMovie>

QMovie *movie = new QMovie(":/image/donghua.gif");
    ui->label->setMovie(movie);                  // 在标签中添加动画
    movie->start();

会遮盖以前的图片，用的一个label

2. QLCDNumber

说明可以显示很多，可以显示0-9 还可以数字 冒号，度符号，负号，小数点等
详细看帮助：
效果：

3. QStackedWidget

QStackedWidget类提供了一个部件栈,可以有多个界面(称为页面),每个界面可以拥有自己的部件,不过每次只能显示一个界面。这个部件需要使用QComboBox或者QListWidget来选择它的各个页面。

在设计模式中向界面上拖入一个List Widget和一个stackedWidget。在ListWidget上右击,在弹出的级联菜单中选择“编辑项目”项,然后在“编辑列表窗口部件”对话框中按下左下角的加号添加两项,并更该名称为“第一页”和“第二页”。然后在Stacked Widget.上拖入一个Label,更改文本为“第一页”，再单击Stacked Widget右上角的小箭头进人下一页,再拖入一个标签,更改文本为“第二页”。然后再将Stacked Widget部件的frameShape属性更改为StyledPanel。
最后，在信号和槽设计模式将listWidget部件的currentRowChanged()信 号和stackedWidget的setCurrentIndex()槽关联。设置完成后运行程序可以看到，现在可以单击listWidget中的项目来选择stackedWidget的页面了。
可以在设计模式中在stackedWidget上右击来为它添加新的页面

最后关联他俩
进入信号与槽设计模式

效果：

4. QToolBox

复选框

按钮部件

QAbstractButton类是标准部件的抽象基类，提供了按钮的通用功能。
它的子类包括复选框QcheckBox、标准按钮QPushButton、单选框QRadioButton和工具按钮QToolButton。

新建widget项目，在项目文件夹里面放几张图片

1 QPushButton

QPushButton提供一个标准按钮。
在项目中打开mywidget. ui文件,拖入3个PushButton到界面上,然后将它们的objectName依次更改为pushBtn1、pushBtn2和pushBtn3。
下面选中pushBtn1的checkable属性，使得它可以拥有“选中”和“未选中”两种状态;
再选中pushBtn2的flat属性,可以不显示该按钮的边框。
然后转到push-Btn1的toggled(bool)信号的槽,更改如下:

void MyWidget::on_pushBtn1_toggled(bool checked) //判断按钮是否处于被按下状态
{
  qDebug()<<tr("按钮是否被按下;")<<checked;
}

看帮助文档

运行：

然后在构造函数中添加代码：

ui->pushBtn1->setText(tr("&nihao"));   // 这样便指定了Alt+N为加速键
    ui->pushBtn2->setText(tr("帮助(&H)"));
    ui->pushBtn2->setIcon(QIcon("../mybutton/images/help.png"));
    ui->pushBtn3->setText(tr("z&oom"));
    QMenu *menu = new QMenu(this);
    menu->addAction(QIcon("../mybutton/images/zoom-in.png"), tr("放大"));
    ui->pushBtn3->setMenu(menu);

注：这里的& 表示设置加速键，在字母前面加上&符号，就可以将这个按钮的加速键设置为Alt+这个字母。
如果要在文本中显示& 就这样：& & ，第二个&就显示出来了

用setIcon加图标，也可以设计模式

这里的按钮3，为其添加了menu下拉菜单，现在这个菜单什么也没实现

2. QCheckBox、QRadioButton和QGroupBox

对于调查表之类的应用,往往提供多个选项供选择,有些是可以选择多项的,有些只能选择其中一项。复选框QCheckBox类提供了同时选择多项的功能,而QRadioButton提供了只能选择一项的功能,一般要把一组按钮放到一个QGroupBox中来管理。

在设计模式时可往界面上拖人两个Group Box,将它们的标题分别改为“复选框”和“单选框”。

然后往复选框中拖人3个Check Box,分别更改显示内容为“跑步”、“踢球”和“游泳”。再往单选框中拖入3个Radio Button,分别更改其显示内容为“很好”、“一般”和“不好”。

这里还可以选中CheckBox的tristate属性，让它拥有不改变状态、选中状态和未选中状态3种状态。

对于选择按钮后的操作,可以关联它们的state-Changed()信号和自定义的槽

表示checkBox—》statechange，如果状态改变。那就是checkBox—》click（）按下

也可以使用isChecked()函数查看一个按钮是否被选中

QGroupBox *testGroupBox = new QGroupBox(QObject::tr("测试"));
    QCheckBox* testCheckBox = new QCheckBox(QObject::tr("checkbox test"));
    QVBoxLayout *layout=new QVBoxLayout;
    layout->addWidget(testCheckBox);
    testGroupBox->setLayout(layout);
    testGroupBox->isCheckable(); //是否按下 bool型 返回true 或者 fault 也可以用setCheckable
    testGroupBox->show();

除了GroupBox,还可以使用QButtonGroup类来管理多个按钮。

qt之QbuttonGroup的使用

QButtonGroup 类：https://doc.qt.io/qt-5/qbuttongroup.html
官方文档

好处是能够统一一组的属性，修改多个窗口的内容
例子：
原项目文件：https://wwa.lanzouo.com/iUxf5xj5nmh
效果：

3. QLineEdit

行编辑器QLineEdit部件是一个单行的文本编辑器，它允许用户输入和编辑单行的纯文本内容，而且提供了一系列有用的功能，包括撤销与恢复、剪切和拖放等操作。其中，剪切复制等功能是行编辑自带的，不用自己编码实现，拖放功能会在后面讲到

新建一个widget项目，项目名称：mylineedit，类名MyWidget。
在ui界面上拖入几个标签和Line Edit，如图：

改变4个Line Edit的objectname为lineEdit1,2,3，4

1.显示模式

行编辑器QLineEdit有4种显示模式（echoMode），可以在echoMode属性中更改它们，分别是：Normal正常显示输入的信息；NoEcho不显示任何输人，这样可以保证不泄露输入的字符位数;

Password显示为密码样式，就是以小黑点或星号之类的字符代替输人的字符：
PasswordEchoOnEdit在编辑时显示正常字符，其他情况下显示为密码样式。

这里设置lineEdit1的echoMode为Password

2.输入掩码

QLineEdit提供输入掩码（inputMaskx）来限制输入的内容。
可以使用一些特殊的字符来设置输入的格式和内容，这些字符中有的起限制作用且必须要输入一个字符，有的只是起限制作用，但可以不输人字符而是以空格代替。

先来看一下这些特殊字符的含义，如表3-3所列。

下面将lineEdit2的inputMask属性设置为> AA-90-bb-! aa\# H; *
其含义为:>号表明后面输人的字母自动转为大写;“AA"表明开始必须输入两个字母,因为有前面的“>”号的作用,所以输人的这两个字母会自动变为大写;“-”号为分隔符，直接显示,该位不可输入;“9”表示必须输入一个数字;“0”表示输入一个数字,或者留空;“bb”表示这两位可以留空,或者输人两个二进制字符,即0或1;“!"表明停止大小写转换,就是在最开始的“>”号不再起作用;“aa”表示可以留空,或者输入两个字母;“\ #”表示将“#”号作为分隔符,因为“#”号在这里有特殊含义,所以前面要加上“\”号;“H"表明必须输入一个十六进制的字符;“; *”表示用“*”号来填充空格。

另外,也可以使用setInputMask()函数在代码中来设置输入掩码

转到lineEdit2的 returnPressed()槽中，更改如下：

void MyWidget::on_lineEdit2_returnPressed()
{
   ui->lineEdit3->setFocus(); //让lineEdit3获得焦点
   qDebug()<<ui->lineEdit2->text();//输出lineEdit2的内容
   qDebug()<<ui->lineEdit2->displayText();//输出lineEdit2显示的内容
}

这里是按下回车显示输入的内容，即显示lineEdit2的内容

3. 输入验证

使用验证器validator来对输入进行约束。在mywidget.cpp文件的构造函数中添加代码：
#include < QIntValidator>头文件

//新建验证器，指定范围为100~999
    QValidator *validator=new QInValidator(100,999,this);
   //在行编辑器中使用验证器
   ui->lineEdit3->setValidator(validator);

设置最小值范围

在到lineEdit3的returnpress槽

void MyWidget::on_lineEdit3_returnPressed()
{
    ui->lineEdit4->setFocus(); //让lineEdit4获得焦点
    qDebug()<<ui->lineEdit3->text();//输出lineEdit3的内容
    qDebug()<<ui->lineEdit3->displayText();//输出lineEdit3显示的内容
}

然后输入小于100或者大于999的数字时候，按下回车键是不会出现的

按下1不显示

还提供了浮点数

更详细的见：
Qt中验证器的使用
QdoubleValidator, QIntValidator, QRegExpValidator类

如果想要设置更强大的字符约束，就要使用正则表达式了
这里QRegExpValidator类：提供了对满足正则表达的字符串的范围检查
举个简单的例子：

//正则表达式
   QRegExp rx("-?\\d{1,3}"); //输入-号 或者不输入，输入1-3个数字限制
   QValidator *validator1 = new QRegExpValidator(rx, this);

4.自动补全

用QComplete类完成
在构造函数中添加

QStringList wordList;
    wordList << "Qt" << "Qt Creator" << tr("你好");
    QCompleter *completer = new QCompleter(wordList, this);   // 新建自动完成器
    completer->setCaseSensitivity(Qt::CaseInsensitive);       // 设置大小写不敏感
    ui->lineEdit4->setCompleter(completer);

要添加>#include < QCompleter>头文件

QStringList 的常规使用

运行

4. QAbstractSpinBox

QAbstractSpinBox类是一个抽象基类，提供了一个数值设定框和一个行编辑器来显示设定值。

它有3个子类QDateTimcEdit、QSpinBox和QDoubleSpinBox，分别用来完成日期时间、整数和浮点数的设定。

新建一个widget项目，项目名称myspinbox，类名MyWidget

1.QDateTimeEdit

提供了一个可以编辑日期和时间的部件。到设计模式ui，拖入Time Edit、Date Edit和Date/Time Edit到界面上：

然后设置timeEdit的displayFormat为"h:mm:ssA",这就可以使用12h制来进行显示，

对于dateEdit，选中它的calendarPopup属性，就可以使用弹出的日历部件来设置日期，

然后在构造函数中添加

//设置时间为现在的系统时间
   ui->dateTimeEdit->setDateTime(QDateTime::currentDateTime());
   //设置时间的显示格式
   ui->dateTimeEdit->setDisplayFormat(tr("yyyy年MM月dd日dddHH时mm分ss秒"));

这里使用代码设置了dateTimeEdit中的日期和时间。

简单说明一下：
y表示年；M表示月：d表示日：而ddd表示星期：H表示小时，使用24h制显示，而h也表示小时，如果最后有AM或者PM的，则是12h制显示，否则使用24h制：m表示分；s表示秒；还有一个z可以用来表示毫秒。

//设置时间为现在的系统时间
   ui->dateTimeEdit->setDateTime(QDateTime::currentDateTime());
   //设置时间的显示格式
   ui->dateTimeEdit->setDisplayFormat(tr("yyyy年MM月dd日dddHH时mm分ss秒"));

2. QSpinBox和QDoubleSpinBox

QSpinBox用来设置整数，QDoubleSpinBox 用来设置浮点数。
从ui拖入

设置spinBox的属性：后缀属性suffix属性，设置为"%",这样就可以显示百分数了。

然后前缀属性prefix，比如表示金钱时前面有"￥"字符

最小值minimum属性，设置其最小值；最大值maximum属性设置其最大值；

单步值singleStep属性值设置每次增加的数值，默认为1

value为现在的数值

doubleSpinBox又增加了一个小数位数decimals属性，用来设置小数的位数

其他的可以自行摸索
可以在代码中使用value()函数来获取设置的数值

//函数输出结果
  qDebug()<<ui->doubleSpinBox->value();
  qDebug()<<ui->spinBox->value();

QAbstractSlider

QAbstractSlider类用于提供区间内的一个整数值，它有一个滑块，可以定位到一个整数区间的任意值。

该类是一个抽象基类，它有3个子类QScrollBar、Qslider和QDial。
其中，滚动条QScrollBar多数是用在QScrllArea类中来实现滚动区域；
QSlider就是常见的音量控制或多媒体播放进度等滑块部件
QDial是一个刻度表盘部件。

新建一个widget项目，跟以前一样，类名MyWidget

拖入：

先看二个Scroll Bar的属性：maximum属性是用来设置最大值，minimum属性用来设置最小值；

singleStep属性是每步的步长，默认为1；按下方向键后其数值增加或减少1

pageStep是每页的步长，默认为10；就是按下PageUP/Down数值±10

value与sliderPosition 是当前值;

tracking设置是否跟踪，默认为是，就是在拖动滑块时，每移动一个刻度,都会发射valueChanged()信号,如果选择否，则只有拖动滑块释放时才发射该信号;

orientation设置部件的方向,有水平和垂直两种选择;

invertedAppearance属性设置滑块所在的位置，比如默认滑块开始在最左端,选中这个属性后,滑块默认就会在最右端。

invertedControls设置反向控制,比如默认是向上方向键是增大,向下方向键是减小，如果选中这个属性,那么控制就会正好反过来。

另外,为了使部件可以获得焦点,需要将focusPolicy设置为StrongFocus。

再来看两个Slider,它们有了自己的两个属性tickPosition 和tickInterval, 前者用来设置显示刻度的位置,默认是不显示刻度;后者是设置刻度的间隔。

向上above，间隔2

而Dial有自己的属性wrapping,用来设置是否首尾相连,默认开始与结束是分开的;
属性notchTarget用来设置刻度之间的间隔;
属性notchesVisible用来设置是否显示刻度。

完成，当然也可以在main中创建类与对象，用代码显示，在调用函数

#include "mywidget.h"
#include <QSlider>
#include <QDial>
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MyWidget w;
    //加一个dial
       QDial dial(&w);
     //初始化dial
    dial.setValue(100);

    w.show();
    return a.exec();
}