A quick example repo on navigation with compose in a master detail app
UI Design by Viktoriia Chyrak
For drawing UI we use Unidirectional Data Flow
For emiting these states we use our FruitViewModel which emits the uiState
The uiState is stored as a sealed class
sealed class FruitUiState {
object Loading : FruitUiState()
data class FruitListScreenUiState(
val welcomeUserSectionUiState: WelcomeUserSectionUiState?,
val infoCardSectionUiState: InfoCardSectionUiState?,
val weeksBestSellerSectionUiState: WeeksBestSellerSectionUiState?,
val fruitListSectionUiState: FruitListSectionUiState?
) : FruitUiState()
// TODO SAME AS ABOVE
// data class FruitDetailScreenUiState()
data class Error(val exception: Exception) : FruitUiState()
}
and emited with
val uiState = fruitUiViewModelState
.map { it.toUiState() }
.stateIn(
viewModelScope,
SharingStarted.Eagerly,
fruitUiViewModelState.value.toUiState()
)
to the screen that renders the fruit list
For navigate between composable screens we are using the guide provided by official documentation at Navigating with compose