QML类型:Text

一、描述

文本项继承自 Item 可以显示纯文本和富文本。

二、属性成员

1、bottomPadding : real

      leftPadding : real

      padding : real

      rightPadding : real

      topPadding : real

这些属性包含内容周围的填充。

除了 contentWidth contentHeight 之外,还保留了此空间。

2、effectiveHorizontalAlignment : enumeration - 查询Text 的有效水平对齐方式(只读属性)

      horizontalAlignment : enumeration - 水平对齐

      verticalAlignment : enumeration - 垂直对齐

设置文本项宽度和高度内文本的水平和垂直对齐方式

默认情况下,文本与顶部垂直对齐。水平对齐遵循文本的自然对齐方式,例如从左向右阅读的文本将向左对齐。

horizontalAlignment 的有效值为:

  • Text.AlignLeft
  • Text.AlignRight
  • Text.AlignHCenter
  • Text.AlignJustify

verticalAlignment 的有效值为:

  • Text.AlignTop
  • Text.AlignBottom
  • Text.AlignVCenter

请注意,对于单行文本,文本的大小就是文本的面积。在这种常见情况下,所有对齐都是等效的。如果希望文本在其父项中居中,那么需要修改 Item::anchors,或将水平对齐设置为 Text.AlignHCenter 并将宽度绑定到父项的宽度。

当使用附加属性 LayoutMirroring::enabled 来镜像应用程序布局时,文本的水平对齐也将被镜像。但是,horizo​​ntalAlignment 属性将保持不变。

3、advance : size

只读属性。从文本项第一个字符的基线原点到文本流中紧跟在此字符之后的字符的基线原点的距离(以像素为单位)。如果文本从右向左流动,则 advance 可能为负。

4、antialiasing : bool

用于决定文本是否应该使用抗锯齿。默认值为true。

只有 renderType 为 Text.NativeRendering 的 Text 才能禁用抗锯齿。

5、baseUrl : url

此属性指定用于解析文本中的相对 URL 的基本 URL。

Urls 被解析为与基本 URL 的目标位于同一目录中,这意味着路径的最后一个“/”之后的任何部分都将被忽略。

6、clip : bool

如果文本不适合边界矩形,文本是否被剪切。

    Text
    {
        y: 0
        width: 80
        height: 80
        text: " 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
    }
    Text
    {
        y: 80
        width: 80
        height: 80
        text: " 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:true
    }

7、color : color

文本颜色。

8、contentHeight : real、contentWidth : real

只读属性。文本宽高。

Window
{
    id:root;
    visible: true;
    width: 500;
    height: 500;

    Text
    {
        id:t1
        y: 0
        width: 80
        height: 80
        text: " 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
    }
    Text
    {
        id:t2
        y: 80
        width: 80
        height: 80
        text: " 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:true
    }


    MouseArea
    {
        width: root.width;
        height: root.height;
        onClicked:
        {
            console.log(t1.contentHeight + " " + t1.contentWidth);
            console.log(t2.contentHeight + " " + t2.contentWidth);
        }
    }
}

包括被裁剪的部分。

9、elide : enumeration

设置此属性以省略适合 Text 项目宽度的文本部分。仅当设置了显式宽度时,文本才会消失。

此属性不能用于富文本。

  • Text.ElideNone - 默认
  • Text.ElideLeft
  • Text.ElideMiddle
  • Text.ElideRight

如果此属性设置为 Text.ElideRight,则它可以与 wrapMode 一起使用。只有在设置了 maximumLineCount height 后,文本才会消失。

    Text
    {
        id:t1
        y: 0
        width: 80
        height: 80
        text: "哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
        elide:Text.ElideRight
    }
    Text
    {
        id:t2
        y: 80
        width: 80
        height: 80
        text: "哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
        elide:Text.ElideRight
        wrapMode:Text.WordWrap
    }
    Text
    {
        id:t3
        y: 160
        width: 80
        text: "哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
        elide:Text.ElideRight
        wrapMode:Text.WordWrap
    }
    Text
    {
        id:t4
        y: 360
        width: 80
        text: "哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈"
        clip:false
        elide:Text.ElideRight
    }

 

如果 maximumLineCount height 都被设置,则 maximumLineCount 将被应用。

10、font.bold : bool

设置字体粗细是否为粗体。

11、font.capitalization : enumeration

设置文本的大小写。

  • Font.MixedCase:不应用大小写更改。
  • Font.AllUppercase:所有字符以大写形式呈现。
  • Font.AllLowercase:所有字符以小写形式呈现。
  • Font.SmallCaps:所有字符以小型大写字母形式呈现。
  • Font.Capitalize:每个单词的第一个字符为大写字符。
    Text
    {
        y: 0
        text: "hell world"
        font.capitalization:Font.SmallCaps
        font.pixelSize: 30
    }
    Text
    {
        y: 80
        text: "hell world"
        font.capitalization:Font.AllUppercase
        font.pixelSize: 30
    }
    Text
    {
        y: 160
        text: "hell world"
        font.capitalization:Font.Capitalize
        font.pixelSize: 30
    }

12、font.family : string

设置字体的系列名称。

13、font.hintingPreference : enumeration

设置文本的首选提示。这是对底层文本渲染系统使用一定级别的提示,并且跨平台具有不同的支持。

此属性仅在 renderType 设置为 Text.NativeRendering 时才有效。

  • Font.PreferDefaultHinting:使用目标平台的默认提示级别。
  • Font.PreferNoHinting:如果可能,在字形轮廓无提示的情况下渲染文本。文本布局在排版上将是准确的,使用与所使用的相同的指标,例如打印时。
  • Font.PreferVerticalHinting:如果可能,渲染没有水平提示的文本,但将字形与垂直方向的像素网格对齐。在密度太低而无法准确呈现字形的显示器上,文本会显得更清晰。但由于字形的水平度量没有暗示,文本的布局将可扩展到更高密度的设备(如打印机),而不会影响换行等细节。
  • Font.PreferFullHinting:如果可能,在水平和垂直方向都带有提示的文本。文本将被更改以优化目标设备上的易读性,但由于指标将取决于文本的目标大小,字形、换行符和其他印刷细节的位置不会缩放,这意味着文本布局可能看起来在具有不同像素密度的设备上有所不同。

14、font.italic : bool

字体是否具有斜体样式。

15、font.kerning : bool

在塑造文本时启用或禁用字距调整 OpenType  功能。禁用此功能可能会提高创建或更改文本时的性能,但会牺牲一些装饰功能。默认值是true。

16、font.letterSpacing : real

设置字体的字母间距。字母间距更改字体中各个字母之间的默认间距。

正值增加相应像素的字母间距;负值会减小间距。

17、font.pixelSize : int

以像素为单位设置字体大小。

使用此函数使字体设备依赖。使用 pointSize 以独立于设备的方式设置字体的大小。

18、font.pointSize : real

以磅为单位设置字体大小。必须大于零。

19、font.preferShaping : bool

在一些书写系统中,例如婆罗门文字,为了使文本清晰可辨,字体会将复杂的规则应用于一组字符以正确显示它们。将 preferredShaping 属性设置为 false 将在不需要时禁用所有此类功能,这将在大多数情况下提高性能。默认为true。

20、font.strikeout : bool

字体是否具有删除线样式。

21、font.styleName : string

设置字体的样式名称。不区分大小写。 如果设置,字体将与样式名称匹配。

22、font.underline : bool

文本是否带有下划线。

23、font.weight : int

请求的字体粗细。

必须是 1 到 1000 之间的整数,或预定义值之一:

  • Font.Thin
  • Font.Light
  • Font.ExtraLight
  • Font.Normal - 默认
  • Font.Medium
  • Font.DemiBold
  • Font.Bold
  • Font.ExtraBold
  • Font.Black

24、font.wordSpacing : real

设置字体的字间距。更改单个单词之间的默认间距。

正值将字间距增加相应数量的像素,而负值则相应地减小字间距。

25、fontInfo.family : string

        fontInfo.pixelSize : string

        fontInfo.pointSize : string

        fontInfo.styleName : string

        fontInfo.weight : int

        fontInfo.bold : bool

        fontInfo.italic : bool

当前字体的系列名称、像素大小、点大小、样式名称、权重、是否粗体、是否斜体。

26、fontSizeMode : enumeration

指定如何确定显示文本的字体大小。对于富文本无效。

  • Text.FixedSize:(默认)使用 font.pixelSizefont.pointSize 指定的大小。
  • Text.HorizontalFit :使用最大尺寸,不超过指定的尺寸,适合项目的宽度,无需环绕。
  • Text.VerticalFit:使用适合项目高度的指定尺寸的最大尺寸。
  • Text.Fit:使用适合项目宽度和高度的指定尺寸的最大尺寸。

拟合文本的字体大小具有:

  • minimumPointSize minimumPixelSize 属性指定的最小边界
  • font.pointSizefont.pixelSize 属性指定的最大边界。

如果文本不适合具有最小字体大小的项目边界,则文本将根据 elide 属性被省略。

27、hoveredLink : string

当用户将鼠标悬停在嵌入在文本中的链接时,此属性包含链接字符串。链接必须是富文本或 HTML 格式,并且 hoveredLink 字符串提供对特定链接的访问。

28、lineCount : int

返回文本项中可见的行数。富文本不支持此属性。

29、lineHeight : real

设置文本的行高。该值可以是像素或乘数,具体取决于 lineHeightMode

默认值为 1.0 的乘数。行高必须是正值。

30、lineHeightMode : enumeration

此属性确定如何指定行高。

  • Text.ProportionalHeight:(默认)设置与行成比例的间距(作为乘数)。
  • Text.FixedHeight:将行高设置为固定行高(以像素为单位)。

31、linkColor : color

文本中链接的颜色。不适用于富文本。

32、maximumLineCount : int

文本项将显示的最大行数。富文本不支持此属性。

33、minimumPixelSize : int

此属性指定由 fontSizeMode 属性缩放的文本的最小字体像素大小。

如果 fontSizeMode 为 Text.FixedSize 或 font.pixelSize 为 -1,则忽略此属性。

34、minimumPointSize : int

此属性指定由 fontSizeMode 属性缩放的文本的最小字体点大小。

如果 fontSizeMode 为 Text.FixedSize 或 font.pointSize 为 -1,则忽略此属性。

35、renderType : enumeration

覆盖此组件的默认呈现类型。

支持的渲染类型有:

  • Text.QtRendering
  • Text.NativeRendering

如果希望文本在目标平台上看起来是原生的,并且不需要文本转换等高级功能,请选择 Text.NativeRendering。

36、renderTypeQuality : int

覆盖此组件的默认渲染类型质量。这是一种低级定制,在大多数情况下可以忽略。 目前只在 renderType 为 Text.QtRendering 时有效。

Text.QtRendering 使用的光栅化算法可能会在大文本尺寸下产生伪影,例如尖角看起来比应有的更圆。如果这是特定文本项的问题,请增加 renderTypeQuality 以提高渲染质量,但会消耗内存。

renderTypeQuality 可以是大于 0 的任何整数,或以下预定义值之一

  • Text.DefaultRenderTypeQuality(默认)= -1
  • Text.LowRenderTypeQuality = 26
  • Text.NormalRenderTypeQuality = 52
  • Text.HighRenderTypeQuality = 104
  • Text.VeryHighRenderTypeQuality = 208

37、style : enumeration

设置附加文本样式。

  • Text.Normal - 默认
  • Text.Outline
  • Text.Raised
  • Text.Sunken
    Row
    {
        Text { font.pointSize: 24; text: "测试Normal "; styleColor: "red" }
        Text { font.pointSize: 24; text: "测试Raised "; style: Text.Raised; styleColor: "red" }
        Text { font.pointSize: 24; text: "测试Outline ";style: Text.Outline; styleColor: "red" }
        Text { font.pointSize: 24; text: "测试Sunken"; style: Text.Sunken; styleColor: "red"  }
    }

38、styleColor : color

文本样式使用的辅助颜色。用作轮廓文本的轮廓颜色,以及凸起或凹陷文本的阴影颜色。

39、text : string

要显示的文本。

40、textFormat : enumeration

显示文本属性的格式。

支持的文本格式有:

  • Text.AutoText:默认值,自动检测
  • Text.PlainText:纯文本
  • Text.StyledText:富文本, HTML 3.2。
  • Text.RichText:富文本,HTML 4
  • Text.MarkdownText

41、truncated : bool

文本是否由于 maximumLineCount elide 被截断。富文本不支持此属性。

42、wrapMode : enumeration

换行模式。只有在设置了明确的宽度时,文本才会换行

  • Text.NoWrap:默认值。不换行。必要时 contentWidth 会超过文本项设置的宽度。
  • Text.WordWrap:仅在单词边界上换行。必要时 contentWidth 会超过文本项设定的宽度。
  • Text.WrapAnywhere:换行可能在一行上的任何点进行(即使在单词的中间)。
  • Text.Wrap:如果可能,在单词边界处换行;否则换行可能在一行上的任何点进行。

三、信号成员

1、lineLaidOut(object line)

为在 Text.PlainText Text.StyledText 模式的布局过程中布局的每一行文本发出此信号。

Text.RichText 模式不会发出。

参数中的线对象提供有关当前正在布置的线的更多详细信息。可通过它设置线属性。

指定线对象的属性为:

  • number:(只读)行号,从零开始。
  • x:指定行在 Text 元素内的 x 位置。
  • y:指定行在 Text 元素内的 y 位置。
  • width:指定线条的宽度。
  • height:指定线的高度。
  • implicitWidth:(只读) 该行根据其内容自然占据的宽度。
  • isLast:(只读)该行是否为最后一行。

将 Text 项的前 5 行向右移动 100 像素:

    Text
    {
        id:text
        y: 0
        text: "时间会刺破青春表面的彩饰,会在美人的额上掘深沟浅槽;会吃掉稀世之珍!天生丽质,什么都逃不过他那横扫的镰刀。"
        width: 200
        wrapMode:Text.WordWrap
        font.pixelSize: 30

        onLineLaidOut:
        {
            if (line.number < 5)
            {
                line.x = line.x + 100
                line.width = line.width - 100
            }
        }
    }

2、linkActivated(string link)

当用户单击嵌入在文本中的链接时,会发出此信号。链接必须是富文本或 HTML 格式,并且链接字符串提供对特定链接的访问。

    Text
    {
        id:text
        font.pixelSize: 30
//        textFormat: Text.RichText
        text: "<a href=\"https://www.baidu.com\">百度</a>"
        onLinkActivated:
        {
            console.log("点击 " + link)
        }
    }

3、linkHovered(string link)

当用户悬停嵌入在文本中的链接时会发出此信号。链接必须是富文本或 HTML 格式,并且链接字符串提供对特定链接的访问。鼠标进入超链接文本和退出超链接文本都会发出此信号。

    Text
    {
        id:text
        font.pixelSize: 30
//        textFormat: Text.RichText
        text: "<a href=\"https://www.baidu.com\">百度</a>"
        onLinkHovered:
        {
            console.log("悬浮 " + link)
        }
    }

四、成员函数

1、forceLayout()

触发显示文本的重新布局。

Window
{
    id:root;
    visible: true;
    width: 500;
    height: 500;

    Text
    {
        id:text
        font.pixelSize: 30
        text: "黄河之水天上来"
        onLineLaidOut:
        {
            console.log("文本重新布局了")
        }
    }

    MouseArea
    {
        width: root.width;
        height: root.height;
        onClicked:
        {
            text.forceLayout()
        }
    }
}

2、linkAt(real x, real y)

返回内容坐标中点 x、y 处的链接字符串,如果该点不存在链接,则返回空字符串。

    Text
    {
        id:text
        font.pixelSize: 30
        text: "<a href=\"https://www.baidu.com\">黄河之水天上来</a>"
    }

    MouseArea
    {
        width: root.width;
        height: root.height;
        onClicked:
        {
            console.log(text.linkAt(mouse.x,mouse.y))
        }
    }
  • 6
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值