Merge pull request DroidKaigi#505 from kosenda/feature/add-animations…

…-in-description-section-in-timetable-item-detail-screen In TimetableItemDetailScreen, add animations to DescriptionSection
Corvus400 · Aug 16, 2024 · a1a0fdc · a1a0fdc
2 parents 2f31ed1 + 95b4936
commit a1a0fdc
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 4 deletions.
diff --git a/...monMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt b/...monMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt
@@ -1,5 +1,8 @@
 package io.github.droidkaigi.confsched.designsystem.component
 
+import androidx.compose.animation.animateContentSize
+import androidx.compose.animation.core.EaseInQuart
+import androidx.compose.animation.core.tween
 import androidx.compose.foundation.text.ClickableText
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -20,6 +23,8 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextDecoration
 import androidx.compose.ui.text.style.TextOverflow
 
+private const val ClickableTextExpandAnimateDurationMillis = 300
+
 @Composable
 private fun findResults(
     content: String,
@@ -118,9 +123,13 @@ fun ClickableLinkText(
     }
 
     ClickableText(
-        modifier = modifier.onGloballyPositioned { coordinates ->
-            layoutResult.value = coordinates
-        },
+        modifier = modifier
+            .animateContentSize(
+                animationSpec = tween(ClickableTextExpandAnimateDurationMillis, easing = EaseInQuart),
+            )
+            .onGloballyPositioned { coordinates ->
+                layoutResult.value = coordinates
+            },
         text = annotatedString,
         style = style,
         overflow = overflow,

diff --git a/...in/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailContent.kt b/...in/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailContent.kt
@@ -1,5 +1,8 @@
 package io.github.droidkaigi.confsched.sessions.component
 
+import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.EnterTransition
+import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
@@ -115,7 +118,11 @@ private fun DescriptionSection(
             overflow = if (isExpand) TextOverflow.Clip else TextOverflow.Ellipsis,
         )
         Spacer(Modifier.height(16.dp))
-        if (isExpand.not()) {
+        AnimatedVisibility(
+            visible = isExpand.not(),
+            enter = EnterTransition.None,
+            exit = fadeOut(),
+        ) {
             OutlinedButton(
                 modifier = Modifier.fillMaxWidth(),
                 onClick = { isExpand = true },