chore: tweak the menu animation

tweak the menu animation Log:
FeiWang1119 · Aug 22, 2024 · 12763df · 12763df
1 parent 836f736
commit 12763df
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 3 deletions.
diff --git a/qt6/src/qml/FlowStyle.qml b/qt6/src/qml/FlowStyle.qml
@@ -630,7 +630,7 @@ QtObject {
 
     property QtObject menu: QtObject {
         property int padding: 0
-        property int radius: D.DTK.platformTheme.windowRadius < 0 ? 18 : D.DTK.platformTheme.windowRadius
+        property int radius: D.DTK.platformTheme.windowRadius < 0 ? 12 : D.DTK.platformTheme.windowRadius
         property int margins: 10
         property int overlap: 1
 
@@ -669,6 +669,17 @@ QtObject {
             normal: Qt.rgba(0, 0, 0, 0.15)
         }
 
+        // the highlight color of main menu item, when submenu is opened.
+        property D.Palette submenuOpenedItemHighlight: D.Palette {
+            normal: Qt.rgba(0, 0, 0, 0.15)
+            normalDark: Qt.rgba(1, 1, 1, 0.2)
+        }
+
+        property D.Palette itemHighlightShadow: D.Palette {
+            normal: Qt.rgba(0, 0, 0, 0.2)
+            normalDark: Qt.rgba(1, 1, 1, 0.1)
+        }
+
         property D.Palette itemText: D.Palette {
             normal: ("black")
             normalDark: Qt.rgba(1, 1, 1, 0.6)

diff --git a/qt6/src/qml/Menu.qml b/qt6/src/qml/Menu.qml
@@ -28,6 +28,8 @@ T.Menu {
         return false
     }
     readonly property bool active: parent && parent.Window.active
+
+
 
     implicitHeight: DS.Style.control.implicitHeight(control)
     implicitWidth: DS.Style.control.implicitWidth(control)
@@ -84,21 +86,41 @@ T.Menu {
                 view.highlightMoveVelocity: -1
 
                 view.highlight: Rectangle {
+                    id: highlightRect
                     anchors.left: parent ? parent.left : undefined
                     anchors.right: parent ? parent.right : undefined
                     anchors.leftMargin: 6
                     anchors.rightMargin: 6
                     scale: 0.9
                     property D.Palette backgroundColor: DS.Style.highlightPanel.background
-                    color: D.ColorSelector.backgroundColor
+                    property D.Palette submenuOpenedItemHighlightColor: DS.Style.menu.submenuOpenedItemHighlight
+                    property D.Palette itemHighlightShadowColor: DS.Style.menu.itemHighlightShadow
+                    color: {
+                        let item = control.itemAt(control.currentIndex)
+                        if (item && item.subMenu) {
+                            return D.ColorSelector.submenuOpenedItemHighlightColor
+                        } else {
+                            return D.ColorSelector.backgroundColor
+                        }
+                    }
                     radius: 6
                     Component.onCompleted: {
                         scale = 1.0
                     }
                     Behavior on scale {
                         NumberAnimation { duration: 100 }
                     }
-
+                    BoxInsetShadow {
+                        visible: highlightRect.color === highlightRect.D.ColorSelector.backgroundColor
+                        anchors.fill: parent
+                        z: DTK.AboveOrder
+                        cornerRadius: parent.radius
+                        shadowOffsetX: 0
+                        shadowOffsetY: -1
+                        shadowBlur: 1
+                        spread: 1
+                        shadowColor: highlightRect.D.ColorSelector.itemHighlightShadowColor
+                    }
                 }
             }
             Loader {