QML基本可视化元素--Text

一个Text项目可以显示纯文本或者富文本

1.     可以使用Html标记：text: “<b>HELLO</b>”

2.     宽度和高度（width, height）:没有指定，会自己尝试需要多大的空间并依此来设置。

3.     换行：wrapMode属性，没有设置，则单行

4.     省略：elide属性。宽度不足显示文本，显示为省略号，省略样式：前(Text.ElideLeft)，中(Text.ElideMiddle)，后(Text.ElideRight)，默认(Text.ElideNone)

5.     字体：font

font.blod: true—加粗，false

font.capitalization: 大写策略

         Font.MixedCase: 默认不改变，

         Font.AllUppercase: 全部大写

         Font.AllLowercase: 全部小写

         Font.SmallCaps: 小型大写字母（即小写字母变为大写但不改变大小）

         Font.Capitalize: 将首字母大写

font.family: 字体族，字体族的名字（区分大小写）

font.italic: 是否斜体 true—false

font.letterSpacing: 字符间距，正值加大，负值减小

font.pixelSize: 字体大小（单位为像素，依赖于设备）

font.pointSize: 字体大小（大于0的值，与设备无关）

font.strikeout: 是否有删除线 true—false

font.underline: 是否有下滑线 true—false

font.weight: 字体重量—Font.Light,Font.Normal(默认), Font.DemiBold,font.Bold, Font.Black

font.wordSpacing: 单词间距，正值加大，负值减小

加载字体：指定一个字体的名称，或者是一个URL，也就是说可以指定网络上的一个字体文件。

[html] view plain copy print ?

1. import QtQuick 1.0  
2. Column {  
3.     FontLoader {id: fixedFont; name: "Courier"}  
4.     FontLoader {id: webFont; source: "http://www.mysite.com/mfont.ttf"}  
5.     Text{text: "Fixed - size font"; font.family: fixedFont.name}  
6.     Text{text: "Fancy font"; font.family: webFont.name}  
7. }  

import QtQuick 1.0
Column {
	FontLoader {id: fixedFont; name: "Courier"}
	FontLoader {id: webFont; source: "http://www.mysite.com/mfont.ttf"}
	Text{text: "Fixed - size font"; font.family: fixedFont.name}
	Text{text: "Fancy font"; font.family: webFont.name}
}

6.     对齐方式：

horizontalAlignment：水平对齐方式

         Text.AlignLeft,Text.AlignRight, Text.AlignHCenter

verticalAlignment: 垂直对齐方式

         Text.AlignTop,Text.AlignBottom, Text.AlignVcenter

7.     文本样式 style

Text.Normal, Text.OutLine, Text.Raised, Text.Sunken

[html] view plain copy print ?

1. import QtQuick 1.0  
2.   
3. Row {  
4.     Text {font.pontSize: 24; text: "Normal"}  
5.     Text {font.pontSize; 24; text: "Raised"; Style: Text.Raised; styleColor: "#AAAAAA"}  
6.     Text {font.pointSize: 24; text: "Outline"; style: Text.Outline; styleColor; "red"}  
7.     Text {font.pointSize; 24; text: "Sunken"; text: "Outline"; style: Text.Outline; styleColor: "#AAA"}  
8. }  

import QtQuick 1.0

Row {
	Text {font.pontSize: 24; text: "Normal"}
	Text {font.pontSize; 24; text: "Raised"; Style: Text.Raised; styleColor: "#AAAAAA"}
	Text {font.pointSize: 24; text: "Outline"; style: Text.Outline; styleColor; "red"}
	Text {font.pointSize; 24; text: "Sunken"; text: "Outline"; style: Text.Outline; styleColor: "#AAA"}
}

8.     文本换行：wrapMode属性，自动换行。只有在明确设置Text的width属性时换行才会起作用。

Text.NoWrap：默认，不换行

Text: WordWrap: 在单词边界进行换行

Text.WrapAnywhere: 任意位置换行，不管单词

Text.Wrap: 尽可能在单词边界换行，否则任意点换行

9.     链接信号

Text::onLinkActived(string link)处理器，在用户单击文本中嵌入一个链接时被调用。链接必须在富文本或者HTML格式中，而函数中link字符串提供了被单击的可以访问的特定链接。

[html] view plain copy print ?

1. import QtQuick 1.0  
2.   
3. Textt {  
4.     textFormat: Text.RichText  
5.     text: "The main website is at <a href = \ "http://qt.nokia.com\"> Nokia Qt DF</a>."  
6.     onLinkActivated: console.log(link + " link activated")  
7. }  

转自：http://blog.csdn.net/u012419303/article/details/45377387