change transition between list and detail.
This commit is contained in:
		
							parent
							
								
									a8a0caf3dc
								
							
						
					
					
						commit
						575b94c81b
					
				
					 2 changed files with 23 additions and 9 deletions
				
			
		| 
						 | 
				
			
			@ -1,13 +1,11 @@
 | 
			
		|||
package com.pixelized.biblib.ui.composable.screen
 | 
			
		||||
 | 
			
		||||
import androidx.compose.animation.Crossfade
 | 
			
		||||
import androidx.compose.animation.*
 | 
			
		||||
import androidx.compose.material.*
 | 
			
		||||
import androidx.compose.material.icons.Icons
 | 
			
		||||
import androidx.compose.material.icons.sharp.ArrowBack
 | 
			
		||||
import androidx.compose.material.icons.sharp.LocalLibrary
 | 
			
		||||
import androidx.compose.runtime.Composable
 | 
			
		||||
import androidx.compose.runtime.LaunchedEffect
 | 
			
		||||
import androidx.compose.runtime.getValue
 | 
			
		||||
import androidx.compose.runtime.*
 | 
			
		||||
import androidx.compose.runtime.livedata.observeAsState
 | 
			
		||||
import androidx.compose.ui.res.stringResource
 | 
			
		||||
import androidx.compose.ui.tooling.preview.Preview
 | 
			
		||||
| 
						 | 
				
			
			@ -44,6 +42,7 @@ fun MainScreenComposablePreview() {
 | 
			
		|||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@OptIn(ExperimentalAnimationApi::class)
 | 
			
		||||
@Composable
 | 
			
		||||
fun MainScreenComposable(
 | 
			
		||||
    navigation: INavigation = viewModel<NavigationViewModel>()
 | 
			
		||||
| 
						 | 
				
			
			@ -57,11 +56,24 @@ fun MainScreenComposable(
 | 
			
		|||
    Scaffold(
 | 
			
		||||
        topBar = { ToolbarComposable(navigation) },
 | 
			
		||||
    ) {
 | 
			
		||||
        Crossfade(targetState = page) {
 | 
			
		||||
            when (it) {
 | 
			
		||||
                is Page.HomePage -> HomePageComposable(navigation)
 | 
			
		||||
                is Page.Detail -> DetailPageComposable(it.book)
 | 
			
		||||
            }
 | 
			
		||||
        AnimatedVisibility(
 | 
			
		||||
            visible = page is Page.HomePage,
 | 
			
		||||
            initiallyVisible = true,
 | 
			
		||||
            enter = slideInHorizontally(initialOffsetX = { width -> -width }),
 | 
			
		||||
            exit = slideOutHorizontally(targetOffsetX = { width -> -width }),
 | 
			
		||||
        ) {
 | 
			
		||||
            HomePageComposable(navigation)
 | 
			
		||||
        }
 | 
			
		||||
        AnimatedVisibility(
 | 
			
		||||
            visible = page is Page.Detail,
 | 
			
		||||
            initiallyVisible = false,
 | 
			
		||||
            enter = slideInHorizontally(initialOffsetX = { width -> width }),
 | 
			
		||||
            exit = slideOutHorizontally(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(it.book) }
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue