[FIX/#305] 전환 모션 수정

teamterning · Dec 12, 2024 · 3dbc4a6 · 3dbc4a6
1 parent ee68943
commit 3dbc4a6
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 14 deletions.
diff --git a/feature/calendar/src/main/java/com/terning/feature/calendar/calendar/CalendarRoute.kt b/feature/calendar/src/main/java/com/terning/feature/calendar/calendar/CalendarRoute.kt
@@ -1,6 +1,8 @@
 package com.terning.feature.calendar.calendar
 
+import androidx.compose.animation.core.Transition
 import androidx.compose.animation.core.tween
+import androidx.compose.animation.core.updateTransition
 import androidx.compose.animation.slideInHorizontally
 import androidx.compose.animation.slideInVertically
 import androidx.compose.animation.slideOutHorizontally
@@ -78,6 +80,11 @@ private fun CalendarScreen(
 ) {
     val coroutineScope = rememberCoroutineScope()
 
+    val calendarListTransition =
+        updateTransition(!uiState.isListEnabled, label = "calendarListTransition")
+    val monthWeekTransition =
+        updateTransition(!uiState.isWeekEnabled, label = "monthWeekTransition")
+
     val pagerState = rememberPagerState(
         initialPage = uiState.calendarModel.initialPage,
         pageCount = { uiState.calendarModel.pageCount }
@@ -107,7 +114,10 @@ private fun CalendarScreen(
         CalendarTopAppBar(
             date = uiState.calendarModel.getYearMonthByPage(pagerState.settledPage),
             isListExpanded = uiState.isListEnabled,
-            onListButtonClicked = onClickListButton,
+            onListButtonClicked = {
+                if(!calendarListTransition.isRunning)
+                    onClickListButton()
+            },
             onMonthNavigationButtonClicked = { direction ->
                 coroutineScope.launch {
                     pagerState.animateScrollToPage(
@@ -119,7 +129,7 @@ private fun CalendarScreen(
         )
 
         CalendarListTransition(
-            isCalendarEnabled = !uiState.isListEnabled,
+            transition = calendarListTransition,
             calendarModel = uiState.calendarModel,
             pagerState = pagerState,
             onNavigateToAnnouncement = navigateToAnnouncement,
@@ -137,7 +147,7 @@ private fun CalendarScreen(
                     )
 
                     MonthWeekTransition(
-                        isMonthEnabled = !uiState.isWeekEnabled,
+                        transition = monthWeekTransition,
                         selectedDate = uiState.selectedDate,
                         calendarModel = uiState.calendarModel,
                         pagerState = pagerState,
@@ -155,15 +165,15 @@ private fun CalendarScreen(
 /** 달력 <-> 목록 전환 컴포저블 */
 @Composable
 private fun CalendarListTransition(
-    isCalendarEnabled: Boolean,
+    transition: Transition<Boolean>,
     calendarModel: TerningCalendarModel,
     pagerState: PagerState,
     onNavigateToAnnouncement: (Long) -> Unit,
     onNavigateUpToCalendar: () -> Unit,
     calendarContent: @Composable () -> Unit,
 ) {
     ScreenTransition(
-        targetState = isCalendarEnabled,
+        transition = transition,
         transitionOne = slideInHorizontally { fullWidth -> -fullWidth } togetherWith
                 slideOutHorizontally { fullWidth -> fullWidth },
         transitionTwo = slideInHorizontally { fullWidth -> fullWidth } togetherWith
@@ -187,7 +197,7 @@ private fun CalendarListTransition(
 /**월간 <-> 주간 전환 컴포저블*/
 @Composable
 private fun MonthWeekTransition(
-    isMonthEnabled: Boolean,
+    transition: Transition<Boolean>,
     selectedDate: DayModel,
     calendarModel: TerningCalendarModel,
     pagerState: PagerState,
@@ -196,7 +206,7 @@ private fun MonthWeekTransition(
     onNavigateUpToMonth: () -> Unit,
 ) {
     ScreenTransition(
-        targetState = isMonthEnabled,
+        transition = transition,
         transitionOne = slideInVertically { fullHeight -> -fullHeight } togetherWith
                 slideOutVertically { fullHeight -> fullHeight },
         transitionTwo = slideInVertically { fullHeight -> fullHeight } togetherWith

diff --git a/...alendar/src/main/java/com/terning/feature/calendar/calendar/component/ScreenTransition.kt b/...alendar/src/main/java/com/terning/feature/calendar/calendar/component/ScreenTransition.kt
@@ -3,14 +3,13 @@ package com.terning.feature.calendar.calendar.component
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.ContentTransform
 import androidx.compose.animation.SizeTransform
+import androidx.compose.animation.core.Transition
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.res.stringResource
-import com.terning.feature.calendar.R
 
 /**
  * 두 화면 간 전환을 담당하는 컴포넌트
  *
- * @param targetState 전환할 상태
+ * @param transition [Transition]
  * @param transitionOne 첫번째 화면에서 두번쨰 화면으로 이동할 때 발생할 전환 모션
  * @param transitionTwo 두번째 화면에서 첫번째 화면으로 이동할 때 발생할 전환 모션
  * @param contentOne 첫번째 화면
@@ -19,14 +18,13 @@ import com.terning.feature.calendar.R
 
 @Composable
 fun ScreenTransition(
-    targetState: Boolean,
+    transition: Transition<Boolean>,
     transitionOne: ContentTransform,
     transitionTwo: ContentTransform,
     contentOne: @Composable () -> Unit,
     contentTwo: @Composable () -> Unit
 ) {
-    AnimatedContent(
-        targetState = targetState,
+    transition.AnimatedContent(
         transitionSpec = {
             if (targetState) {
                 transitionOne
@@ -36,7 +34,6 @@ fun ScreenTransition(
                 sizeTransform = SizeTransform(clip = true)
             )
         },
-        label = stringResource(id = R.string.calendar_animation_label)
     ) { state ->
         if (state) {
             contentOne.invoke()