【Qt 学习笔记】Qt常用控件 | 显示类控件 | Label的使用及说明

Qt常用控件 | 显示类控件 | Label的使用及说明

一、QLabel介绍

1. 简介

QLabel 可以有用来显示文本和图⽚

在Qt中，QLabel是一个用于显示文本或图像的控件类。它可以显示静态文本，也可以显示包含格式和超链接的富文本。QLabel可以用于显示应用程序的标题、标签、状态栏等内容。可以通过设置QLabel的属性来控制文本的对齐方式、字体、颜色等。此外，QLabel还可以和其它控件进行交互，例如可以通过设置成一个超链接来实现在文本被点击时触发某个事件。

2. 常用属性及说明

二、QFrame的介绍

QFrame 是 QLabel 的父类. 其中 frameShape 属性⽤来设置边框性质.

QFrame::Box：矩形边框

QFrame::Panel ：带有可点击区域的⾯板边框

QFrame::WinPanel ：Windows⻛格的边框

QFrame::HLine ：⽔平线边框

QFrame::VLine ：垂直线边框

QFrame::StyledPanel ：带有可点击区域的⾯板边框，但样式取决于窗⼝主题

三、QLabel的使用（代码示例）

1. 显示不同格式的文本

1. 在界⾯上创建三个 QLabel
   
2. 编辑widget.cpp文件，修改label为纯文本格式，修改label_2为富文本格式，修改label_3为markdown文本格式
   
3. 运行代码，查看结果

文件代码：

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->label->setTextFormat(Qt::PlainText);
    ui->label->setText("纯文本格式");

    ui->label_2->setTextFormat(Qt::RichText);
    ui->label_2->setText("<b>富文本格式<b>");

    ui->label_3->setTextFormat(Qt::MarkdownText);
    ui->label_3->setText("## markdown文本格式");
}

Widget::~Widget()
{
    delete ui;
}

2. QLabel显示图片

1. 在界⾯上创建⼀个 QLabel
   
   
2. 创建 resource.qrc ⽂件, 并把图⽚导⼊到 qrc 中 详细文字参考qrc文件机制
   
   
3. 编辑widget.cpp文件，将图片加入到label标签中
   
   
4. 运行程序
   
   

文件代码：

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->label->setGeometry(0,0,800,600);


    QPixmap pixmap(":/cat.jpg");
    ui->label->setPixmap(pixmap);
    //ui->label->setScaledContents(true);
}

Widget::~Widget()
{
    delete ui;
}

3. 设置文本对齐、自动换行、缩进、边距

1. 创建四个 label,并且在 QFrame 中设置 frameShape 为 Box
   
2. 编写 widget.cpp, 给这四个 label 设置属性
   
3. 运行程序，查看结果

第⼀个 label 垂直⽔平居中

第⼆个 label 设置了 wordWrap, 能够⾃动换⾏

第三个 label 设置了 Indent, 左侧和上⽅和边框有间距. 右侧则没有.

第四个 label 设置了 margin, 四个⽅向均有间距(图上仅体现出三个⽅向, 下⽅看不出来)

文件代码：

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    // 设置⽂字居中对⻬
     ui->label->setAlignment(Qt::AlignHCenter | Qt::AlignVCenter);
     ui->label->setText("垂直水平居中的文本");
     // 设置⾃动换⾏
     ui->label_2->setAlignment(Qt::AlignTop | Qt::AlignLeft);
     ui->label_2->setWordWrap(true);
     ui->label_2->setText("在Qt中，QLabel是一个用于显示文本或图像的控件类。它可以显示静态文本，也可以显示包含格式和超链接的富文本。");
     // 设置⾸⾏缩进
     ui->label_3->setAlignment(Qt::AlignTop | Qt::AlignLeft);
     ui->label_3->setIndent(20);
     ui->label_3->setText("在Qt中，QLabel是一个用于显示文本或图像的控件类。它可以显示静态文本，也可以显示包含格式和超链接的富文本。");
     // 设置边距
     ui->label_4->setAlignment(Qt::AlignTop | Qt::AlignLeft);
     ui->label_4->setMargin(20);
     ui->label_4->setText("在Qt中，QLabel是一个用于显示文本或图像的控件类。它可以显示静态文本，也可以显示包含格式和超链接的富文本。");
}

Widget::~Widget()
{
    delete ui;
}

4. 设置伙伴（快捷键 &A 的使用）

1. 创建两个 label 和 两个 radioButton,如下图所示
   在把 label 中的⽂本设置为 “快捷键 &A” 这样的形式，在&后面的字符就是快捷键，可以通过alt+A的方式触发快捷键
2. 编写 widget.cpp, 设置 buddy 属性(也可以使⽤ Qt Designer 直接设置.)
3. 运行程序, 可以看到, 按下快捷键 alt + a 或者 alt + b, 即可选中对应的选项

文件代码：

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //设置label的伙伴
    ui->label->setBuddy(ui->radioButton);
    ui->label_2->setBuddy(ui->radioButton_2);
}

Widget::~Widget()
{
    delete ui;
}