perf: 优化页面性能

app/src/main/kotlin/cn/super12138/todo/ui/components/ChipGroup.kt

@@ -1,6 +1,10 @@
 package cn.super12138.todo.ui.components
 
 import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.expandIn
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.shrinkOut
 import androidx.compose.foundation.layout.ExperimentalLayoutApi
 import androidx.compose.foundation.layout.FlowRow
 import androidx.compose.foundation.layout.padding
@@ -16,6 +20,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableIntStateOf
 import androidx.compose.runtime.saveable.rememberSaveable
 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
@@ -39,29 +44,45 @@ fun FilterChipGroup(
 
     FlowRow(modifier = modifier) {
         items.forEachIndexed { index, item ->
-            FilterChip(
+            FilterChipItem(
                 selected = items[selectedItemIndex] == items[index],
+                text = item,
                 onClick = {
                     selectedItemIndex = index
                     VibrationUtils.performHapticFeedback(view)
                     onSelectedChanged(index)
-                },
+                }
-                leadingIcon = {
-                    AnimatedVisibility(
-                        visible = items[selectedItemIndex] == items[index]
-                    ) {
-                        Icon(
-                            imageVector = Icons.Outlined.Check,
-                            contentDescription = stringResource(R.string.tip_select_this),
-                            modifier = Modifier.size(FilterChipDefaults.IconSize)
-                        )
-                    }
-                },
-                label = {
-                    Text(item)
-                },
-                modifier = Modifier.padding(end = 10.dp)
             )
         }
     }
+}
+
+@Composable
+fun FilterChipItem(
+    selected: Boolean,
+    text: String,
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier
+) {
+    FilterChip(
+        selected = selected,
+        onClick = onClick,
+        leadingIcon = {
+            AnimatedVisibility(
+                visible = selected,
+                enter = expandIn(expandFrom = Alignment.CenterStart) + fadeIn(),
+                exit = shrinkOut(shrinkTowards = Alignment.CenterStart) + fadeOut()
+            ) {
+                Icon(
+                    imageVector = Icons.Outlined.Check,
+                    contentDescription = stringResource(R.string.tip_select_this),
+                    modifier = Modifier.size(FilterChipDefaults.IconSize)
+                )
+            }
+        },
+        label = {
+            Text(text)
+        },
+        modifier = Modifier.padding(end = 10.dp)
+    )
 }

app/src/main/kotlin/cn/super12138/todo/ui/pages/main/MainPage.kt

@@ -51,7 +51,7 @@ fun MainPage(
     animatedVisibilityScope: AnimatedVisibilityScope,
     modifier: Modifier = Modifier
 ) {
-    val toDoList = viewModel.sortedTodos.collectAsState(initial = emptyList())
+    val toDos = viewModel.sortedTodos.collectAsState(initial = emptyList())
     val listState = rememberLazyListState()
     /*val isExpanded by remember {
         derivedStateOf {
@@ -59,20 +59,25 @@ fun MainPage(
         }
     }*/
 
-    val selectedTodoIds = viewModel.selectedTodoIds.collectAsState()
+    val selectedTodos = viewModel.selectedTodoIds.collectAsState()
     var showDeleteConfirmDialog by rememberSaveable { mutableStateOf(false) }
 
     val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
 
+    val selectedTodoIds by remember {
+        derivedStateOf { selectedTodos.value }
+    }
     val isSelectedIdsEmpty by remember {
         derivedStateOf {
-            selectedTodoIds.value.isEmpty()
+            selectedTodoIds.isEmpty()
         }
     }
 
+    val toDoList by remember { derivedStateOf { toDos.value } }
+
     val showCompleted = viewModel.showCompletedTodos
     val filteredTodoList =
-        if (showCompleted) toDoList.value else toDoList.value.filter { item -> !item.isCompleted }
+        if (showCompleted) toDoList else toDoList.filter { item -> !item.isCompleted }
 
     BackHandler(enabled = !isSelectedIdsEmpty) {
         // 当按下返回键（或进行返回操作）时清空选择
@@ -82,7 +87,7 @@ fun MainPage(
     Scaffold(
         topBar = {
             TodoTopAppBar(
-                selectedTodoIds = selectedTodoIds.value,
+                selectedTodoIds = selectedTodoIds,
                 selectedMode = !isSelectedIdsEmpty,
                 onCancelSelect = { viewModel.clearAllTodoSelection() },
                 onSelectAll = { viewModel.toggleAllSelected() },
@@ -118,8 +123,8 @@ fun MainPage(
         if (windowSizeClass.windowWidthSizeClass == WindowWidthSizeClass.COMPACT) {
             Column(modifier = Modifier.padding(innerPadding)) {
                 ProgressFragment(
-                    totalTasks = toDoList.value.size,
+                    totalTasks = toDoList.size,
-                    completedTasks = toDoList.value.count { it.isCompleted },
+                    completedTasks = toDoList.count { it.isCompleted },
                     modifier = Modifier
                         .weight(2f)
                         .fillMaxSize()
@@ -153,7 +158,7 @@ fun MainPage(
                             viewModel.playConfetti()
                         }
                     },
-                    selectedTodoIds = selectedTodoIds.value,
+                    selectedTodoIds = selectedTodoIds,
                     sharedTransitionScope = sharedTransitionScope,
                     animatedVisibilityScope = animatedVisibilityScope,
                     modifier = Modifier
@@ -164,8 +169,8 @@ fun MainPage(
         } else {
             Row(modifier = Modifier.padding(innerPadding)) {
                 ProgressFragment(
-                    totalTasks = toDoList.value.size,
+                    totalTasks = toDoList.size,
-                    completedTasks = toDoList.value.count { it.isCompleted },
+                    completedTasks = toDoList.count { it.isCompleted },
                     modifier = Modifier
                         .weight(2f)
                         .fillMaxSize()
@@ -198,7 +203,7 @@ fun MainPage(
                             viewModel.playConfetti()
                         }
                     },
-                    selectedTodoIds = selectedTodoIds.value,
+                    selectedTodoIds = selectedTodoIds,
                     sharedTransitionScope = sharedTransitionScope,
                     animatedVisibilityScope = animatedVisibilityScope,
                     modifier = Modifier
@@ -212,7 +217,7 @@ fun MainPage(
     WarningDialog(
         visible = showDeleteConfirmDialog,
         icon = Icons.Outlined.Delete,
-        description = stringResource(R.string.tip_delete_task, selectedTodoIds.value.size),
+        description = stringResource(R.string.tip_delete_task, selectedTodoIds.size),
         onConfirm = { viewModel.deleteSelectedTodo() },
         onDismiss = { showDeleteConfirmDialog = false }
     )