上章学习链接:14.Quick QML-TextInput和TextField详解
1.TextEdit
和TextInput类似,但是它可以设置背景色.并且也可以多行,并且还可以支持富文本输入,由于它的很多属性和TextInput类似,所以类似的属性我们就不描述了,这里我们只学习TextEdit的新属性:
- contentHeight : real,返回当前整个文本的高度(包括多行)
- contentWidth : real,返回当前整个文本的宽度(取最长一行的宽度)
- lineCount : int,返回当前共有多少行
- wrapMode: 设置换行模式,取值有以下几种
- TextEdit.NoWrap -不自动换行,如果不是自己换行的话,实际上显示的宽度将超过设置的宽度(默认值)
- TextEdit.WordWrap -如果超出设置的宽度,则在单词之间换行,如果一个单词始终没结束,则始终不换行
- TextEdit.WrapAnywhere -只要超出设置的宽度,则立马换行.
- TextEdit.Wrap -换行尽量发生在单词边界;否则,换行将发生在行上的适当点,甚至在单词的中间。
- textDocument : TextDocument.返回此文本编辑的QQuickTextDocument。它可用于使用QSynax高亮器实现语法高亮显示
- textFormat : enumeration,文本格式,默认为纯文本(TextEdit.PlainText),也可以设置为自动检测(TextEdit.AutoText)、富文本(TextEdit.RichText)
Signals
- editingFinished() : 当文本编辑失去焦点时,将发出此信号
- linkActivated(link) : 当鼠标点击链接时,将发出此信号
- linkHovered(link) : 当鼠标徘徊在链接上时,将发出此信号
示例如下所示:
TextEdit { 100 text: "See the <a href="http://qt-project.org">Qt Project website</a>." textFormat: TextEdit.AutoText onLinkActivated: { console.log(link) Qt.openUrlExternally(link) } }
2.TextArea
和TextField一样的道理,就是比TextEdit多了可以设置颜色和背景之类的东西.
示例如下所示:
TextArea { 240 height: 200 text: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, " + "sed do eiusmod tempor incididunt ut labore et dolore magna " + "aliqua. Ut enim ad minim veniam, quis nostrud exercitation " + "ullamco laboris nisi ut aliquip ex ea commodo cosnsequat. "; style: TextAreaStyle { backgroundColor: "aliceblue" textColor: "black" font.pixelSize: 18 selectedTextColor: "red" selectionColor: "blue" } }
效果如下: