目錄

?

?

基本概念

代碼及演示

---

?

基本概念

這是一個很常用到的功能，特意記錄下：

一般輸入框會用到2個，一個是TextInput一個是TextField。

因為TextInput加Rectangle如果太長會出現一種問題，就是Text會輸入到Rectangle外面。

可以用TextField代替，也可以限制其長度！

?

TextInput和TextField中都含有一個屬性：maximumLength

這個是運行的文本長度，超出長度會被截斷TextInput的maximumLength的默認值為32767，而TextField沒有默認。

?

下面是設置回顯方式：

一TextInput為例：

• TextInput.Normal：直接顯示文本（默認方式）；

• TextInput.Password：使用密碼掩碼字符（根據不同平臺顯示效果不同）來代替真實的字符；

• TextInput.NoEcho：不顯示輸入的內容；

• TextInput.PasswordEchoOnEdit：使用密碼掩碼字符，但在輸入時顯示真實字符。

?

?

代碼及演示

輸入如下：

點擊登錄按鈕后：

對應的偽代碼如下：

main.qml

import QtQuick 2.9 import QtQuick.Window 2.2Window {visible: truewidth: 500height: 900title: qsTr("九州修仙大陸")Login{id: loginwidth: parent.widthheight: parent.height}}

用戶名相關的qml

Rectangle {width: loginBtn.width * 1.5height: userNameInput.contentHeight + 5color: "white"border.color: "grey"TextInput {id: userNameInputanchors.fill: parentanchors.margins: 2font.pointSize: passwdNormalSizefocus: truemaximumLength: 12} }

密碼相關的qml

Rectangle {width: loginBtn.width * 1.5height: passwdInput.contentHeight + 5color: "white"border.color: "grey"anchors.horizontalCenter: passwdText.CenterTextInput {id: passwdInputanchors.fill: parentanchors.margins: 2font.pointSize: passwdNormalSizefocus: trueanchors.horizontalCenter: passwdText.CenterechoMode: TextInput.Password} }

登錄按鈕相關的qml

Button {id: loginBtnwidth: textNormalWidth * 1.8height: textNormalSizetext: qsTr("登錄");onClicked: {console.debug("用戶名：" + userNameInput.text + " 密碼：" + passwdInput.text)} }

?

總結

以上是生活随笔為你收集整理的QML工作笔记-文本输入设置长度以及回显方式（TextInput与TextField通用）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。