change transition between list and detail.
This commit is contained in:
parent
a8a0caf3dc
commit
575b94c81b
2 changed files with 23 additions and 9 deletions
2
.idea/misc.xml
generated
2
.idea/misc.xml
generated
|
|
@ -134,6 +134,8 @@
|
||||||
<entry key="../../../../../layout/compose-model-1620504542890.xml" value="0.46511627906976744" />
|
<entry key="../../../../../layout/compose-model-1620504542890.xml" value="0.46511627906976744" />
|
||||||
<entry key="../../../../../layout/compose-model-1620504644429.xml" value="0.3796844181459566" />
|
<entry key="../../../../../layout/compose-model-1620504644429.xml" value="0.3796844181459566" />
|
||||||
<entry key="../../../../../layout/compose-model-1620505978232.xml" value="0.46511627906976744" />
|
<entry key="../../../../../layout/compose-model-1620505978232.xml" value="0.46511627906976744" />
|
||||||
|
<entry key="../../../../../layout/compose-model-1620506082418.xml" value="0.28125" />
|
||||||
|
<entry key="../../../../../layout/compose-model-1620506090849.xml" value="0.23514851485148514" />
|
||||||
<entry key="app/src/main/res/drawable-v24/ic_launcher_foreground.xml" value="0.2898148148148148" />
|
<entry key="app/src/main/res/drawable-v24/ic_launcher_foreground.xml" value="0.2898148148148148" />
|
||||||
<entry key="app/src/main/res/drawable/ic_baseline_local_library_24.xml" value="0.25462962962962965" />
|
<entry key="app/src/main/res/drawable/ic_baseline_local_library_24.xml" value="0.25462962962962965" />
|
||||||
<entry key="app/src/main/res/drawable/ic_google.xml" value="0.2962962962962963" />
|
<entry key="app/src/main/res/drawable/ic_google.xml" value="0.2962962962962963" />
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,11 @@
|
||||||
package com.pixelized.biblib.ui.composable.screen
|
package com.pixelized.biblib.ui.composable.screen
|
||||||
|
|
||||||
import androidx.compose.animation.Crossfade
|
import androidx.compose.animation.*
|
||||||
import androidx.compose.material.*
|
import androidx.compose.material.*
|
||||||
import androidx.compose.material.icons.Icons
|
import androidx.compose.material.icons.Icons
|
||||||
import androidx.compose.material.icons.sharp.ArrowBack
|
import androidx.compose.material.icons.sharp.ArrowBack
|
||||||
import androidx.compose.material.icons.sharp.LocalLibrary
|
import androidx.compose.material.icons.sharp.LocalLibrary
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.*
|
||||||
import androidx.compose.runtime.LaunchedEffect
|
|
||||||
import androidx.compose.runtime.getValue
|
|
||||||
import androidx.compose.runtime.livedata.observeAsState
|
import androidx.compose.runtime.livedata.observeAsState
|
||||||
import androidx.compose.ui.res.stringResource
|
import androidx.compose.ui.res.stringResource
|
||||||
import androidx.compose.ui.tooling.preview.Preview
|
import androidx.compose.ui.tooling.preview.Preview
|
||||||
|
|
@ -44,6 +42,7 @@ fun MainScreenComposablePreview() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@OptIn(ExperimentalAnimationApi::class)
|
||||||
@Composable
|
@Composable
|
||||||
fun MainScreenComposable(
|
fun MainScreenComposable(
|
||||||
navigation: INavigation = viewModel<NavigationViewModel>()
|
navigation: INavigation = viewModel<NavigationViewModel>()
|
||||||
|
|
@ -57,11 +56,24 @@ fun MainScreenComposable(
|
||||||
Scaffold(
|
Scaffold(
|
||||||
topBar = { ToolbarComposable(navigation) },
|
topBar = { ToolbarComposable(navigation) },
|
||||||
) {
|
) {
|
||||||
Crossfade(targetState = page) {
|
AnimatedVisibility(
|
||||||
when (it) {
|
visible = page is Page.HomePage,
|
||||||
is Page.HomePage -> HomePageComposable(navigation)
|
initiallyVisible = true,
|
||||||
is Page.Detail -> DetailPageComposable(it.book)
|
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