feat: [UI] Add collection animation effects

src/deepin-album.qrc

@@ -66,5 +66,6 @@
         <file>qml/Control/BaseView.qml</file>
         <file>qml/Control/BorderImageEx.qml</file>
         <file>qml/Control/MonthImage.qml</file>
+        <file>qml/Control/Animation/SwitchViewAnimation.qml</file>
     </qresource>
 </RCC>

src/qml/AlbumTitle.qml

@@ -252,7 +252,7 @@ TitleBar {
                     checked: true
                     onClicked: {
                         collectionBtnClicked(0)
-                        collectionCombo.setCurrentIndex()
+                        collectionCombo.setCurrentIndex(0)
                     }
                 }
                 ToolButton {
@@ -303,10 +303,6 @@ TitleBar {
                         break
                     }
                 }
-
-                Component.onCompleted: {
-                    GStatus.sigCollectionViewIndexChanged.connect(setChecked)
-                }
             }
 
             // 年月日下拉框
@@ -338,10 +334,6 @@ TitleBar {
                     collectionBtnClicked(currentIndex)
                     collectionBtnBox.setChecked(currentIndex)
                 }
-
-                Component.onCompleted: {
-                    GStatus.sigCollectionViewIndexChanged.connect(setCurrentIndex)
-                }
             }
         }
 

src/qml/Control/Animation/SwitchViewAnimation.qml

@@ -0,0 +1,43 @@
+// SPDX-FileCopyrightText: 2024 UnionTech Software Technology Co., Ltd.
+//
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+import QtQuick 2.11
+import QtQuick.Controls 2.4
+
+Item {
+    id: switchViewAnimation
+
+    property bool show: false
+    property real showOpacity: 1
+    property real showX: 0
+
+    property real hideOpacity: 0
+    property real hideX: -width - 20
+
+    state: "hide"
+    states: [
+        State {
+            name: "show"
+            PropertyChanges {
+                target: switchViewAnimation
+                opacity: showOpacity
+                x: showX
+            }
+            when: show
+        },
+        State {
+            name: "hide"
+            PropertyChanges {
+                target: switchViewAnimation
+                opacity: hideOpacity
+                x: hideX
+            }
+            when: !show
+        }
+    ]
+
+    transitions: Transition {
+        NumberAnimation{properties: "x,opacity"; easing.type: Easing.OutExpo; duration: 400}
+    }
+}

src/qml/Control/DeleteDialog.qml

@@ -83,7 +83,7 @@ DialogWindow {
         font: DTK.fontManager.t5
         verticalAlignment: Text.AlignBottom
         horizontalAlignment: Text.AlignHCenter
-        elide: Text.elideRight
+        elide: Text.ElideRight
         text: textMetics.elidedText
         TextMetrics {
             id: textMetics

src/qml/Control/ListView/ThumbnailListDelegate.qml

@@ -81,7 +81,7 @@ Item {
     // 图片保存完成，缩略图区域重新加载当前图片
     Connections {
         target: fileControl
-        onCallSavePicDone: {
+        function onCallSavePicDone() {
             if (path === m_url) {
                 m_displayFlushHelper = Math.random()
             }
@@ -463,7 +463,7 @@ Item {
 
                 Connections {
                     target: albumControl
-                    onSigRefreashVideoTime: {
+                    function onSigRefreashVideoTime(url, videoTimeStr) {
                         if (url === m_url) {
                             videoLabel.displayStr = videoTimeStr
                         }

src/qml/Control/ListView/ThumbnailListDelegate2.qml

@@ -59,7 +59,7 @@ Item {
     // 图片保存完成，缩略图区域重新加载当前图片
     Connections {
         target: fileControl
-        onCallSavePicDone: {
+        function onCallSavePicDone() {
             if (path === model.url) {
                 model.reloadThumbnail
             }
@@ -404,7 +404,7 @@ Item {
 
                 Connections {
                     target: albumControl
-                    onSigRefreashVideoTime: {
+                    function onSigRefreashVideoTime(url, videoTimeStr) {
                         if (url === model.url) {
                             videoLabel.displayStr = videoTimeStr
                         }

src/qml/Control/ListView/ThumbnailListView.qml

@@ -130,7 +130,7 @@ Item {
     function totalTimeScope() {
         if(thumnailListType === Album.Types.ThumbnailAllCollection &&
                 GStatus.currentViewType === Album.Types.ViewCollecttion &&
-                collecttionView.currentViewIndex === 3) { //仅在合集模式的时候激活计算，以此节省性能
+                GStatus.currentCollecttionViewIndex === 3) { //仅在合集模式的时候激活计算，以此节省性能
             var visilbeIndexs = theView.flushRectSel(0, theView.contentY, theView.width, theView.height)
             if (visilbeIndexs.length > 0 && visilbeIndexs[0] !== "-1") {
                 var url1 = thumbnailListModel.get(visilbeIndexs[0]).url
@@ -242,7 +242,7 @@ Item {
 
     // 提供给合集日视图和已导入视图使用，用来刷新
     function flushRectSel(x,y,w,h,ctrl,mousePress, inPress) {
-        if (theView.contains(x,y) && theView.contains(x+w, y+h) && w !== 0 && h !== 0) {
+        if (theView.contains(Qt.point(x,y)) && theView.contains(Qt.point(x+w, y+h)) && w !== 0 && h !== 0) {
             // 按住Ctrl，鼠标点击事件释放时，处理点选逻辑
             if (ctrl && mousePress) {
                 if (!inPress) {
@@ -287,7 +287,7 @@ Item {
 
     Connections {
         target: thumbnailImage
-        onEscKeyPressed: {
+        function onEscKeyPressed() {
             if (haveSelect) {
                 selectAll(false)
             }
@@ -668,18 +668,19 @@ Item {
 
         Connections {
             target: GStatus
-            onSigSelectAll: {
-                if (theView.visible)
+            function onSigSelectAll(bSel) {
+                if (theView.visible) {
                     selectAll(bSel)
+                }
             }
 
-            onSigPageUp: {
+            function onSigPageUp() {
                 if (theView.visible) {
                     theView.executeScrollBar(theView.scrollDelta)
                 }
             }
 
-            onSigPageDown: {
+            function onSigPageDown() {
                 if (theView.visible) {
                     theView.executeScrollBar(-theView.scrollDelta)
                 }

src/qml/Control/ListView/ThumbnailListView2.qml

@@ -100,7 +100,7 @@ FocusScope {
     function totalTimeScope() {
         if(thumnailListType === Album.Types.ThumbnailAllCollection &&
                 GStatus.currentViewType === Album.Types.ViewCollecttion &&
-                collecttionView.currentViewIndex === 3) { //仅在合集模式的时候激活计算，以此节省性能
+                GStatus.currentCollecttionViewIndex === 3) { //仅在合集模式的时候激活计算，以此节省性能
             var visilbeIndexs = gridView.rectIndexes(0, 0, gridView.width, gridView.height)
             if (visilbeIndexs.length > 0) {
                 var url1 = thumbnailModel.data(visilbeIndexs[0], "url")

src/qml/SideBar/SideBarItem.qml

@@ -45,6 +45,7 @@ ColumnLayout {
             id: viewLabel
             width: 42; height: 20
             text: title
+            font: DTK.fontManager.t6
             Layout.alignment: Qt.AlignLeft; Layout.leftMargin: 20
             horizontalAlignment: Qt.AlignLeft
 

src/qml/SideBar/SideBarItemDelegate.qml

@@ -48,6 +48,7 @@ ItemDelegate {
             leftMargin: 10
             verticalCenter: item.verticalCenter
         }
+        font: DTK.fontManager.t6
         text: "%1".arg(model.displayName)
         elide: Text.ElideRight
     }

src/qml/ThumbnailImageView/CollecttionView/AllCollection.qml

@@ -13,9 +13,11 @@ import org.deepin.album 1.0 as Album
 
 import "../../Control"
 import "../../Control/ListView"
+import "../../Control/Animation"
 import "../../"
 
-Item {
+SwitchViewAnimation {
+
     property int filterType: filterCombo.currentIndex // 筛选类型，默认所有
     property string numLabelText:""
     property string selectedText: getSelectedNum(selectedPaths)

src/qml/ThumbnailImageView/CollecttionView/CollecttionView.qml

@@ -15,24 +15,57 @@ BaseView {
     id: collecttView
 
     property int currentViewIndex: 3
+    property int rollingWidth: collecttView.width + 20
 
     // 通知日视图刷新状态栏提示信息
     signal flushDayViewStatusText()
 
     function setIndex(index) {
-
         if (currentViewIndex === index)
             return
 
-        currentViewIndex = index
-        if (currentViewIndex === 0)
+        if (index === 0) {
             yearCollection.flushModel()
-        else if (currentViewIndex === 1)
+            if (yearCollection.x < 0)
+                yearCollection.x = rollingWidth
+        } else if (index === 1) {
             monthCollection.flushModel()
-        else if (currentViewIndex === 2) {
+            if (monthCollection.x < 0)
+                monthCollection.x = rollingWidth
+        } else if (index === 2) {
             dayCollection.flushModel()
+            if (dayCollection.x < 0)
+                dayCollection.x = rollingWidth
+            if (dayCollection.x !== 0) {
+                dayCollection.visible = true
+            }
+
+            GStatus.selectedPaths = []
             flushDayViewStatusText()
+        } else if (index === 3) {
+            if (allCollection.x < 0)
+                allCollection.x = rollingWidth
+            allCollection.clearSelecteds()
         }
+
+        currentViewIndex = index
+        GStatus.currentCollecttionViewIndex = index
+
+        //年月视图不显示底栏数量
+        if (currentViewIndex === 0 || currentViewIndex ===1) {
+            GStatus.statusBarNumText = ""
+        }
+    }
+
+    onWidthChanged: {
+        if (yearCollection.x < 0)
+            yearCollection.x = -rollingWidth
+        if (monthCollection.x < 0)
+            monthCollection.x = -rollingWidth
+        if (dayCollection.x < 0)
+            dayCollection.x = -rollingWidth
+        if (allCollection.x < 0)
+            allCollection.x = -rollingWidth
     }
 
     onVisibleChanged: {
@@ -48,42 +81,37 @@ BaseView {
         }
     }
 
-    SwipeView {
-        id: swipeView
-        anchors.fill: parent
-        currentIndex: currentViewIndex
-        interactive: false
-
-        YearCollection {
-            id: yearCollection
-        }
-
-        MonthCollection {
-            id: monthCollection
-        }
-
-        DayCollection {
-            id: dayCollection
-        }
-
-        AllCollection {
-            id: allCollection
-        }
+    YearCollection {
+        id: yearCollection
+        x: rollingWidth
+        width: collecttView.width
+        height: collecttView.height
+        show: currentViewIndex === 0
+    }
 
-        onCurrentIndexChanged: {
-            currentViewIndex = currentIndex
-            GStatus.sigCollectionViewIndexChanged(currentIndex)
+    MonthCollection {
+        id: monthCollection
+        x: rollingWidth
+        width: collecttView.width
+        height: collecttView.height
+        show: currentViewIndex === 1
+    }
 
-            // 保证日聚合和所有照片视图互斥显示，以便列表控件全选逻辑只在显示的视图中生效
-            dayCollection.visible = currentViewIndex === 2
-            allCollection.clearSelecteds()
-            allCollection.visible = currentViewIndex === 3
+    DayCollection {
+        id: dayCollection
+        visible: false
+        x: rollingWidth
+        width: collecttView.width
+        height: collecttView.height
+        show: currentViewIndex === 2
+    }
 
-            //年月视图不显示底栏数量
-            if (currentViewIndex === 0 || currentViewIndex ===1) {
-                GStatus.statusBarNumText = ""
-            }
-        }
+    AllCollection {
+        id: allCollection
+        x: 0
+        width: collecttView.width
+        height: collecttView.height
+        show: currentViewIndex === 3
     }
 
     // 若没有数据，显示导入图片视图