Update

com.github.Melawy.Lera-Sugar.desktop/contents/splash/Splash.qml

@@ -26,28 +26,29 @@ Image {
     fillMode: Image.PreserveAspectCrop
     
     property int stage
-    
+
     onStageChanged: {
-        if (stage == 1) {
+        if (stage == 2) {
-            introAnimation.running = true
+            inOpacityAnimationContent.running = true;
-            preOpacityAnimation.from = 0;
+            inOpacityAnimationBusyIndicator.running = true;
-            preOpacityAnimation.to = 1;
-            preOpacityAnimation.running = true;
         }
+
         else if (stage == 2) {
-            introAnimation.running = true;
+            lineAnimation.running = true;
         }
+
+        else if (stage == 3) {
+            lineAnimation.running = true;
+            // timerOpacityAnimationLoadingText.start();
+        }
+
         else if (stage == 4) {
-            preOpacityAnimation.from = 1;
+            lineAnimation.running = true;
-            preOpacityAnimation.to = 0;
-            preOpacityAnimation.running = true;
-            pausa.start();
         }
+
         else if (stage == 5) {
-            introAnimation.target = busyIndicator;
+            outOpacityAnimationBusyIndicator.running = true;
-            introAnimation.from = 1;
+            outOpacityAnimationContent.running = true;
-            introAnimation.to = 0;
-            introAnimation.running = true;
         }
     }
 
@@ -58,7 +59,7 @@ Image {
         anchors.leftMargin: 0
         anchors.topMargin: 0
         anchors.fill: parent
-        opacity: 0.85
+        opacity: 0
         TextMetrics {
             id: units
             text: "M"
@@ -75,7 +76,7 @@ Image {
             sourceSize.width: size
             sourceSize.height: size
         }
-
+        
         Row {
             spacing: units.smallSpacing*2
             anchors {
@@ -119,15 +120,15 @@ Image {
         }
 
         Image {
-            id: busyIndicator1
+            id: busyIndicator
             //in the middle of the remaining space
             //y: (parent.height - height) / 1.7
             y: root.height - (root.height - logo.y) / 1.1 - height/2
             anchors.horizontalCenter: parent.horizontalCenter
             source: "images/start.svg"
-            opacity: 0.9
+            opacity: 0
-            sourceSize.height: units.gridUnit * 6.0
+            sourceSize.height: units.gridUnit * 15.0
-            sourceSize.width: units.gridUnit * 6.0
+            sourceSize.width: units.gridUnit * 15.0
             RotationAnimator on rotation {
                 id: rotationAnimator1
                 from: 0
@@ -136,7 +137,7 @@ Image {
                 loops: Animation.Infinite
             }
         }
-
+        
         Row {
             spacing: units.smallSpacing*2
             anchors {
@@ -146,7 +147,7 @@ Image {
                 margins: units.gridUnit
             }
             Image {
-                source: "images/Melawy_Linux_640x640.png"
+                source: "images/Melawy_Linux_640x640.svg"
                 sourceSize.height: units.gridUnit * 8
                 sourceSize.width: units.gridUnit * 8
             }
@@ -192,7 +193,7 @@ Image {
         }
 
         SequentialAnimation {
-            id: introAnimation
+            id: lineAnimation
             running: false
 
             ParallelAnimation {
@@ -204,7 +205,6 @@ Image {
                     easing.type: Easing.InOutBack
                     easing.overshoot: 1.0
                 }
-
             }
         }
 
@@ -212,50 +212,29 @@ Image {
         visible: true
         height: 1470
         width: 1920
-        Text {
+            Text {
-            id: text
+                id: text
-            font.pointSize: 64
+                font.pointSize: 64
-            x: (root.width - width) / 2
+                x: (root.width - width) / 2
-            y: (root.height / 3) * 2
+                y: (root.height / 3) * 2
-            anchors.centerIn: parent
+                anchors.centerIn: parent
-            text: "Welcome!"
+                text: "Welcome!"
-            visible: true
+                visible: true
-            color: "#e92222"
+                color: "#e92222"
-        }
+            }
-
-        // LinearGradient  {
-        //     anchors.fill: text
-        //     source: text
-        //     gradient: Gradient {
-        //          GradientStop { position: 0; color: "#4e70ac" }
-        //          GradientStop { position: 0.4; color: "#4e70ac" }
-        //          GradientStop { position: 0.6; color: "#bac8df" }
-        //          GradientStop { position: 1; color: "#bac8df" }
-        //     }
-        // }
-        }
-
-        OpacityAnimator {
-            id: preOpacityAnimation
-            running: false
-            target: preLoadingText
-            from: 0
-            to: 1
-            duration: 2000
-            easing.type: Easing.InOutQuad
         }
 
         Text {
             id: loadingText
-            height: 30
+            height: 40
             anchors.bottomMargin: 0
             anchors.topMargin: 0
-            text: ""
+            text: "Made with Love"
             color: "#FFFFFF"
             font.family: webFont.name
             font.weight: Font.ExtraLight
 
-            font.pointSize: 20
+            font.pointSize: 32
             opacity: 0
             textFormat: Text.StyledText
             x: (root.width - width) / 2
@@ -264,25 +243,65 @@ Image {
     }
 
     OpacityAnimator {
-        id: opacityAnimation
+        id: inOpacityAnimationBusyIndicator
+        running: false
+        target: busyIndicator
+        from: 0
+        to: 1
+        duration: 1000
+        easing.type: Easing.InOutQuad
+    }
+
+    OpacityAnimator {
+        id: outOpacityAnimationBusyIndicator
+        running: false
+        target: busyIndicator
+        from: 1
+        to: 0
+        duration: 1500
+        easing.type: Easing.InOutQuad
+    }
+
+    OpacityAnimator {
+        id: inOpacityAnimationContent
+        running: false
+        target: content
+        from: 0
+        to: 1
+        duration: 1000
+        easing.type: Easing.InOutQuad
+    }
+
+    OpacityAnimator {
+        id: outOpacityAnimationContent
+        running: false
+        target: content
+        from: 1
+        to: 0
+        duration: 3000
+        easing.type: Easing.InOutQuad
+    }
+
+    OpacityAnimator {
+        id: inOpacityAnimationLoadingText
         running: false
         target: loadingText
         from: 0
         to: 1
-        duration: 000
+        duration: 2000
         easing.type: Easing.InOutQuad
         paused: true
     }
 
     Timer {
-        id: pausa
+        id: timerOpacityAnimationLoadingText
         interval: 1500; running: false; repeat: false;
         onTriggered: root.viewLoadingText();
     }
 
     function viewLoadingText() {
-        opacityAnimation.from = 0;
+        inOpacityAnimationLoadingText.from = 0;
-        opacityAnimation.to = 1;
+        inOpacityAnimationLoadingText.to = 1;
-        opacityAnimation.running = true;
+        inOpacityAnimationLoadingText.running = true;
     }
 }