QtQuick/Qml自定义控件(2)-IP地址输入框

QtQuick没有提供IP输入框控件, 于是我打算自定义开发一个.
首先来看看windows系统里的IP输入框有哪些特性
在这里插入图片描述

4个输入框 中间由3个点间隔. 再看看动态的

在这里插入图片描述

这里可以看出来 特性1 在第一栏输入三位数字后, 输入焦点自动切换到第二栏了.

在这里插入图片描述

再来看看特性2 在第二栏输入的时候 按键盘左方向移动 可以回到第一栏
向右也应该是同理的

在看看删除输入的情况 特性3

在这里插入图片描述

删除的时候, 如果本栏删除完. 也会顺带将输入焦点移动到前一栏去.

特性4 输入框肯定是有输入限制的, 比如中文, 超过255的数字, 特殊符号等, 这个我们可以用正则表达式来完成.

基于这4个特性 就可以开始开发了.
首先我们使用4个TextInput和3个Text就可以组装好主体界面, 再加一个外边框 搞定

在这里插入图片描述

接着加入输入焦点的判断和移动, 另外输入栏加入正则表达式. 完工.

在这里插入图片描述

访问三峰驼Qml控件大全

三峰驼 仅此文章的功能

联系方式:


作者 郑天佐
QQ 278969898
主页 http://www.camelstudio.cn/
邮箱 [email protected]
博客 http://blog.csdn.net/zhengtianzuo06/
github https://github.com/zhengtianzuo
QQ群 199672080

捐赠

觉得分享的内容还不错, 就请作者喝杯咖啡吧~~

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章