其他分享
首页 > 其他分享> > 14.Quick QML-TextInput详解

14.Quick QML-TextInput详解

作者：互联网

1.TextInput属性
用来编辑一行文本,对应QLineEdit,除了正常输入外,我们还可以设置echoMode属性改为密码显示状态,也可以通过validator属性和inputMask属性来设置验证器或输入掩码,来限制文本输入内容.也可以设置selectByMouse为true,让鼠标支持编辑选中的文本区域....等等.它的属性是非常非常的多,要想熟练使用该组件,我们还是有必要过滤一遍.
TextInput的属性如下所示:

2.TextInput信号

TextInput的信号如下所示:

3.TextInput方法

TextInput的方法如下所示:

4.validator验证器属性介绍
目前支持的验证器有IntValidator、DoubleValidator、RegExpValidator和RegularExpressionValidator,并且当按下enter键后,如果文本符合验证要求,才会发射accepted信号

IntValidator(整数验证器)
IntValidator用来为整数值提供验证器, 如果未设置验证的区域，IntValidator将只接受正负号(正负号必须在文本开头)和数字、IntValidator的属性有bottom(整数的下限值)、top(整数的上限值)
示例如下所示(输入10-99的值):

TextInput {
        anchors.fill: parent
        validator: IntValidator{
            bottom: 10
            top: 99
        }

        onAccepted: {
            console.log("你输入的值为:"+text);
        }
    } 

当我们输入文本符合验证要求时,则打印log.

 

DoubleValidator(双精度浮点数验证器)
通过bottom和top 来设置输入范围, 通过decimals 来设置小数位个数;
示例如下所示:

TextInput {
        anchors.fill: parent
        validator: DoubleValidator {
            decimals: 2
            bottom: 10
            top: 99
        }

        onAccepted: {
            console.log("你输入的值为:"+text);
        }
 }

 

RegularExpressionValidator (正则表达式验证器)
比如:

最前面的“/”与最后面的“/”是分隔符，表示正则表达式的开始与结束。所以正则表达式匹配的内容是" str(.+?);"，而"+?"表示是至少重复一次或者多次的意思,所以匹配的内容是name:开头，";"结尾的匹配项。
而"g"表示的是全局匹配,可以匹配到多次的情况,如果不加"g"，那么result的匹配项最多只能有1个，i表示表示忽略大小写（ignoreCase，）、相关的标志还有m（multiline，表示允许跨行）
示例如下所示:

Window {
    id: wind
    width: 550;
    height: 400;
    visible: true;
    Text {
        id: hint
        color: "red"
        font.pixelSize : 20
        text: "请输入成员名字,以\"name:\"开头,以\";\"隔开:"
    }
    TextInput {
        id: input
        property var regx: /name:(.+?);/gi
        anchors.top: hint.bottom
        focus: true
        font.pixelSize : 20
        validator: RegularExpressionValidator {
            regularExpression: input.regx
        }
        onAccepted: {
            var result = text.match(input.regx);

            var str = "成员数量为:"+result.length
            for (var i in result) {
                var resultStr = result[i].replace(/ /g,"");  // 删除空格
                str += "\n" + resultStr.replace(/name:/g,"");   // 删除"name:"
            }
            resultPrint.text = str;
        }
    }

    Text {
        id: resultPrint
        anchors.top: input.bottom
        anchors.topMargin: 40
        font.pixelSize : 20
        color: "green"
        text: "等待结果"
    }
}

效果如下所示:

可以看到我们就算了"---"干扰字符,也可以识别出来.并且由于加了"g"全局匹配符,所以找到了3个成员,如果不加g,则只会匹配一次.

 

 

标签：font,14,TextInput,设置,Quick,文本,true,输入
来源： https://www.cnblogs.com/lifexy/p/14701838.html