From a1e93b9eadc728a8c02cf4a36ea1a1a6fa7b7b46 Mon Sep 17 00:00:00 2001
From: Michael Bohlender <michael.bohlender@kdemail.net>
Date: Thu, 14 Sep 2017 10:21:14 +0200
Subject: animate validation

---
 framework/qml/PasswordField.qml     |  2 +-
 framework/qml/RequiredTextField.qml | 19 ++++++++++++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

(limited to 'framework')

diff --git a/framework/qml/PasswordField.qml b/framework/qml/PasswordField.qml
index fa1d1757..6fa48d44 100644
--- a/framework/qml/PasswordField.qml
+++ b/framework/qml/PasswordField.qml
@@ -19,7 +19,7 @@
 import QtQuick 2.7
 import org.kube.framework 1.0 as Kube
 
-Kube.RequiredTextField {
+Kube.TextField {
     id: root
 
     property bool showPassword
diff --git a/framework/qml/RequiredTextField.qml b/framework/qml/RequiredTextField.qml
index 7552ebfb..0c76d144 100644
--- a/framework/qml/RequiredTextField.qml
+++ b/framework/qml/RequiredTextField.qml
@@ -25,6 +25,7 @@ Kube.TextField {
     validator: RegExpValidator { regExp: /.*\S.*/ }
 
     Rectangle {
+        id: validIndicator
         anchors {
             left: parent.left
             right: parent.right
@@ -32,6 +33,22 @@ Kube.TextField {
             margins: 1
         }
         height: 3
-        color: acceptableInput ? root.activefocus ? Kube.Colors.positiveColor : "transparent" : Kube.Colors.warningColor
+        color: acceptableInput ? Kube.Colors.positiveColor : Kube.Colors.warningColor
+
+        OpacityAnimator {
+            target: validIndicator
+            from: opacity
+            to: 0
+            duration: 1000
+            running: acceptableInput
+        }
+
+        OpacityAnimator {
+            target: validIndicator
+            from: opacity
+            to: 1
+            duration: 100
+            running: !acceptableInput
+        }
     }
 }
-- 
cgit v1.2.3