diff --git a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/Splash.qml b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/Splash.qml index 4b1a7c8..5c6d429 100644 --- a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/Splash.qml +++ b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/Splash.qml @@ -24,9 +24,9 @@ Image { id: root source: "images/background.jpg" fillMode: Image.PreserveAspectCrop - + property int stage - + onStageChanged: { if (stage == 1) { introAnimation.running = true @@ -34,12 +34,21 @@ Image { preOpacityAnimation.to = 1; preOpacityAnimation.running = true; } - if (stage == 4) { + else if (stage == 2) { + introAnimation.running = true; + } + else if (stage == 4) { preOpacityAnimation.from = 1; preOpacityAnimation.to = 0; preOpacityAnimation.running = true; pausa.start(); } + else if (stage == 5) { + introAnimation.target = busyIndicator; + introAnimation.from = 1; + introAnimation.to = 0; + introAnimation.running = true; + } } Item { @@ -49,7 +58,7 @@ Image { anchors.leftMargin: 0 anchors.topMargin: 0 anchors.fill: parent - opacity: 1 + opacity: 0.85 TextMetrics { id: units text: "M" @@ -62,28 +71,58 @@ Image { id: logo property real size: units.gridUnit * 12 anchors.centerIn: parent - source: "images/Manjaro logo.png" + source: "" sourceSize.width: size sourceSize.height: size } - } - Text { - id: date - text:Qt.formatDateTime(new Date(),"") - font.pointSize: 26 - color: "#020304" - opacity:0.85 - font { family: "OpenSans Light"; weight: Font.Light ;capitalization: Font.Capitalize} - anchors.horizontalCenter: parent.horizontalCenter - y: (parent.height - height) / 2.7 + Row { + spacing: units.smallSpacing*2 + anchors { + bottom: parent.bottom + right: parent.right + rightMargin: units.gridUnit * 15 + bottomMargin: units.gridUnit * 13 + margins: units.gridUnit + } + Text { + id: date1 + text:Qt.formatDateTime(new Date(),"dddd, hh:mm") + font.pointSize: 32 + color: "#e92222" + opacity:0.85 + font { family: "NotoSans"; weight: Font.Medium ;capitalization: Font.Capitalize} + anchors.horizontalCenter: parent.horizontalCenter + y: (parent.height - height) / 1.2 + } + } + + Row { + spacing: units.smallSpacing*2 + anchors { + bottom: parent.bottom + right: parent.right + rightMargin: units.gridUnit * 15 + bottomMargin: units.gridUnit * 10 + margins: units.gridUnit + } + Text { + id: date2 + text:Qt.formatDateTime(new Date(),"yyyy.MM.dd") + font.pointSize: 32 + color: "#e92222" + opacity:0.85 + font { family: "NotoSans"; weight: Font.Medium ;capitalization: Font.Capitalize} + anchors.horizontalCenter: parent.horizontalCenter + y: (parent.height - height) / 1.1 + } } Image { id: busyIndicator1 //in the middle of the remaining space //y: (parent.height - height) / 1.7 - y: root.height - (root.height - logo.y) / 2.8 - height/2 + y: root.height - (root.height - logo.y) / 1.1 - height/2 anchors.horizontalCenter: parent.horizontalCenter source: "images/start.svg" opacity: 0.9 @@ -98,69 +137,86 @@ Image { } } - Image { - id: topRect - anchors.horizontalCenter: parent.horizontalCenter - y: root.height - source: "images/rectangle.svg" - - Rectangle { - radius: 3 - color: "#1d212f" - height: 6 - width: height*40 - anchors - { + Row { + spacing: units.smallSpacing*2 + anchors { bottom: parent.bottom - bottomMargin:0 - horizontalCenter: parent.horizontalCenter + right: parent.right + rightMargin: units.gridUnit * 1.5 + margins: units.gridUnit } + Image { + source: "images/Melawy_Linux_640x640.png" + sourceSize.height: units.gridUnit * 8 + sourceSize.width: units.gridUnit * 8 + } + } - Rectangle - { + Image { + id: topRect + anchors.horizontalCenter: parent.horizontalCenter + y: root.height + source: "images/rectangle.svg" + + Rectangle { radius: 3 - color: "#FFFFFF" - width: (parent.width / 6) * (stage - 0.00) + color: "#1d212f" + height: 6 + width: height*52 anchors { - left: parent.left - top: parent.top bottom: parent.bottom + bottomMargin:0 + horizontalCenter: parent.horizontalCenter } - Behavior on width { - PropertyAnimation { - duration: 200 - easing.type: Easing.InOutQuad + + Rectangle + { + radius: 3 + color: "#FFFFFF" + width: (parent.width / 6) * (stage - 0.00) + anchors + { + left: parent.left + top: parent.top + bottom: parent.bottom + } + Behavior on width { + PropertyAnimation { + duration: 200 + easing.type: Easing.InOutQuad + } } } } } - } - SequentialAnimation { - id: introAnimation - running: false + SequentialAnimation { + id: introAnimation + running: false + + ParallelAnimation { + PropertyAnimation { + property: "y" + target: topRect + to: ((root.height / 3) * 2) - 170 + duration: 1500 + easing.type: Easing.InOutBack + easing.overshoot: 1.0 + } - ParallelAnimation { - PropertyAnimation { - property: "y" - target: topRect - to: ((root.height / 3) * 2) - 170 - duration: 1500 - easing.type: Easing.InOutBack - easing.overshoot: 1.0 } } - } - Text { + Text { visible: true - height: 1550 + height: 1470 width: 1920 - Text { id: text font.pointSize: 64 + x: (root.width - width) / 2 + y: (root.height / 3) * 2 anchors.centerIn: parent text: "Welcome!" visible: true @@ -168,55 +224,43 @@ Image { } // LinearGradient { - // anchors.fill: text - // source: text - // gradient: Gradient { - // GradientStop { position: 0; color: "#e1c5de" } - // GradientStop { position: 0.4; color: "#d5b9d0" } - // GradientStop { position: 0.6; color: "#ccaec8" } - // GradientStop { position: 1; color: "#c5abc4" } + // 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" } // } // } + } - // OR + OpacityAnimator { + id: preOpacityAnimation + running: false + target: preLoadingText + from: 0 + to: 1 + duration: 2000 + easing.type: Easing.InOutQuad + } - // LinearGradient { - // anchors.fill: text - // source: text - // gradient: Gradient { - // GradientStop { position: 0; color: "#E03D3D" } - // GradientStop { position: 0.4; color: "#E03D3D" } - // GradientStop { position: 0.6; color: "#E03D3D" } - // GradientStop { position: 1; color: "#A03d40" } - // } - // } - } + Text { + id: loadingText + height: 30 + anchors.bottomMargin: 0 + anchors.topMargin: 0 + text: "" + color: "#FFFFFF" + font.family: webFont.name + font.weight: Font.ExtraLight - OpacityAnimator { - id: preOpacityAnimation - running: false - target: preLoadingText - from: 0 - to: 1 - duration: 2000 - easing.type: Easing.InOutQuad - } - - Text { - id: loadingText - height: 30 - anchors.bottomMargin: 0 - anchors.topMargin: 0 - text: "" - color: "#FFFFFF" - font.family: webFont.name - font.weight: Font.ExtraLight - - font.pointSize: 20 - opacity: 0 - textFormat: Text.StyledText - x: (root.width - width) / 2 - y: (root.height / 3) * 2 + font.pointSize: 20 + opacity: 0 + textFormat: Text.StyledText + x: (root.width - width) / 2 + y: (root.height / 3) * 2 + } } OpacityAnimator { diff --git a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.png b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.png new file mode 100644 index 0000000..7f25f3b Binary files /dev/null and b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.png differ diff --git a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.svg b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.svg new file mode 100644 index 0000000..b12dad7 --- /dev/null +++ b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/Melawy_Linux_640x640.svg @@ -0,0 +1,56 @@ + + + + + + + + diff --git a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/rectangle.svg b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/rectangle.svg index d06087d..ac3e795 100644 --- a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/rectangle.svg +++ b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/rectangle.svg @@ -1,39 +1 @@ - - - - - - - + diff --git a/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/start.svg b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/start.svg new file mode 100644 index 0000000..b12dad7 --- /dev/null +++ b/com.github.Melawy.Lera-Sugar.desktop/contents/splash/images/start.svg @@ -0,0 +1,56 @@ + + + + + + + +