example wrk

example/AppTest/IpAddressInput.qml

@@ -4,19 +4,46 @@ Item {
     id: ipAddresInput
     property double space: 4
     property double ipwidth: 200
+    property double posX: 0
+    property double posY: 0
     property double partwidth: (ipwidth / 4) - (3 * space)
     property color focuscolor: "green"
     property color ipcolor: "black"
+    property color invalidcolor: "red"
     property string ipAddress: ""
+    property double ipFontSize: 14
+    property bool isValid: false
 
     function makeIpAddress() {
-        ipAddress = textInput1.text + "." + textInput2.text + "." +
-                textInput3.text + "." + textInput4.text;
-    }
+        ipAddress = parseInt(textInput1.text, 10) + "." + parseInt(textInput2.text, 10) + "." +
+                parseInt(textInput3.text, 10) + "." + parseInt(textInput4.text, 10);
+
+        if((textInput1.text >= 0) && (textInput1.text <= 255))
+            textInput1.color = (!textInput1.focus)?ipcolor:focuscolor;
+        else textInput1.color = invalidcolor;
+
+        if((textInput2.text >= 0) && (textInput2.text <= 255))
+            textInput2.color = (!textInput2.focus)?ipcolor:focuscolor;
+        else textInput2.color = invalidcolor;
 
+        if((textInput3.text >= 0) && (textInput3.text <= 255))
+            textInput3.color = (!textInput3.focus)?ipcolor:focuscolor;
+        else textInput3.color = invalidcolor;
+
+        if((textInput4.text >= 0) && (textInput4.text <= 255))
+            textInput4.color = (!textInput4.focus)?ipcolor:focuscolor;
+        else textInput4.color = invalidcolor;
+    }
 
     function fillIpFields() {
+
+        function padDigits(number, digits) {
+            return Array(Math.max(digits - String(number).length + 1, 0)).join(0) + number;
+        };
         var iplist = ipAddress.split(".");
+        var i;
+        for ( i = 0; i < iplist.length; i++) iplist[i] = padDigits(iplist[i], 3);
+
         if(iplist.length >= 1) textInput1.text = iplist[0];
         if(iplist.length >= 2) textInput2.text = iplist[1];
         if(iplist.length >= 3) textInput3.text = iplist[2];
@@ -25,7 +52,6 @@ Item {
 
     onIpAddressChanged: {
         fillIpFields();
-
     }
 
     Component.onCompleted: {
@@ -34,9 +60,10 @@ Item {
 
     TextInput {
         id: textInput1
-        x: ipAddresInput.x
-        y: ipAddresInput.y
+        x: posX
+        y: posY
         width: partwidth
+        font.pixelSize: ipFontSize
         KeyNavigation.tab: textInput2
         Keys.onReturnPressed:
         {
@@ -44,20 +71,43 @@ Item {
         }
 
         color: ipcolor
-        font.pixelSize: 14
-        validator: IntValidator {bottom:0; top:255}
+        validator: IntValidator {bottom:0; top:999}
+        inputMask: "000;"
+        inputMethodHints: Qt.ImhDigitsOnly
+        maximumLength: 3
+        Keys.onReleased:  {
+            if(cursorPosition == maximumLength){
+                textInput2.focus = true;
+            }
+        }
+        Keys.onPressed: {
+            if((event.key == Qt.Key_Left) && (cursorPosition == 0)){
+                textInput4.focus = true; textInput4.cursorPosition = 2;
+            }
+        }
+
         onFocusChanged: {
-            makeIpAddress();
             color = (focus) ? focuscolor : ipcolor;
+            makeIpAddress();
             cursorPosition = 0;
         }
     }
 
+    Text{
+        id: ipDot1
+        font.pixelSize: ipFontSize
+        x: posX + textInput1.width
+        y: textInput1.y
+        color: ipcolor
+        text:"."
+    }
+
     TextInput {
         id: textInput2
-        x: ipAddresInput.x + space + partwidth
-        y: ipAddresInput.y
+        x: posX + space + partwidth + ipDot1.width
+        y: posY
         width: partwidth
+        font.pixelSize: ipFontSize
         KeyNavigation.tab: textInput3
         Keys.onReturnPressed:
         {
@@ -65,20 +115,41 @@ Item {
         }
 
         color: ipcolor
-        font.pixelSize: 14
-        validator: IntValidator {bottom:0; top:255}
+        validator: IntValidator {bottom:0; top:999}
+        inputMask: "000;"
+        inputMethodHints: Qt.ImhDigitsOnly
+        maximumLength: 3
+        Keys.onReleased:  {
+            if(cursorPosition == maximumLength){
+                textInput3.focus = true;
+            }
+        }
+        Keys.onPressed: {
+            if((event.key == Qt.Key_Left) && (cursorPosition == 0)){
+                textInput1.focus = true; textInput1.cursorPosition = 2;
+            }
+        }
         onFocusChanged: {
-            makeIpAddress();
             color = (focus) ? focuscolor : ipcolor;
+            makeIpAddress();
             cursorPosition = 0;
         }
     }
+    Text{
+        id: ipDot2
+        font.pixelSize: ipFontSize
+        x: textInput2.x + textInput2.width
+        y: textInput1.y
+        color: ipcolor
+        text:"."
+    }
 
     TextInput {
         id: textInput3
-        x: ipAddresInput.x + 2*space + 2*partwidth
-        y: ipAddresInput.y
+        x: posX + 2*space + 2*partwidth +ipDot2.width
+        y: posY
         width: partwidth
+        font.pixelSize: ipFontSize
         KeyNavigation.tab: textInput4
         Keys.onReturnPressed:
         {
@@ -86,20 +157,41 @@ Item {
         }
 
         color: ipcolor
-        font.pixelSize: 14
-        validator: IntValidator {bottom:0; top:255}
+        validator: IntValidator {bottom:0; top:999}
+        inputMask: "000;"
+        inputMethodHints: Qt.ImhDigitsOnly
+        maximumLength: 3
+        Keys.onReleased:  {
+            if(cursorPosition == maximumLength){
+                textInput4.focus = true;
+            }
+        }
+        Keys.onPressed: {
+            if((event.key == Qt.Key_Left) && (cursorPosition == 0)){
+                textInput2.focus = true; textInput2.cursorPosition = 2;
+            }
+        }
         onFocusChanged: {
-            makeIpAddress();
             color = (focus) ? focuscolor : ipcolor;
+            makeIpAddress();
             cursorPosition = 0;
         }
     }
+    Text{
+        id: ipDot3
+        font.pixelSize: ipFontSize
+        x: textInput3.x + textInput3.width
+        y: textInput1.y
+        color: ipcolor
+        text:"."
+    }
 
     TextInput {
         id: textInput4
-        x: ipAddresInput.x + 3*space + 3*partwidth
-        y: ipAddresInput.y
+        x: posX + 3*space + 3*partwidth + ipDot3.width
+        y: posY
         width: partwidth
+        font.pixelSize: ipFontSize
         KeyNavigation.tab: textInput1
         Keys.onReturnPressed:
         {
@@ -107,14 +199,24 @@ Item {
         }
 
         color: ipcolor
-        font.pixelSize: 14
-        validator: IntValidator {bottom:0; top:255}
-
+        validator: IntValidator {bottom:0; top:999}
+        inputMask: "000;"
+        inputMethodHints: Qt.ImhDigitsOnly
+        maximumLength: 3
+        Keys.onReleased:  {
+            if(cursorPosition == maximumLength){
+                textInput1.focus = true;
+            }
+        }
+        Keys.onPressed: {
+            if((event.key == Qt.Key_Left) && (cursorPosition == 0)){
+                textInput3.focus = true; textInput3.cursorPosition = 2;
+            }
+        }
         onFocusChanged: {
-            makeIpAddress();
             color = (focus) ? focuscolor : ipcolor;
+            makeIpAddress();
             cursorPosition = 0;
         }
     }
-
 }

example/AppTest/main.qml

@@ -18,6 +18,7 @@ ApplicationWindow {
         nameserver: "192.168.0.101"
         gateway: "192.168.0.10"
 
+
         //        infile: "/home/ru/BUILD/QT562_di-soric/GfA/board/GfA/Display001/rootfs/etc/network/interfaces"
         //        outfile: "/root/out.txt"
         infile: "/home/ru/IFACE/interfaces"
@@ -70,18 +71,22 @@ ApplicationWindow {
         y:220
         text: ipAddress.ipAddress
     }
+    Label {
+        x:500
+        y:240
+        text: ipNetmask.ipAddress
+    }
 
     IpAddressInput {
         id: ipAddress
-        x: 20
-        y: 220
-        ipwidth: 150
-        ipcolor: "red"
+        posX: 20
+        posY: 220
+        ipwidth: 200
+        ipcolor: "black"
         ipAddress: setEth0.address
-
+        ipFontSize: 20
         Component.onCompleted: {
             setEth0.doGetInterface();
-
         }
 
         onIpAddressChanged: {
@@ -89,4 +94,21 @@ ApplicationWindow {
         }
     }
 
+    IpAddressInput {
+        id: ipNetmask
+        posX: 20
+        posY: 240
+        ipwidth: 200
+        ipcolor: "black"
+        ipAddress: setEth0.netmask
+        ipFontSize: 20
+        Component.onCompleted: {
+            setEth0.doGetInterface();
+        }
+
+        onIpAddressChanged: {
+            setEth0.netmask = ipNetmask.ipAddress;
+        }
+    }
+
 }