Qt之QLabel

Posted zhchoutai

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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);

使用样式表来控制(水平居右、垂直居下):

setStyleSheet("qproperty-alignment: ‘AlignBottom | AlignRight‘;");

自己主动换行

假设文本过长,我们能够採用自己主动换行的方式来显示。

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);

非常easy就一段代码。我们能够打开源代码瞅瞅,到底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,技多不压身。。

。上面的内容虽多,但都非常easy,也非常重要。所以都须要掌握,我们不仅仅是Qter。我们更是工匠-精益求精、严谨、耐心。专注,坚持。

以上是关于Qt之QLabel的主要内容,如果未能解决你的问题,请参考以下文章

QT软件开发之基础控件--2.5.1 QLabel标签

Qt 之 QPixmap

Qt点击QLabel控件触发CLICK事件

Qt Stylesheet 影响整个小部件

在 Qt 上使用看门狗更改 QLabel 文本

如何将 QLabel 放入切换按钮 Qt c++