From 4e5b5bcb262841c621f4b03820bb700636425b66 Mon Sep 17 00:00:00 2001 From: Acclorite <140836141+Acclorite@users.noreply.github.com> Date: Sat, 28 Sep 2024 13:15:40 +0300 Subject: [PATCH] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=20Improve=20AnimatedTopAp?= =?UTF-8?q?pBar?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Corrected shown state of the top bar (always one at a time) --- .../core/components/AnimatedTopAppBar.kt | 13 +-- .../book_info/components/BookInfoTopBar.kt | 5 +- .../browse/components/top_bar/BrowseTopBar.kt | 90 ++++++++++--------- .../screens/history/HistoryScreen.kt | 10 ++- .../library/components/LibraryTopBar.kt | 87 +++++++++--------- 5 files changed, 111 insertions(+), 94 deletions(-) diff --git a/app/src/main/java/ua/acclorite/book_story/presentation/core/components/AnimatedTopAppBar.kt b/app/src/main/java/ua/acclorite/book_story/presentation/core/components/AnimatedTopAppBar.kt index b0151158..5079633d 100644 --- a/app/src/main/java/ua/acclorite/book_story/presentation/core/components/AnimatedTopAppBar.kt +++ b/app/src/main/java/ua/acclorite/book_story/presentation/core/components/AnimatedTopAppBar.kt @@ -22,9 +22,10 @@ import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.lerp +import ua.acclorite.book_story.domain.util.ID data class AnimatedTopAppBarData( - val contentVisibility: Boolean? = null, + val contentID: ID, val contentNavigationIcon: @Composable () -> Unit, val contentTitle: @Composable () -> Unit, val contentActions: @Composable RowScope.() -> Unit @@ -38,7 +39,8 @@ data class AnimatedTopAppBarData( * @param scrolledContainerColor Scrolled container color of the TopBar. * @param scrollBehavior [TopAppBarScrollBehavior]. * @param isTopBarScrolled Whether isScrolled state should be forced or not. - * @param animatedTopBars Pass a list of all [AnimatedTopAppBarData] to show. + * @param shownTopBar [ID] of the top bar to show. + * @param topBars Pass a list of all [AnimatedTopAppBarData] to show. * @param customContent Custom content below [TopAppBar]. */ @OptIn(ExperimentalMaterial3Api::class) @@ -50,7 +52,8 @@ fun AnimatedTopAppBar( scrollBehavior: TopAppBarScrollBehavior?, isTopBarScrolled: Boolean?, - animatedTopBars: List, + shownTopBar: ID, + topBars: List, customContent: @Composable ColumnScope.() -> Unit = {} ) { val animatedContainerColor = lerp( @@ -70,9 +73,9 @@ fun AnimatedTopAppBar( .background(animatedContainerColor) ) { Box(modifier = Modifier.fillMaxWidth()) { - animatedTopBars.forEach { data -> + topBars.forEach { data -> CustomAnimatedVisibility( - visible = data.contentVisibility == true, + visible = data.contentID == shownTopBar, enter = fadeIn(spring(stiffness = Spring.StiffnessMediumLow)), exit = fadeOut(spring(stiffness = Spring.StiffnessMediumLow)) ) { diff --git a/app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/BookInfoTopBar.kt b/app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/BookInfoTopBar.kt index a1fb655e..a836cb14 100644 --- a/app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/BookInfoTopBar.kt +++ b/app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/BookInfoTopBar.kt @@ -60,9 +60,10 @@ fun BookInfoTopBar( scrollBehavior = null, isTopBarScrolled = listState.canScrollBackward, - animatedTopBars = listOf( + shownTopBar = 0, + topBars = listOf( AnimatedTopAppBarData( - contentVisibility = true, + contentID = 0, contentNavigationIcon = { if ( state.value.editTitle || diff --git a/app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/top_bar/BrowseTopBar.kt b/app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/top_bar/BrowseTopBar.kt index 33047ad6..ebe81d37 100644 --- a/app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/top_bar/BrowseTopBar.kt +++ b/app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/top_bar/BrowseTopBar.kt @@ -78,13 +78,17 @@ fun BrowseTopBar(filteredFiles: List) { AnimatedTopAppBar( scrollBehavior = null, - isTopBarScrolled = isScrolled.value || inNestedDirectory.value, + isTopBarScrolled = isScrolled.value || state.value.hasSelectedItems, - animatedTopBars = listOf( + shownTopBar = when { + state.value.hasSelectedItems -> 3 + state.value.showSearch -> 2 + state.value.inNestedDirectory -> 1 + else -> 0 + }, + topBars = listOf( AnimatedTopAppBarData( - contentVisibility = !state.value.hasSelectedItems && - !state.value.showSearch && - !inNestedDirectory.value, + contentID = 0, contentNavigationIcon = {}, contentTitle = { Text( @@ -120,7 +124,7 @@ fun BrowseTopBar(filteredFiles: List) { ), AnimatedTopAppBarData( - contentVisibility = inNestedDirectory.value, + contentID = 1, contentNavigationIcon = { CustomIconButton( icon = Icons.AutoMirrored.Default.ArrowBack, @@ -165,7 +169,43 @@ fun BrowseTopBar(filteredFiles: List) { ), AnimatedTopAppBarData( - contentVisibility = state.value.hasSelectedItems, + contentID = 2, + contentNavigationIcon = { + CustomIconButton( + icon = Icons.AutoMirrored.Default.ArrowBack, + contentDescription = R.string.exit_search_content_desc, + disableOnClick = true + ) { + onEvent(BrowseEvent.OnSearchShowHide) + } + }, + contentTitle = { + CustomSearchTextField( + modifier = Modifier + .focusRequester(focusRequester) + .onGloballyPositioned { + onEvent(BrowseEvent.OnRequestFocus(focusRequester)) + }, + query = state.value.searchQuery, + onQueryChange = { + onEvent(BrowseEvent.OnSearchQueryChange(it)) + }, + onSearch = { + onEvent(BrowseEvent.OnSearch) + }, + placeholder = stringResource( + id = R.string.search_query, + stringResource(id = R.string.files) + ) + ) + }, + contentActions = { + MoreDropDown() + } + ), + + AnimatedTopAppBarData( + contentID = 3, contentNavigationIcon = { CustomIconButton( icon = Icons.Default.Clear, @@ -207,42 +247,6 @@ fun BrowseTopBar(filteredFiles: List) { onEvent(BrowseEvent.OnAddingDialogRequest) } } - ), - - AnimatedTopAppBarData( - contentVisibility = state.value.showSearch && !state.value.hasSelectedItems, - contentNavigationIcon = { - CustomIconButton( - icon = Icons.AutoMirrored.Default.ArrowBack, - contentDescription = R.string.exit_search_content_desc, - disableOnClick = true - ) { - onEvent(BrowseEvent.OnSearchShowHide) - } - }, - contentTitle = { - CustomSearchTextField( - modifier = Modifier - .focusRequester(focusRequester) - .onGloballyPositioned { - onEvent(BrowseEvent.OnRequestFocus(focusRequester)) - }, - query = state.value.searchQuery, - onQueryChange = { - onEvent(BrowseEvent.OnSearchQueryChange(it)) - }, - onSearch = { - onEvent(BrowseEvent.OnSearch) - }, - placeholder = stringResource( - id = R.string.search_query, - stringResource(id = R.string.files) - ) - ) - }, - contentActions = { - MoreDropDown() - } ) ), customContent = { diff --git a/app/src/main/java/ua/acclorite/book_story/presentation/screens/history/HistoryScreen.kt b/app/src/main/java/ua/acclorite/book_story/presentation/screens/history/HistoryScreen.kt index 9f7c2680..78728f26 100644 --- a/app/src/main/java/ua/acclorite/book_story/presentation/screens/history/HistoryScreen.kt +++ b/app/src/main/java/ua/acclorite/book_story/presentation/screens/history/HistoryScreen.kt @@ -102,9 +102,13 @@ private fun HistoryScreen() { scrollBehavior = null, isTopBarScrolled = state.value.listState.canScrollBackward, - animatedTopBars = listOf( + shownTopBar = when { + state.value.showSearch -> 1 + else -> 0 + }, + topBars = listOf( AnimatedTopAppBarData( - contentVisibility = !state.value.showSearch, + contentID = 0, contentNavigationIcon = {}, contentTitle = { Text(stringResource(id = R.string.history_screen)) @@ -133,7 +137,7 @@ private fun HistoryScreen() { ), AnimatedTopAppBarData( - contentVisibility = state.value.showSearch, + contentID = 1, contentNavigationIcon = { CustomIconButton( icon = Icons.AutoMirrored.Default.ArrowBack, diff --git a/app/src/main/java/ua/acclorite/book_story/presentation/screens/library/components/LibraryTopBar.kt b/app/src/main/java/ua/acclorite/book_story/presentation/screens/library/components/LibraryTopBar.kt index 0a6563f6..7e16065d 100644 --- a/app/src/main/java/ua/acclorite/book_story/presentation/screens/library/components/LibraryTopBar.kt +++ b/app/src/main/java/ua/acclorite/book_story/presentation/screens/library/components/LibraryTopBar.kt @@ -56,9 +56,14 @@ fun LibraryTopBar(pagerState: PagerState) { scrollBehavior = null, isTopBarScrolled = state.value.hasSelectedItems, - animatedTopBars = listOf( + shownTopBar = when { + state.value.hasSelectedItems -> 2 + state.value.showSearch -> 1 + else -> 0 + }, + topBars = listOf( AnimatedTopAppBarData( - contentVisibility = !state.value.hasSelectedItems && !state.value.showSearch, + contentID = 0, contentNavigationIcon = {}, contentTitle = { Row(verticalAlignment = Alignment.CenterVertically) { @@ -90,7 +95,45 @@ fun LibraryTopBar(pagerState: PagerState) { ), AnimatedTopAppBarData( - contentVisibility = state.value.hasSelectedItems, + contentID = 1, + contentNavigationIcon = { + CustomIconButton( + icon = Icons.AutoMirrored.Default.ArrowBack, + contentDescription = R.string.exit_search_content_desc, + disableOnClick = true + ) { + onEvent( + LibraryEvent.OnSearchShowHide + ) + } + }, + contentTitle = { + CustomSearchTextField( + modifier = Modifier + .focusRequester(focusRequester) + .onGloballyPositioned { + onEvent(LibraryEvent.OnRequestFocus(focusRequester)) + }, + query = state.value.searchQuery, + onQueryChange = { + onEvent(LibraryEvent.OnSearchQueryChange(it)) + }, + onSearch = { + onEvent(LibraryEvent.OnSearch) + }, + placeholder = stringResource( + id = R.string.search_query, + stringResource(id = R.string.books) + ) + ) + }, + contentActions = { + MoreDropDown() + }, + ), + + AnimatedTopAppBarData( + contentID = 2, contentNavigationIcon = { CustomIconButton( icon = Icons.Default.Clear, @@ -134,44 +177,6 @@ fun LibraryTopBar(pagerState: PagerState) { } } ), - - AnimatedTopAppBarData( - contentVisibility = state.value.showSearch && !state.value.hasSelectedItems, - contentNavigationIcon = { - CustomIconButton( - icon = Icons.AutoMirrored.Default.ArrowBack, - contentDescription = R.string.exit_search_content_desc, - disableOnClick = true - ) { - onEvent( - LibraryEvent.OnSearchShowHide - ) - } - }, - contentTitle = { - CustomSearchTextField( - modifier = Modifier - .focusRequester(focusRequester) - .onGloballyPositioned { - onEvent(LibraryEvent.OnRequestFocus(focusRequester)) - }, - query = state.value.searchQuery, - onQueryChange = { - onEvent(LibraryEvent.OnSearchQueryChange(it)) - }, - onSearch = { - onEvent(LibraryEvent.OnSearch) - }, - placeholder = stringResource( - id = R.string.search_query, - stringResource(id = R.string.books) - ) - ) - }, - contentActions = { - MoreDropDown() - }, - ) ), customContent = { LibraryTabRow(