Qt文档阅读笔记-Text QML Type官方解析及实例

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq78442761/article/details/86485248

目录

 

 

官方解析

博主例子

---

 

官方解析

Text能够展示纯文本和富文本。举个例子，红色文本以及指定的字体和大小

  Text {
      text: "Hello World!"
      font.family: "Helvetica"
      font.pointSize: 24
      color: "red"
  }

富文本是使用HTML风格：

  Text {
      text: "<b>Hello</b> <i>World!</i>"
  }

如果height和width未被指定，Text将会尝试设置需要多长。除非设置了wrapModel，这通常是设置宽度而不是高度（当所有文本在一行的时候）。
elide属性可以设置单行文本的宽度。
注意Supported HTML Subset是被限制的。如果一个text中包含了HTML图片标签，文本数据将会被重写加载。
Text提供了read-only属性，如果要editable的文本要查看TextEdit

博主例子

这里补充官方的例子，以及获取网络Img图片

运行截图如下：

程序结构如下：

源码如下：

main.cpp

#include <QApplication>
#include <QQmlApplicationEngine>
#include <QDebug>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl("qrc:/main.qml"));

    if(engine.rootObjects().isEmpty()){

        qDebug() << "engine load failed!";
        return -1;
    }

    return a.exec();
}

main.qml

import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow {

    visible: true
    width: 400
    height: 300

    Text {

        text: "Hello World!"
        font.family: "Helvetica"
        font.pointSize: 24
        color: "red"
        anchors.centerIn: parent
    }

//    Text {

//        text: "<b>Hello</b> <i>World!</i>"
//        font.pointSize: 24
//        anchors.centerIn: parent
//    }

//    Text {

//        //text: "<img src = \"http://avatar.csdn.net/9/F/0/2_u014597198.jpg\">"
//        text: "<img src=\"https://avatar.csdn.net/E/5/8/3_qq78442761.jpg\" class=\"avatar_pic\">"
//        anchors.centerIn: parent
//    }

}