Qt之QLabel

简介:

简述

QLabel提供了一个文本或图像的显示,没有提供用户交互功能。

一个QLabel可以包含以下任意内容类型:

内容 设置
纯文本 使用setText()设置一个QString
富文本 使用setText()设置一个富文本的QString
图像 使用setPixmap()设置一个图像
动画 使用setMovie()设置一个动画
数字 使用setNum()设置int或double,并转换为纯文本。
Nothing 空的纯文本,默认的,使用clear()设置

纯文本

显示

这里写图片描述

首先我们构造一个QLabel对象,其中this为其所在的父窗体。通过调用setText可以为标签设置文本(Hello World),这时标签就可以正常显示出来了。为了显示更佳的效果,我们可以通过调用setStyleSheet来设置样式。color: white-顾名思义,就是为标签设置一个文本色(白色)。

QLabel *pLabel = new QLabel(this);
pLabel->setText("Hello World");
pLabel->setStyleSheet("color: white");

对齐方式

默认的标签文本对齐方式为:左对齐、垂直居中,我们可以通过setAlignment来设置,包括:左、上、右、下、居中对齐,一般情况,我们会进行两两组合(水平方向、垂直方向)。比如:居中对齐

setAlignment(Qt::AlignCenter);

自动换行

如果文本过长,我们可以采用自动换行的方式来显示。

setWordWrap(true);

这里写图片描述

注意:当使用英文的时候,如果写为类似形式”abcdefghijklmnopqrstuvwxyz”则是不能换行的,why?因为中间没有空格,所以需要写为”abcde fghij klmno pqrst uvwxyz”。

设置行高

一般情况下,自动换行之后文本上下行会距离比较近,我们可以通过下面方式来设置行高。

pLabel->setWordWrap(true);
QString strText = QStringLiteral("一去二三里,烟村四五家。亭台六七座,八九十枝花。");
QString strHeightText = "<p style=\"line-height:%1%\">%2<p>";
strText = strHeightText.arg(150).arg(strText);
pLabel->setText(strText);

省略

如果过长,我们又不想换行,只想把其中一部分省略为…,那么我们可以通过QFontMetrics来实现,这里先不介绍QFontMetrics,感兴趣的童鞋可以先自行研究。

这里写图片描述

QString strText = QStringLiteral("一去二三里,烟村四五家。亭台六七座,八九十枝花。");
QString strElidedText = pLabel->fontMetrics().elidedText(strText, Qt::ElideRight, 200, Qt::TextShowMnemonic);
pLabel->setText(strElidedText);

垂直显示

默认情况下,文本显示方式为水平方向,如果我们需要在垂直方向上显示,需要用一些小技巧来处理。

这里写图片描述

QString strText = QStringLiteral("一去二三里,烟村四五家。");
pLabel->setText(strText.split("", QString::SkipEmptyParts).join("\n"));
pLabel->setAlignment(Qt::AlignCenter);

富文本

我们可以在助手中查找关于Using HTML Markup in Text Widgets的资料,查看Qt支持哪些HTML标记。

下面我们来写一段HTML代码,O(∩_∩)O哈哈~。。。显示不同颜色的文本以及图片

这里写图片描述

QString strHTML = QString("<html> \
                           <head> \
                           <style> \
                           font{color:white;} #f{font-size:18px; color: green;} \
                           </style> \
                           </head> \
                           <body>\
                           <font>%1</font><font id=\"f\">%2</font> \
                           <br/><br/> \
                           <img src=\":/Images/logo\" width=\"100\" height=\"100\"> \
                           </body> \
                           </html>").arg("I am a ").arg("Qter");
pLabel->setText(strHTML);
pLabel->setAlignment(Qt::AlignCenter);

是不是很神奇?经常我们要用好几个控件来组合才能实现的功能,就仅仅几行HTML代码就搞定了。。。何乐而不为!

图像

首先我们构建一个QPixmap来作为显示的图片,然后设置标签的大小,可以通过setScaledContents按比例缩放图片达到理想的效果。

这里写图片描述

QPixmap pixmap(":/Images/logo");
pLabel->setPixmap(pixmap);
pLabel->setFixedSize(100, 100);
pLabel->setScaledContents(true);

动画

这里我们需要使用另外一个类QMovie来控制动画,start()可以进行播放与stop()则可以停止,也可以通过调用setSpeed()来设置动画的播放速度。

这里写图片描述

QMovie *pMovie = new QMovie(":/Images/movie");
pLabel->setMovie(pMovie);
pLabel->setFixedSize(135, 200);
pLabel->setScaledContents(true);
pMovie->start();

数字

如果我们需要显示一个数字,则可以调用setNum(),他可以将内容转换为纯文本。

pLabel->setNum(66.6);

很简单就一段代码,我们可以打开源码瞅瞅,究竟setNum是如何实现的。

void QLabel::setNum(int num)
{
    QString str;
    str.setNum(num);
    setText(str);
}

就三行代码,呵呵哒。。。超简单吧,我们要有一颗随时看源码的心!

超链接

我们需要简单使用标签<a></a>写一段简单的HTML超链接代码

方法一

比较简单,直接调用setOpenExternalLinks(true)即可。

pLabel->setText(QString("<a href = \"%1\">%2</a>").arg("http://blog.csdn.net/liang19890820").arg(QStringLiteral("一去丶二三里")));
pLabel->setOpenExternalLinks(true);

方法二

声明一个槽openUrl,将其与linkActivated信号关联。

pLabel->setText(QString("<a href = \"%1\">%2</a>").arg("http://blog.csdn.net/liang19890820").arg(QStringLiteral("一去丶二三里")));
connect(pLabel, SIGNAL(linkActivated(QString)), this, SLOT(openUrl(QString)));

void MainWindow::openUrl(const QString &link)
{
    QDesktopServices::openUrl(QUrl(link));
}

总结

通过上面的学习,我们基本将标签的大部分用法都分享了,可以看出HTML、CSS的重要性,所以无论你现在所从事的工作是什么,或者以后做什么,我都建议好好研究下Web,技多不压身。。。上面的内容虽多,但都很简单,也很重要,所以都需要掌握,我们不只是Qter,我们更是工匠-精益求精、严谨、耐心,专注,坚持。

相关文章
|
20天前
Qt之使用图片填充QLabel
Qt之使用图片填充QLabel
17 1
|
5月前
21 QT - QLabel控件使用
21 QT - QLabel控件使用
28 0
Python Qt GUI设计:QLabel标签类(基础篇—11)
Python Qt GUI设计:QLabel标签类(基础篇—11)
Python Qt GUI设计:QLabel标签类(基础篇—11)
|
算法
Qt [GC9-18]:液晶仪表素材准备及转速表和速度表实现 Qlabel绘制图形
Qt [GC9-18]:液晶仪表素材准备及转速表和速度表实现 Qlabel绘制图形
189 0
Qt [GC9-18]:液晶仪表素材准备及转速表和速度表实现 Qlabel绘制图形
Qt QLabel 播放GIF动画
很久以前用过,不过慢慢的不用了,就慢慢的忘记了,今天拾起来,记录一下,以后用的时候可以翻一下
309 0
Qt QLabel 播放GIF动画
|
1月前
|
网络协议 C++
C++ Qt开发:QTcpSocket网络通信组件
`QTcpSocket`和`QTcpServer`是Qt中用于实现基于TCP(Transmission Control Protocol)通信的两个关键类。TCP是一种面向连接的协议,它提供可靠的、双向的、面向字节流的通信。这两个类允许Qt应用程序在网络上建立客户端和服务器之间的连接。Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍如何运用`QTcpSocket`组件实现基于TCP的网络通信功能。
37 8
C++ Qt开发:QTcpSocket网络通信组件
|
13天前
|
图形学 Python 容器
【PyQt5桌面应用开发】3.Qt Designer快速入门(控件详解)
【PyQt5桌面应用开发】3.Qt Designer快速入门(控件详解)
32 0
|
22天前
qt开发使用camera类获取摄像头信息并拍照保存
qt开发使用camera类获取摄像头信息并拍照保存
|
1月前
|
监控 C++
C++ Qt开发:QProcess进程管理模块
Qt是一个跨平台的C++图形库,简化了窗体应用开发,支持通过拖放组件提升效率。本章节关注`QProcess`组件,它用于控制和管理进程,例如执行命令、运行可执行文件及与外部进程通信。`QProcess`提供多种方法如`start`、`waitForStarted`和`waitForFinished`等,实现启动、监控和交互。示例展示了如何使用`QProcess`获取系统进程和信息,通过`tasklist`和`systeminfo`命令,并将结果展示在`QTreeWidget`中。
28 0
C++ Qt开发:QProcess进程管理模块