Small page refactor + detail animation.
This commit is contained in:
		
							parent
							
								
									35edef0d3a
								
							
						
					
					
						commit
						83098df743
					
				
					 2 changed files with 31 additions and 54 deletions
				
			
		| 
						 | 
				
			
			@ -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),
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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) }
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue