JetNavigation

A quick example repo on navigation with compose in a master detail app

UI Design by Viktoriia Chyrak

Architecture

Unidirectional Data Flow

For drawing UI we use Unidirectional Data Flow

ViewModel

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

Navigation

For navigate between composable screens we are using the guide provided by official documentation at Navigating with compose

gastsail / JetNavigation