From 2fd528b5bdfcd3b2f17e72dfb81b9dfe5d806dc4 Mon Sep 17 00:00:00 2001
From: Super12138 <70494801+Super12138@users.noreply.github.com>
Date: Wed, 12 Feb 2025 08:58:18 +0800
Subject: [PATCH] =?UTF-8?q?refactor(appbar):=20=E6=9B=B4=E5=A5=BD=E7=9A=84?=
 =?UTF-8?q?=E5=85=83=E7=B4=A0=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ui/pages/main/components/TodoTopAppBar.kt | 59 +++++++++++++++----
 1 file changed, 47 insertions(+), 12 deletions(-)

diff --git a/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/components/TodoTopAppBar.kt b/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/components/TodoTopAppBar.kt
index 32559da..1ca1804 100644
--- a/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/components/TodoTopAppBar.kt
+++ b/app/src/main/kotlin/cn/super12138/todo/ui/pages/main/components/TodoTopAppBar.kt
@@ -3,6 +3,13 @@ package cn.super12138.todo.ui.pages.main.components
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.animateColorAsState
+import androidx.compose.animation.core.tween
+import androidx.compose.animation.expandIn
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.scaleIn
+import androidx.compose.animation.shrinkOut
+import androidx.compose.animation.togetherWith
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.exclude
@@ -26,6 +33,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.res.stringResource
@@ -52,7 +60,11 @@ fun TodoTopAppBar(
 
     TopAppBar(
         navigationIcon = {
-            AnimatedVisibility(selectedMode) {
+            AnimatedVisibility(
+                visible = selectedMode,
+                enter = fadeIn() + expandIn(expandFrom = Alignment.CenterStart, clip = false),
+                exit = shrinkOut(shrinkTowards = Alignment.CenterStart, clip = false) + fadeOut()
+            ) {
                 IconButton(
                     onClick = {
                         VibrationUtils.performHapticFeedback(view)
@@ -67,22 +79,45 @@ fun TodoTopAppBar(
             }
         },
         title = {
-            Text(
-                text = if (!selectedMode) {
-                    stringResource(R.string.app_name)
-                } else {
-                    stringResource(
-                        R.string.title_selected_count,
-                        selectedTodoIds.size
+            AnimatedContent(
+                targetState = !selectedMode,
+                transitionSpec = {
+                    (
+                            fadeIn(animationSpec = tween(100)) +
+                                    scaleIn(initialScale = 0.92f)
+                            ).togetherWith(
+                            fadeOut(animationSpec = tween(100))
+                        )
+                }
+            ) {
+                if (it) {
+                    Text(
+                        text = stringResource(R.string.app_name),
+                        maxLines = 1,
+                        overflow = TextOverflow.Ellipsis
                     )
-                },
-                maxLines = 1,
-                overflow = TextOverflow.Ellipsis
-            )
+                } else {
+                    Text(
+                        text = stringResource(
+                            R.string.title_selected_count,
+                            selectedTodoIds.size
+                        ),
+                        maxLines = 1,
+                        overflow = TextOverflow.Ellipsis
+                    )
+                }
+            }
         },
         actions = {
             AnimatedContent(
                 targetState = selectedMode,
+                transitionSpec = {
+                    (
+                            fadeIn() + scaleIn(initialScale = 0.92f)
+                            ).togetherWith(
+                            fadeOut(animationSpec = tween(90))
+                        )
+                },
                 modifier = Modifier.windowInsetsPadding(
                     WindowInsets.safeContent.exclude(WindowInsets.ime)
                 )