From e427baf80a7fc0bdeef42f3b83ee540e4000685e Mon Sep 17 00:00:00 2001 From: Ash Date: Mon, 8 Aug 2022 21:25:55 +0800 Subject: [PATCH] WIP: Add animation for the next article --- .../ash/reader/ui/page/home/HomeViewModel.kt | 1 - .../ui/page/home/reading/ReadingPage.kt | 49 ++++++++++++++----- .../ui/page/home/reading/ReadingViewModel.kt | 26 ++++------ 3 files changed, 45 insertions(+), 31 deletions(-) diff --git a/app/src/main/java/me/ash/reader/ui/page/home/HomeViewModel.kt b/app/src/main/java/me/ash/reader/ui/page/home/HomeViewModel.kt index cf4a7a9..342ce46 100644 --- a/app/src/main/java/me/ash/reader/ui/page/home/HomeViewModel.kt +++ b/app/src/main/java/me/ash/reader/ui/page/home/HomeViewModel.kt @@ -99,5 +99,4 @@ data class FilterState( data class HomeUiState( val pagingData: Flow> = emptyFlow(), val searchContent: String = "", - var nextArticleId: String = "" ) diff --git a/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingPage.kt b/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingPage.kt index 74b5c9e..ac67bb0 100644 --- a/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingPage.kt +++ b/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingPage.kt @@ -1,6 +1,9 @@ package me.ash.reader.ui.page.home.reading import android.util.Log +import androidx.compose.animation.* +import androidx.compose.animation.core.Spring +import androidx.compose.animation.core.spring import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.runtime.Composable @@ -17,6 +20,7 @@ import me.ash.reader.ui.ext.collectAsStateValue import me.ash.reader.ui.ext.isScrollDown import me.ash.reader.ui.page.home.HomeViewModel +@OptIn(ExperimentalAnimationApi::class) @Composable fun ReadingPage( navController: NavHostController, @@ -33,7 +37,7 @@ fun ReadingPage( } val pagingItems = homeUiState.pagingData.collectAsLazyPagingItems().itemSnapshotList - readingViewModel.recorderNextArticle(readingUiState, homeUiState, pagingItems) + readingViewModel.recorderNextArticle(pagingItems) LaunchedEffect(Unit) { navController.currentBackStackEntryFlow.collect { @@ -72,17 +76,34 @@ fun ReadingPage( // Content if (readingUiState.articleWithFeed != null) { - Content( - content = readingUiState.content ?: "", - feedName = readingUiState.articleWithFeed.feed.name, - title = readingUiState.articleWithFeed.article.title, - author = readingUiState.articleWithFeed.article.author, - link = readingUiState.articleWithFeed.article.link, - publishedDate = readingUiState.articleWithFeed.article.date, - isLoading = readingUiState.isLoading, - listState = readingUiState.listState, - isShowToolBar = isShowToolBar, - ) + AnimatedContent( + targetState = readingUiState.content ?: "", + transitionSpec = { + slideInVertically( + spring( + dampingRatio = Spring.DampingRatioNoBouncy, + stiffness = Spring.StiffnessLow, + ) + ) { height -> height / 2 } with slideOutVertically { height -> -(height / 2) } + fadeOut( + spring( + dampingRatio = Spring.DampingRatioNoBouncy, + stiffness = Spring.StiffnessLow, + ) + ) + } + ) { target -> + Content( + content = target, + feedName = readingUiState.articleWithFeed.feed.name, + title = readingUiState.articleWithFeed.article.title, + author = readingUiState.articleWithFeed.article.author, + link = readingUiState.articleWithFeed.article.link, + publishedDate = readingUiState.articleWithFeed.article.date, + isLoading = readingUiState.isLoading, + listState = readingUiState.listState, + isShowToolBar = isShowToolBar, + ) + } } // Bottom Bar if (readingUiState.articleWithFeed != null) { @@ -98,7 +119,9 @@ fun ReadingPage( readingViewModel.markStarred(it) }, onNextArticle = { - readingViewModel.nextArticle(navController, homeUiState.nextArticleId) + if (readingUiState.nextArticleId.isNotEmpty()) { + readingViewModel.initData(readingUiState.nextArticleId) + } }, onFullContent = { if (it) readingViewModel.renderFullContent() diff --git a/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingViewModel.kt b/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingViewModel.kt index 236f5a5..80b67de 100644 --- a/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingViewModel.kt +++ b/app/src/main/java/me/ash/reader/ui/page/home/reading/ReadingViewModel.kt @@ -4,7 +4,6 @@ import android.util.Log import androidx.compose.foundation.lazy.LazyListState import androidx.lifecycle.ViewModel import androidx.lifecycle.viewModelScope -import androidx.navigation.NavController import androidx.paging.ItemSnapshotList import dagger.hilt.android.lifecycle.HiltViewModel import kotlinx.coroutines.Dispatchers @@ -17,8 +16,6 @@ import me.ash.reader.data.model.article.ArticleFlowItem import me.ash.reader.data.model.article.ArticleWithFeed import me.ash.reader.data.repository.RssHelper import me.ash.reader.data.repository.RssRepository -import me.ash.reader.ui.page.common.RouteName -import me.ash.reader.ui.page.home.HomeUiState import javax.inject.Inject @HiltViewModel @@ -119,13 +116,6 @@ class ReadingViewModel @Inject constructor( } } - fun nextArticle(navController: NavController, nextArticleId: String) { - navController.popBackStack() - if (nextArticleId.isNotBlank()) { - navController.navigate("${RouteName.READING}/${nextArticleId}") - } - } - private fun showLoading() { _readingUiState.update { it.copy(isLoading = true) @@ -138,12 +128,9 @@ class ReadingViewModel @Inject constructor( } } - fun recorderNextArticle( - readingUiState: ReadingUiState, homeUiState: HomeUiState, pagingItems: - ItemSnapshotList - ) { + fun recorderNextArticle(pagingItems: ItemSnapshotList) { if (pagingItems.size > 0) { - val cur = readingUiState.articleWithFeed?.article + val cur = _readingUiState.value.articleWithFeed?.article if (cur != null) { var found = false for (item in pagingItems) { @@ -151,9 +138,13 @@ class ReadingViewModel @Inject constructor( val itemId = item.articleWithFeed.article.id if (itemId == cur.id) { found = true - homeUiState.nextArticleId = "" + _readingUiState.update { + it.copy(nextArticleId = "") + } } else if (found) { - homeUiState.nextArticleId = itemId + _readingUiState.update { + it.copy(nextArticleId = itemId) + } break } } @@ -169,4 +160,5 @@ data class ReadingUiState( val isFullContent: Boolean = false, val isLoading: Boolean = true, val listState: LazyListState = LazyListState(), + val nextArticleId: String = "", )