From c3499d80715b22d0c6b5267ca79253b970656783 Mon Sep 17 00:00:00 2001 From: chlorospingus Date: Thu, 12 Feb 2026 02:40:26 -0800 Subject: [PATCH] launcher fully animated --- Launcher.qml | 93 ++++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 87 insertions(+), 6 deletions(-) diff --git a/Launcher.qml b/Launcher.qml index b87961b..4486696 100644 --- a/Launcher.qml +++ b/Launcher.qml @@ -26,11 +26,14 @@ PanelWindow { } function open() { input.text = "" - visible = true + root.visible = true + exit.stop(); + entry.start(); } function close() { input.text = "" - visible = false + entry.stop(); + exit.start(); } property var currentItems: { @@ -57,6 +60,10 @@ PanelWindow { } color: "#181818" height: currentItems.length ? 180 : 60 + Behavior on height { NumberAnimation { + duration: 300 + easing.type: Easing.OutQuint + }} width: 700 radius: 12 @@ -115,14 +122,58 @@ PanelWindow { highlightFollowsCurrentItem: true orientation: ListView.Horizontal spacing: 6 - model: currentItems.slice(0, 5) + + add: Transition { NumberAnimation { + property: "opacity" + from: 0 + to: 1 + duration: 150 + }} + remove: Transition { NumberAnimation { + property: "opacity" + from: 1 + to: 0 + duration: 150 + }} + displaced: Transition { + NumberAnimation { + property: "x" + duration: 300 + easing.type: Easing.OutQuint + onStarted: console.log("displaced") + } + NumberAnimation { + property: "opacity" + to: 1 + duration: 150 + } + } + + model: ScriptModel {values: currentItems.slice(0, 5)} delegate: Rectangle { + id: item anchors { - top: parent.top - bottom: parent.bottom + top: parent?.top + bottom: parent?.bottom } width: (700 - 6*6)/5 - color: ListView.isCurrentItem ? "#222222" : "#181818" + color: "#20181818" + ListView.onIsCurrentItemChanged: ListView.isCurrentItem ? selectAnim.start() : deselectAnim.start() + property var selectAnim: ColorAnimation { + target: item + property: "color" + to: "#10ffffff" + duration: 200 + easing.type: Easing.OutQuint + } + property var deselectAnim: ColorAnimation { + target: item + onStarted: selectAnim.stop() + property: "color" + to: "#00181818" + duration: 200 + easing.type: Easing.InQuint + } radius: 10 function execute() { modelData.emoji @@ -162,5 +213,35 @@ PanelWindow { } } } + transform: Translate { + y: -50 + NumberAnimation on y { + id: entry + to: 0 + duration: 300 + easing.type: Easing.OutQuint + } + NumberAnimation on y { + id: exit + to: -50 + duration: 300 + easing.type: Easing.InQuint + onFinished: root.visible = false + } + } + opacity: 0 + NumberAnimation on opacity { + running: entry.running + to: 1 + duration: entry.duration/2 + } + SequentialAnimation on opacity { + running: exit.running + PauseAnimation {duration: exit.duration/2} + NumberAnimation { + to: 0 + duration: exit.duration/2 + } + } } }