Qt控件---显示类控件

QLabel（显示文本）

属性	说明
text	QLabel 中的文本
textFormat	文本的格式：Qt::PlainText：纯文本；Qt::RichText：富文本(支持HTML)；Qt::MarkdownText：markdown格式；Qt::AutoText：根据文本内容自动决定文本格式
pixmap	QLabel 内部包含的图片
scaledContents	设为 true 表示内容自动拉伸填充设为 false 则不会自动拉伸
alignment	对齐方式：可以设置水平和垂直方向
wordWrap	true：文本会自动换行false：文本不会自动换行
indent	设置文本缩进. 水平和垂直方向都生效
margin	内部文本和边框之间的边距
openExternalLinks	是否允许打开⼀个外部的链接
buddy	给 QLabel 关联⼀个 “伙伴”，点击 QLabel 时就能激活对应的伙伴

设置图片自动拉伸

QLabel *l1 = new QLabel(this);
l1->setGeometry(0, 0, 800, 600);
QPixmap q(":/img/1.jpeg");
l1->setPixmap(q);
QLabel *l1 = new QLabel(this);
// 设置内容自动拉伸
l1->setScaledContents(true);

设置了内容自动拉伸的话，图片就会填满 label。

但是如果把窗口最大化后，图片并不会跟着放大

为了解决这个问题, 可以在 Widget 中重写 resizeEvent 函数

// 因为这里是纯代码演示，所以 l1 变量需要设为 Widget 类内成员变量才能获取到
void Widget::resizeEvent(QResizeEvent *event){
    l1->setGeometry(0, 0, this->width(), this->height());
    qDebug() << this->geometry();
}

这样之后，图片就也会随着窗口的变化而填满窗口

设置边框

QFrame 是 QLabel 的父类，其中 frameShape 属性可以用来设置边框性质。

• QFrame::Box ：矩形边框
• QFrame::Panel ：带有可点击区域的面板边框
• QFrame::WinPanel ：Windows风格的边框
• QFrame::HLine ：水平线边框
• QFrame::VLine ：垂直线边框
• QFrame::StyledPanel ：带有可点击区域的面板边框，但样式取决于窗口主题

QLabel *l1 = new QLabel(this);
l1->setText("hell qt");
l1->setFrameStyle(QFrame::Box);

QLabel *l2 = new QLabel(this); l2->move(0, 100);
l2->setText("hell qt");
l2->setFrameStyle(QFrame::WinPanel);

QLabel *l3 = new QLabel(this); l3->move(0, 200);
l3->setText("hell qt");
l3->setFrameStyle(QFrame::HLine);

设置伙伴

QRadioButton *q = new QRadioButton(this); q->move(50, 0);
q->setText("选项");

QLabel *l1 = new QLabel(this);
l1->setText("快捷键&A");
l1->setBuddy(q);

这样设置完了之后，就可以使用 alt + A 快捷键去选中按钮
需要注意：这里的快捷键和 QPushButton 的不同，需要搭配 alt 和 单个字母的方式才能触发

QLCDNumer（显示数字）

QLCDNumer 是⼀个专门用来显示数字的控件

属性	说明
intValue	QLCDNumber 显示的数字值 (int)
value	QLCDNumber 显示的数字值(double)
digitCount	显示几位数字
mode	数字显示形式：QLCDNumber::Dec：十进制；QLCDNumber::Hex：十六进制；QLCDNumber::Bin：二进制；QLCDNumber::Oct：八进制；(十进制才可以显示小数点后的内容)
segmentStyle	设置显示风格：QLCDNumber::Flat：平面风格；QLCDNumber::Outline：轮廓风格；QLCDNumber::Filled：填充风格
smallDecimalPoint	设置比较小的小数点

倒计时

QLCDNumber *num = new QLCDNumber(this);
num->display(10); num->setGeometry(100, 100, 100, 100);
num->setSegmentStyle(QLCDNumber::Flat);

// 创建QTimer定时器成员
QTimer *time = new QTimer(this);
// 每个一秒显示器的数字减1，数字为0时关闭定时器
connect(time, &QTimer::timeout, this, [=](){
    int n = num->intValue();
    if(n <= 0)
    {
        time->stop();
        Widget::close();
    }
    num->display(n - 1);
});
// 设置定时器每隔一秒触发一次
time->start(1000);

当数字为0之后就会关闭窗口

QProgressBar（进度条）

使用 QProgressBar 表示⼀个进度条

属性	说明
minimum	进度条最小值
maximum	进度条最大值
value	进度条当前值
alignment	文本在进度条中的对齐方式：Qt::AlignLeft：左对齐；Qt::AlignRight：右对齐；Qt::AlignCenter：居中对齐；Qt::AlignJustify：两端对齐
textVisible	进度条的数字是否可见
orientation	进度条的方向水平还是垂直
invertAppearance	是否往反方向增长进度
textDirection	文本的朝向
format	显示的数字格式：%p：表示进度的百分比；%v：表示进度的数字；%m：表示剩余时间（ms）；%t：表示总时间（ms）

QProgressBar *p1 = new QProgressBar(this);
QProgressBar *p2 = new QProgressBar(this); p2->move(0, 100);
QProgressBar *p3 = new QProgressBar(this); p3->move(0, 200);
QProgressBar *p4 = new QProgressBar(this); p4->move(0, 300);

// 设置进度条的初始值
p1->setValue(0);p2->setValue(0);p3->setValue(0);p4->setValue(0);
// 设置进度条的值格式
p1->setFormat("%p"); p2->setFormat("%v");
p3->setFormat("%m"); p4->setFormat("%t");

// 设置定时器触发槽函数
QTimer *timer = new QTimer(this);
connect(timer, &QTimer::timeout, this, [=](){
    int n = p1->value();
    if(n >= 100)
    {
        timer->stop();
        return;
    }
    p1->setValue(n + 1); p2->setValue(n + 1);
    p3->setValue(n + 1); p4->setValue(n + 1);
});
timer->start(100);

QCalendarWidget（日历）

QCalendarWidget 表示一个日历

属性	说明
selectDate	当前选中日期
minimumDate	最小日期
maximumDate	最大日期
firstDayOfWeek	每周的第一天是周几
gridVisible	是否显示表格边框
selectionMode	是否允许选中日期
navigationBarVisible	日历上方标题是否显示
horizontalHeaderFormat	日历上方标题现实的日期格式
verticalHeaderFormat	日历第一列显示的内容格式
dateEditEnabled	是否允许日期被编辑

信号	说明
selectionChanged(const QDate&)	当前选中日期发生改变时触发
activated(const QDate&)	双击一个有效日期或者按下回车时触发，参数为选中的日期
currentPageChanged(int, int)	当前年月发生改变时发出，参数为改变后的年月

QLabel *l = new QLabel(this);
QCalendarWidget *cal = new QCalendarWidget(this);
cal->move(0, 20);
l->setText(cal->selectedDate().toString());

// 设置选中日期后的槽
connect(cal, &QCalendarWidget::selectionChanged, this, [=](){
    l->setText(cal->selectedDate().toString());
});