一、Textinput

Textinput 用于编辑一行文本,类似于 QLineEdit。

  • font 分组属性允许你设置 Textlnput 元素所用字体的各种属性,包括字体族(family)、大 小(pixelSize、pointSize)、粗细(bold、weight)、斜体(italic)、下画线(underline)等。

  • 还有一些属性与 Text 元素一样,如 text 属性可以设置或获取元素的文本,horizontalAlignment 和 verticalAlignment 用于设定文本对齐方式,wrapMode 设置文本超过控件宽度时的换行策略,color 设置文字颜色,contentWidth、contentHeight 返回文本的宽、高。

  • length 属性返回编辑框内的字符个数。maxinumiLength 设置编辑框允许输入的字符串的最大长度, 超过这个长度就会被截断。

  • 假如你想使用 Textlnput 来输入密码,可以设置 echoMode 属性为 Textlnput.Password、 Textlnput.PasswordEchoOnEdit 或 Textlnput.NoEcho,而 echoMode 默认为 Textlnput.Normal, 即输入什么显示什么。如果 echoMode 不为 Textlnput.Normal,那么 displayText 属性就保存显示给用户的文本,而 text 属性则保存实际输入的文本,比如你设定 passwordCharacter 为 "*", echoMode 为 Textlnput.Password,那么 displayText 属性内保存的就是一串 "*"。

Textlnput 还支持粘贴、撤销、重做、滚动等特性。不过,Textlnput不支持使用HTML标记的富文本。

Textinput 同时也支持适应 validator 或 inputMask 对输入文本做范围限制,也可以设置 echoMode 实现密码框的效果。

  • inputMask 是个字符串,用来限制你可以输入的字符。掩码串内包含允许的字符和分隔符,后面还可以跟一个可选的分号,以及一个用于补空白的字符。举个简单的例子,你想让用户输入类似于 "2014-01-30" 这种格式的日期, 可以将 inputMask 设置为 "0000-00-00"。

  • Textlnput 目前支持 IntValidator、DoubleValidator、RegExpValidator,如果你设置了 validator属性,那么用户就只能输入符合 validator 所界定范围的字符。

  • IntValidator 可以设置一个整数范围,top、bottom 设定最大值、最小值,不设置的话使用整型的最大值、最小值。

  • RegExpValidator 让我们提供一个正则表达式作为验证器。

当用户按了回车键或确认键,或者编辑框失去焦点时,会发出 accepted 和 editingFinished 信号,开发者可以实现 onAccepted 和 onEditingFinished 信号处理器来处理。需要注意的是, 如果你设置了 inputMask 或 validator,那么只有在编辑框内的文本符合限制条件时这两个信号才会触发。

TextInput 除了显示光标和文本外,默认并没有边框等装饰性效果,所以在使用时一般要为其添加一个可视化的外观。 示例代码如下:

import QtQuick 2.2
import QtQuick.Window 2.0 Window {
visible: true
width: 320
height: 240 Row {
spacing: 10
anchors.centerIn: parent Text {
text: qsTr("请输入密码:");
font.pointSize: 15;
verticalAlignment: Text.AlignVCenter
} Rectangle {
width: 100
height: 24
color: "lightgrey"
border.color: "grey" TextInput {
anchors.fill: parent
anchors.margins: 2
font.pointSize: 15
focus: true
onAccepted: console.log("accepted")
}
}
}
}

执行后的效果图如下:

二、TextEdit

TextEdit 是 Qt Quick 提供的多行文本编辑框,它的大多数属性与 Textinput 类似,不同之处在于,TextEdit 用来显示多行的可编辑的格式化文本,它既可以显示纯文本也可以显示富文本。如下面的代码所示:

import QtQuick 2.2
import QtQuick.Window 2.0 Window {
visible: true
width: 320
height: 240 Column {
anchors.centerIn: parent Rectangle {
width: 120
height: 100
color: "lightgrey"
border.color: "grey" TextEdit {
id : textEdit
width: 100
height: 100
font.pointSize: 20
color: "blue"
focus: true
}
}
}
}

执行后的效果图如下:

参考:

《Qt Quick核心编程》第9章

QML学习(五)—<TextInput和TextEdit输入栏>

Qt Quick 常用元素:Textinput 与 TextEdit 文本编辑框的更多相关文章

  1. Qt Quick 常用元素:RadioButton(单选框),CheckBox(复选框) 与 GroupBox(分组框)

    先介绍一下 ExclusiveGroup. ExclusiveGroup (互斥分组)本身是不可见元素,用于将若干个可选择元素组合在一起, 供用户选择其中的一个选项.你可以在 ExclusiveGro ...

  2. Qt Quick 常用元素:TabView(选项卡) 与 Slider(滑块)

    一.TabView TabView 可以实现类似 Windows 任务管理器的界面,有人叫 TabView 为标签控件,有人又称之为选项卡控件,我们知道它就是这么个东西就行了.现在来介绍 TabVie ...

  3. Qt Quick 常用元素:ComboBox(下拉列表) 与 ProgressBar(进度条)

    一.ComboBox ComboBox,即下拉列表框,由一个列表框和一个标签控件(或编辑控件)组成.ComboBox 的下拉列表是使用 Menu 实现的,列表内的每个条目对应一个 Menultem. ...

  4. qt quick中qml编程语言

    Qt QML 入门 — 使用C++定义QML类型 发表于 2013 年 3 月 11 日   注册C++类 注册可实例化的类型 注册不实例化的QML类型 附带属性 注册C++类 注册可实例化的类型 如 ...

  5. Qt 学习之路 :Qt Quick Controls

    自 QML 第一次发布已经过去一年多的时间,但在企业应用领域,QML 一直没有能够占据一定地位.很大一部分原因是,QML 缺少一些在企业应用中亟需的组件,比如按钮.菜单等.虽然移动领域,这些组件已经变 ...

  6. Qt 5入门指南之Qt Quick编程示例

    编程示例 使用Qt创建应用程序是十分简单的.考虑到你的使用习惯,我们编写了两套教程来实现两个相似的应用程序,但是使用了 不同的方法.在开始之前,请确保你已经下载了QtSDK的商业版本或者开源版本,并且 ...

  7. 《Qt Quick 4小时入门》学习笔记2

    http://edu.csdn.net/course/detail/1042/14805?auto_start=1   Qt Quick 4小时入门 第五章:Qt Quick基本界面元素介绍   1. ...

  8. Qt Quick里的图形效果:阴影(Drop Shadow)

    Qt Quick提供了两种阴影效果: DropShow,阴影.这个元素会根据源图像,产生一个彩色的.模糊的新图像,把这个新图像放在源图像后面,给人一种源图像从背景上凸出来的效果. InnerShado ...

  9. Qt Quick 简单教程

    上一篇<Qt Quick 之 Hello World 图文详解>我们已经分别在电脑和 Android 手机上运行了第一个 Qt Quick 示例—— HelloQtQuickApp ,这篇 ...

随机推荐

  1. Elasticsearch 在业界的大量应用案例

    国内现在有大量的公司都在使用 Elasticsearch,包括携程.滴滴.今日头条.饿了么.360安全.小米.vivo等诸多知名公司.

  2. IIS_CVE-2015-1635-HTTP.SYS远程执行代码漏洞复现

    CVE-2015-1635-HTTP.SYS远程执行代码漏洞复现 一.漏洞描述 远程执行代码漏洞存在于 HTTP 协议堆栈 (HTTP.sys) 中,当 HTTP.sys 未正确分析经特殊设计的 HT ...

  3. SqlServer 创建数据库两种方式

    一个SqlServer 数据库实例大概可以创建三万多个数据库. 创建数据库的第一种方式:SqlServer Management Studio管理工具进行可视化创建. 1).打开数据库管理工具,在&q ...

  4. java socket通信:聊天器(1)

    目的:实现多个客户之间的通信 首先,这个聊天器的框架是这样的: 对于服务器端:建立socket,连接到服务器,并且开始监听. import java.io.*; import java.util.Ar ...

  5. String.trim()源码解析

    trim()这个方法一般用来消除字符串两边的空格,但是内部是如何实现的呢? 附上源码: public String trim() { int len = value.length; int st = ...

  6. windows7系统 执行应用程序报 Error accessing specified device (Error: 2)

    --------------------------- ---------------------------Error accessing specified device (Error: 2) - ...

  7. 用实力燃爆暑期丨i春秋渗透测试工程师线下就业班开课了!

    i春秋&赛虎暑期渗透测试工程师线下就业班开课了! 本期开班地点:北京,面授脱产:四个月. 如果这次没来得及报名的同学也可以选择9月份广州的班次,具体开班时间请咨询谢老师:18513200565 ...

  8. cent OS 7 安装谷歌浏览器

    我直接写一个shell 脚本,  install_google.sh,  bash 命令直接运行就好, 脚本内容如下: (切换root用户执行) set -e  # 出错即退出 echo " ...

  9. xcodeinstruments 内存检测

    http://blog.csdn.net/totogo2010/article/details/8233565

  10. X264-应用工程

    接下来的几篇博客中,具体学习下X264的实现过程. 源代码的分析参考了雷神的博客,感谢雷神!博客链接:https://blog.csdn.net/leixiaohua1020/article/deta ...