diff --git a/app/ui/src/main/java/de/mm20/launcher2/ui/common/FavoritesTagSelector.kt b/app/ui/src/main/java/de/mm20/launcher2/ui/common/FavoritesTagSelector.kt index 20402af5..6c683fbc 100644 --- a/app/ui/src/main/java/de/mm20/launcher2/ui/common/FavoritesTagSelector.kt +++ b/app/ui/src/main/java/de/mm20/launcher2/ui/common/FavoritesTagSelector.kt @@ -2,6 +2,7 @@ package de.mm20.launcher2.ui.common import androidx.compose.animation.AnimatedContent import androidx.compose.animation.EnterExitState +import androidx.compose.animation.SharedTransitionScope import androidx.compose.animation.core.animateFloat import androidx.compose.foundation.ScrollState import androidx.compose.foundation.horizontalScroll @@ -53,146 +54,94 @@ fun FavoritesTagSelector( ) { val sheetManager = LocalBottomSheetManager.current - AnimatedContent( - modifier = Modifier - .fillMaxWidth() - .padding( - top = if (reverse) 8.dp else 4.dp, - bottom = if (reverse) 4.dp else 8.dp, - end = if (editButton) 8.dp else 0.dp - ), - targetState = expanded, - ) { - if (!it) { - val canScroll by remember { - derivedStateOf { scrollState.canScrollForward || scrollState.canScrollBackward } - } - Row { - Row( - modifier = Modifier - .weight(1f) - .consumeAllScrolling() - .horizontalScroll(scrollState) - .padding(end = 12.dp), - ) { - FilterChip( - modifier = Modifier - .padding(start = 16.dp), - selected = selectedTag == null, - onClick = { onSelectTag(null) }, - leadingIcon = { - Icon( - imageVector = Icons.Rounded.Star, - contentDescription = null, - modifier = Modifier.size(FilterChipDefaults.IconSize), - ) - }, - label = { Text(stringResource(R.string.favorites)) } - ) - for (tag in tags) { - TagChip( - modifier = Modifier - .padding(start = 8.dp), - tag = tag, - selected = selectedTag == tag.tag, - onClick = { - if (selectedTag == tag.tag) { - onSelectTag(null) - } else { - onSelectTag(tag.tag) - } - }, - onLongClick = { - sheetManager.showEditTagSheet(tag.tag) - } - ) - } - if (canScroll) { - val rot by transition.animateFloat { - if (it == EnterExitState.Visible) 0f else 180f - } - IconButton( - modifier = Modifier - .rotate(rot), - onClick = { onExpand(true) }) { - Icon(Icons.Rounded.ExpandMore, null) - } - } - + SharedTransitionScope { + AnimatedContent( + modifier = it + .fillMaxWidth() + .padding( + top = if (reverse) 8.dp else 4.dp, + bottom = if (reverse) 4.dp else 8.dp, + end = if (editButton) 8.dp else 0.dp + ), + targetState = expanded, + ) { + if (!it) { + val canScroll by remember { + derivedStateOf { scrollState.canScrollForward || scrollState.canScrollBackward } } - - if (editButton) { - SmallFloatingActionButton( - elevation = FloatingActionButtonDefaults.bottomAppBarFabElevation(), - onClick = { sheetManager.showEditFavoritesSheet() } + Row { + Row( + modifier = Modifier + .weight(1f) + .consumeAllScrolling() + .horizontalScroll(scrollState) + .padding(end = 12.dp), ) { - Icon( - imageVector = Icons.Rounded.Edit, - contentDescription = null - ) - } - } - } - } else { - Row( - verticalAlignment = if (reverse) Alignment.Top else Alignment.Bottom, - ) { - FlowRow( - modifier = Modifier - .weight(1f) - .padding(end = 12.dp, start = 16.dp), - ) { - FilterChip( - modifier = Modifier - .padding(end = 8.dp), - selected = selectedTag == null, - onClick = { onSelectTag(null) }, - leadingIcon = { - Icon( - imageVector = Icons.Rounded.Star, - contentDescription = null, - modifier = Modifier.size(FilterChipDefaults.IconSize), - ) - }, - label = { Text(stringResource(R.string.favorites)) } - ) - for (tag in tags) { - TagChip( + FilterChip( modifier = Modifier - .padding(end = 8.dp), - tag = tag, - selected = selectedTag == tag.tag, - onClick = { - if (selectedTag == tag.tag) { - onSelectTag(null) - } else { - onSelectTag(tag.tag) - } + .padding(start = 16.dp) + .sharedBounds( + rememberSharedContentState("favorites"), + this@AnimatedContent + ), + selected = selectedTag == null, + onClick = { onSelectTag(null) }, + leadingIcon = { + Icon( + imageVector = Icons.Rounded.Star, + contentDescription = null, + modifier = Modifier.size(FilterChipDefaults.IconSize), + ) }, - onLongClick = { - sheetManager.showEditTagSheet(tag.tag) - } + label = { Text(stringResource(R.string.favorites)) } ) - } - } + for (tag in tags) { + TagChip( + modifier = Modifier + .padding(start = 8.dp) + .sharedBounds( + rememberSharedContentState("tag-${tag.tag}"), + this@AnimatedContent + ), + tag = tag, + selected = selectedTag == tag.tag, + onClick = { + if (selectedTag == tag.tag) { + onSelectTag(null) + } else { + onSelectTag(tag.tag) + } + }, + onLongClick = { + sheetManager.showEditTagSheet(tag.tag) + } + ) + } + if (canScroll) { + val rot by transition.animateFloat { + if (it == EnterExitState.Visible) 0f else 180f + } + IconButton( + modifier = Modifier + .rotate(rot) + .sharedBounds( + rememberSharedContentState("expand"), + this@AnimatedContent + ), + onClick = { onExpand(true) }) { + Icon(Icons.Rounded.ExpandMore, null) + } + } - Column( - modifier = Modifier.fillMaxHeight(), - verticalArrangement = if (reverse) Arrangement.TopReversed else Arrangement.Bottom, - ) { - val rot by transition.animateFloat { - if (it == EnterExitState.Visible) 0f else 180f - } - IconButton( - modifier = Modifier - .rotate(rot), - onClick = { onExpand(false) } - ) { - Icon(Icons.Rounded.ExpandLess, null) } if (editButton) { SmallFloatingActionButton( + modifier = Modifier + .sharedBounds( + rememberSharedContentState("edit"), + this@AnimatedContent + ), elevation = FloatingActionButtonDefaults.bottomAppBarFabElevation(), onClick = { sheetManager.showEditFavoritesSheet() } ) { @@ -203,6 +152,82 @@ fun FavoritesTagSelector( } } } + } else { + Row( + verticalAlignment = if (reverse) Alignment.Top else Alignment.Bottom, + ) { + FlowRow( + modifier = Modifier + .weight(1f) + .padding(end = 12.dp, start = 16.dp), + ) { + FilterChip( + modifier = Modifier + .padding(end = 8.dp) + .sharedBounds(rememberSharedContentState("favorites"), this@AnimatedContent), + selected = selectedTag == null, + onClick = { onSelectTag(null) }, + leadingIcon = { + Icon( + imageVector = Icons.Rounded.Star, + contentDescription = null, + modifier = Modifier.size(FilterChipDefaults.IconSize), + ) + }, + label = { Text(stringResource(R.string.favorites)) } + ) + for (tag in tags) { + TagChip( + modifier = Modifier + .padding(end = 8.dp) + .sharedBounds(rememberSharedContentState("tag-${tag.tag}"), this@AnimatedContent), + tag = tag, + selected = selectedTag == tag.tag, + onClick = { + if (selectedTag == tag.tag) { + onSelectTag(null) + } else { + onSelectTag(tag.tag) + } + }, + onLongClick = { + sheetManager.showEditTagSheet(tag.tag) + } + ) + } + } + + Column( + modifier = Modifier.fillMaxHeight(), + verticalArrangement = if (reverse) Arrangement.TopReversed else Arrangement.Bottom, + ) { + val rot by transition.animateFloat { + if (it == EnterExitState.Visible) 0f else 180f + } + IconButton( + modifier = Modifier + .rotate(rot) + .sharedBounds(rememberSharedContentState("expand"), this@AnimatedContent), + onClick = { onExpand(false) } + ) { + Icon(Icons.Rounded.ExpandLess, null) + } + + if (editButton) { + SmallFloatingActionButton( + modifier = Modifier + .sharedBounds(rememberSharedContentState("edit"), this@AnimatedContent), + elevation = FloatingActionButtonDefaults.bottomAppBarFabElevation(), + onClick = { sheetManager.showEditFavoritesSheet() } + ) { + Icon( + imageVector = Icons.Rounded.Edit, + contentDescription = null + ) + } + } + } + } } } }