Small page refactor + detail animation.

This commit is contained in:
Thomas Andres Gomez 2021-05-18 16:06:53 +02:00
parent 35edef0d3a
commit 83098df743
2 changed files with 31 additions and 54 deletions

View file

@ -1,33 +1,38 @@
package com.pixelized.biblib.ui.composable.pages
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.gestures.ScrollableState
import androidx.compose.foundation.gestures.scrollable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.paging.compose.LazyPagingItems
import androidx.paging.compose.collectAsLazyPagingItems
import androidx.paging.compose.items
import com.pixelized.biblib.ui.composable.items.BookThumbnailComposable
import com.pixelized.biblib.ui.data.BookThumbnailUio
import com.pixelized.biblib.ui.viewmodel.book.IBooksViewModel
import com.pixelized.biblib.ui.viewmodel.navigation.INavigationViewModel
import com.pixelized.biblib.ui.viewmodel.navigation.INavigationViewModel.Navigable.Page
// https://issuetracker.google.com/issues/177245496
@Composable
fun HomePageComposable(
navigationViewModel: INavigationViewModel,
lazyListState: LazyListState,
scrollableState: ScrollableState,
lazyBooks: LazyPagingItems<BookThumbnailUio>,
booksViewModel: IBooksViewModel,
) {
// https://issuetracker.google.com/issues/177245496
val lazyBooks: LazyPagingItems<BookThumbnailUio> =
booksViewModel.news.collectAsLazyPagingItems()
val lazyListState = rememberLazyListState()
val scrollableState = rememberScrollState()
LazyColumn(
Modifier.scrollable(state = scrollableState, orientation = Orientation.Vertical),
contentPadding = PaddingValues(16.dp),

View file

@ -4,8 +4,6 @@ import androidx.compose.animation.*
import androidx.compose.animation.core.tween
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CutCornerShape
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
@ -21,13 +19,10 @@ import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.paging.compose.LazyPagingItems
import androidx.paging.compose.collectAsLazyPagingItems
import com.pixelized.biblib.BuildConfig
import com.pixelized.biblib.R
import com.pixelized.biblib.ui.composable.pages.DetailPageComposable
import com.pixelized.biblib.ui.composable.pages.HomePageComposable
import com.pixelized.biblib.ui.data.BookThumbnailUio
import com.pixelized.biblib.ui.theme.Animation
import com.pixelized.biblib.ui.theme.BibLibTheme
import com.pixelized.biblib.ui.viewmodel.book.BooksViewModel
@ -72,50 +67,27 @@ fun MainScreenComposable(
},
drawerContent = { DrawerContentComposable() }
) {
Box {
val lazyBooks: LazyPagingItems<BookThumbnailUio> =
booksViewModel.news.collectAsLazyPagingItems()
val lazyListState = rememberLazyListState()
val scrollableState = rememberScrollState()
HomePageComposable(
navigationViewModel = navigationViewModel,
booksViewModel = booksViewModel,
)
AnimatedVisibility(
visible = page is Page.HomePage,
initiallyVisible = true,
enter = slideInHorizontally(
animationSpec = tween(Animation.MEDIUM_DURATION),
initialOffsetX = { width -> -width }
),
exit = slideOutHorizontally(
animationSpec = tween(Animation.MEDIUM_DURATION),
targetOffsetX = { width -> -width }
),
) {
HomePageComposable(
navigationViewModel,
lazyListState,
scrollableState,
lazyBooks
)
}
}
Box {
AnimatedVisibility(
visible = page is Page.Detail,
initiallyVisible = false,
enter = slideInHorizontally(
animationSpec = tween(Animation.MEDIUM_DURATION),
initialOffsetX = { width -> width },
),
exit = slideOutHorizontally(
animationSpec = tween(Animation.MEDIUM_DURATION),
targetOffsetX = { width -> width },
),
) {
// Small trick to display the detail page during animation exit.
var currentPage by remember { mutableStateOf<Page.Detail?>(null) }
currentPage = page as? Page.Detail ?: currentPage
currentPage?.let { DetailPageComposable(booksViewModel, it.bookId) }
}
AnimatedVisibility(
visible = page is Page.Detail,
initiallyVisible = false,
enter = slideInVertically(
animationSpec = tween(Animation.MEDIUM_DURATION),
initialOffsetY = { height -> height },
),
exit = slideOutVertically(
animationSpec = tween(Animation.MEDIUM_DURATION),
targetOffsetY = { height -> height },
),
) {
// Small trick to display the detail page during animation exit.
var currentPage by remember { mutableStateOf<Page.Detail?>(null) }
currentPage = page as? Page.Detail ?: currentPage
currentPage?.let { DetailPageComposable(booksViewModel, it.bookId) }
}
}
}