From f2175d1d691f79f846f29931ff12036fc528b1eb Mon Sep 17 00:00:00 2001 From: kosenda Date: Fri, 16 Aug 2024 10:15:36 +0900 Subject: [PATCH 1/2] feature: add animations in TimetableItemDetailScreen --- .../designsystem/component/ClickableLinkText.kt | 12 +++++++++--- .../sessions/component/TimetableItemDetailContent.kt | 9 ++++++++- 2 files changed, 17 insertions(+), 4 deletions(-) diff --git a/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt b/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt index 5db316957..3c1a923c1 100644 --- a/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt +++ b/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt @@ -1,5 +1,7 @@ package io.github.droidkaigi.confsched.designsystem.component +import androidx.compose.animation.animateContentSize +import androidx.compose.animation.core.tween import androidx.compose.foundation.text.ClickableText import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable @@ -20,6 +22,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 = 1000 + @Composable private fun findResults( content: String, @@ -118,9 +122,11 @@ fun ClickableLinkText( } ClickableText( - modifier = modifier.onGloballyPositioned { coordinates -> - layoutResult.value = coordinates - }, + modifier = modifier + .animateContentSize(animationSpec = tween(ClickableTextExpandAnimateDurationMillis)) + .onGloballyPositioned { coordinates -> + layoutResult.value = coordinates + }, text = annotatedString, style = style, overflow = overflow, diff --git a/feature/sessions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailContent.kt b/feature/sessions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailContent.kt index 6e05ae009..b2a3ccc9b 100644 --- a/feature/sessions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailContent.kt +++ b/feature/sessions/src/commonMain/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 }, From 95b4936a971e4be734f3a820a608b28587f2e324 Mon Sep 17 00:00:00 2001 From: kosenda Date: Fri, 16 Aug 2024 11:54:14 +0900 Subject: [PATCH 2/2] fix: change duration and add easing --- .../confsched/designsystem/component/ClickableLinkText.kt | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt b/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt index 3c1a923c1..32e648276 100644 --- a/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt +++ b/core/designsystem/src/commonMain/kotlin/io/github/droidkaigi/confsched/designsystem/component/ClickableLinkText.kt @@ -1,6 +1,7 @@ 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 @@ -22,7 +23,7 @@ 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 = 1000 +private const val ClickableTextExpandAnimateDurationMillis = 300 @Composable private fun findResults( @@ -123,7 +124,9 @@ fun ClickableLinkText( ClickableText( modifier = modifier - .animateContentSize(animationSpec = tween(ClickableTextExpandAnimateDurationMillis)) + .animateContentSize( + animationSpec = tween(ClickableTextExpandAnimateDurationMillis, easing = EaseInQuart), + ) .onGloballyPositioned { coordinates -> layoutResult.value = coordinates },