[Android] Navigation - Navigation 2 → 3

본 게시글에서 다룬 앱의 전체 소스 코드는 #5에 있습니다.

 

#1 개요

기존 Android Navigation 라이브러리는 "Jetpack Navigation 2"였다. 다음 세대인 "Jetpack Navigation 3"이 출시되었는데, 2와 3 각각의 라이브러리를 사용하여 샘플 앱을 하나씩 만들어본다. 그리고 Navigation 3의 구조로부터 (2 대비) 어떤 긍정적 효과를 꾀했는지 살펴본다. 샘플 앱은 최소한의 코드로 구성해 하나의 파일(MainActivity.kt)에 때려 박았다. 공부 면에선 파일을 나누는 것보다 오히려 더 직관적이라는 판단에서다.

 

#2 Jetpack Navigation 2

탐색 | App architecture | Android Developers

 

#2-1 도식도

```Mermaid %%{init: { "flowchart": { "defaultRenderer": "elk", "curve": "basis", "nodeSpacing": 45, "rankSpacing": 70 }, "themeVariables": { "clusterBkg": "#eaeaea", "clusterBorder": "#f0f1f2", "mainBkg": "#fafafd", "primaryColor": "#fafafd", "textColor": "#202020", "primaryTextColor": "#202020", "tertiaryTextColor": "#202020", "background": "#ffffff", "edgeLabelBackground": "#ffffff" }, "themeCSS": ".cluster-label text { font-size: 20px !important; font-weight: 700 !important; }" }}%% flowchart LR subgraph appGroup["MainActivity.kt (앱 화면)"] direction TB MyApp HomeDestination["HomeDestination"] ArticleDestination["ArticleDestination(id)"] SettingDestination["SettingDestination"] end subgraph frameworkGroup["androidx.navigation (Navigation 2 프레임워크)"] direction TB NavHost NavController end MyApp -->|"생성 및 backStack 상태 구독"| NavController MyApp -->|호출| NavHost NavHost -->|참조| NavController NavHost -->|목적지 등록| HomeDestination NavHost -->|목적지 등록| ArticleDestination NavHost -->|목적지 등록| SettingDestination HomeDestination -->|호출| NavController ArticleDestination -->|호출| NavController SettingDestination -->|호출| NavController classDef myAppNode stroke:#64748B,stroke-width:3px class MyApp myAppNode classDef navHostNode stroke:#3B82F6,stroke-width:3px class NavHost navHostNode classDef navControllerNode stroke:#A855F7,stroke-width:3px class NavController navControllerNode classDef homeDestNode stroke:#EAB308,stroke-width:3px class HomeDestination homeDestNode classDef articleDestNode stroke:#06B6D4,stroke-width:3px class ArticleDestination articleDestNode classDef settingDestNode stroke:#F97316,stroke-width:3px class SettingDestination settingDestNode linkStyle 0 stroke:#64748B,stroke-width:3.5px linkStyle 1 stroke:#64748B,stroke-width:3.5px linkStyle 2 stroke:#3B82F6,stroke-width:3.5px linkStyle 3 stroke:#3B82F6,stroke-width:3.5px linkStyle 4 stroke:#3B82F6,stroke-width:3.5px linkStyle 5 stroke:#3B82F6,stroke-width:3.5px linkStyle 6 stroke:#EAB308,stroke-width:3.5px linkStyle 7 stroke:#06B6D4,stroke-width:3.5px linkStyle 8 stroke:#F97316,stroke-width:3.5px ```

 

#2-2 MainActivity

package com.example.navigation2basics

...
import androidx.navigation.NavGraph
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController
import androidx.navigation.toRoute
...
import kotlinx.serialization.Serializable

@Serializable
data object Home

@Serializable
data class Article(val id: String)

@Serializable
data object Setting

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            Navigation2BasicsTheme {
                MyApp()
            }
        }
    }
}

@SuppressLint("RestrictedApi")
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyApp() {
    val navController = rememberNavController()
    val backStack by navController.currentBackStack.collectAsState() // 백스택이 NavHostController 자체에 박혀있는 모습
    val backStackSize = backStack.count {
        it.destination !is NavGraph // "!is NavGraph"가 없으면 'Root NavGraph' 등 내가 신경쓰지 않아도 되는 것들까지 다 size로서 잡혀버린다
    }

    Scaffold(
        modifier = Modifier.fillMaxSize(),
        topBar = {
            TopAppBar(
                title = { Text("Back stack size: $backStackSize") },
            )
        },
    ) { innerPadding ->
        NavHost(
            navController = navController,
            startDestination = Home,
            modifier = Modifier.padding(innerPadding),
        ) {
            composable<Home> {
                HomeRoute(
                    navigateToArticle = { articleId ->
                        navController.navigate(Article(articleId))
                    },
                    navigateToSetting = {
                        navController.navigate(Setting)
                    }
                )
            }

            composable<Article> { backStackEntry ->
                val article = backStackEntry.toRoute<Article>()

                ArticleRoute(
                    id = article.id,
                    navigateToHome = {
                        navController.navigate(Home)
                    },
                    navigateToSetting = {
                        navController.navigate(Setting)
                    },
                )
            }

            composable<Setting> {
                SettingRoute(
                    navigateToHome = {
                        navController.navigate(Home)
                    },
                    navigateToArticle = { articleId ->
                        navController.navigate(Article(articleId))
                    },
                )
            }
        }
    }
}

@Composable
fun HomeRoute(
    navigateToArticle: (String) -> Unit,
    navigateToSetting: () -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("Home")

        Button(
            onClick = {
                navigateToArticle("7")
            }
        ) {
            Text("Go to 7th Article")
        }

        Button(
            onClick = {
                navigateToSetting()
            }
        ) {
            Text("Go to Setting")
        }
    }
}

@Composable
fun ArticleRoute(
    id: String,
    navigateToHome: () -> Unit,
    navigateToSetting: () -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("${id}th Article")

        Button(
            onClick = {
                navigateToHome()
            }
        ) {
            Text("Go to Home")
        }

        Button(
            onClick = {
                navigateToSetting()
            }
        ) {
            Text("Go to Setting")
        }
    }
}

@Composable
fun SettingRoute(
    navigateToHome: () -> Unit,
    navigateToArticle: (String) -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("Setting")

        Button(
            onClick = {
                navigateToHome()
            }
        ) {
            Text("Go to Home")
        }

        Button(
            onClick = {
                navigateToArticle("8")
            }
        ) {
            Text("Go to 8th Article")
        }
    }
}

 

#2-3 NavHost()

// in NavHost.kt

package androidx.navigation.compose

@Composable public fun NavHost(
    navController: NavHostController,
    startDestination: Any,
    modifier: Modifier = Modifier,
    ...
    builder: NavGraphBuilder.() -> Unit
): Unit

composable은NavGraphBuilder의 확장 함수다. 즉,

 

NavHost(
    ...
) {
    composable<Home> {
        HomeRoute(
            navigateToArticle = { articleId ->
                navController.navigate(Article(articleId))
            },
            navigateToSetting = {
                navController.navigate(Setting)
            }
        )
    }
    
    composable<Article> {
        ...
    }
    
    ...
}

에서,

 

 composable()
 = this.composable()
 = navGraphBuilder.composable()

NavGraphBuilder.composable() 함수가 수행되는 만큼, Navigation에 목적지(= Navigation 2에서 Destination이라고 표현)가 추가되는 셈이다.

 

#2-4 NavController

Jetpack Navigation 2 라이브러리(androidx.navigation)에서 제공하는 Navigation 상태 관리 클래스다. "라이브러리에서 기본 제공"한다는 점이 중요하다. 이것이 Navigation 3와 대비되는 지점이기 때문이다. NavController 내부에는 백스택이 존재하는데, (라이브러리에 의해) 자동으로 관리된다. 그 때문에 네비게이션 동작이 꽤 복잡한 경우가 아니라면 개발자가 만질 필요가 없다. 가령 NavController.navigate() 등을 사용자가 호출하면, NavController가 이 백스택에 알아서 화면을 넣고, '뒤로 가기'가 호출되면 반대로 알아서 pop()을 수행한다.

 

#2-5 참조: Now in android에서의 쓰임

Now in Android - Jetpack Navigation 2가 적용된 구조 분석

Navigation 2가 쓰인 d438a00 커밋 시점의 Now in Android를 분석한 게시글이다.

 

#3 Jetpack Navigation 3

탐색 3 | App architecture | Android Developers

 

#3-1 도식도

```Mermaid %%{init: { "flowchart": {"defaultRenderer": "elk", "curve": "basis", "nodeSpacing": 45, "rankSpacing": 70 }, "themeVariables": { "clusterBkg": "#eaeaea", "clusterBorder": "#f0f1f2", "mainBkg": "#fafafd", "primaryColor": "#fafafd", "textColor": "#202020", "primaryTextColor": "#202020", "tertiaryTextColor": "#202020", "background": "#ffffff", "edgeLabelBackground": "#ffffff" }, "themeCSS": ".cluster-label text { font-size: 20px !important; font-weight: 700 !important; }" }}%% flowchart LR subgraph appGroup["MainActivity.kt (앱 화면)"] direction TB MyApp NavBackStack["NavBackStack (backStack)
예: [Home, Article(7), Setting]"] HomeKey["Home : NavKey"] ArticleKey["Article(id) : NavKey"] SettingKey["Setting : NavKey"] end subgraph frameworkGroup["androidx.navigation3 (Navigation 3 프레임워크)"] direction TB EntryProvider NavEntry["NavEntry
예: [HomeRoute, ArticleRoute, SettingRoute]"] NavDisplay end MyApp -->|"생성 및 pop 콜백(onBack) 정의"| NavBackStack MyApp -->|호출| NavDisplay NavDisplay -->|참조| NavBackStack NavDisplay -->|참조| EntryProvider HomeKey -->|resolve| EntryProvider ArticleKey -->|resolve| EntryProvider SettingKey -->|resolve| EntryProvider EntryProvider -->|"Key → NavEntry 변환"| NavEntry NavDisplay -->|참조| NavEntry NavEntry -->|호출| NavBackStack classDef myAppNode stroke:#64748B,stroke-width:3px class MyApp myAppNode classDef navDisplayNode stroke:#3B82F6,stroke-width:3px class NavDisplay navDisplayNode classDef backStackNode stroke:#A855F7,stroke-width:3px class NavBackStack backStackNode classDef entryProviderNode stroke:#EAB308,stroke-width:3px class EntryProvider entryProviderNode classDef homeKeyNode stroke:#06B6D4,stroke-width:3px class HomeKey homeKeyNode classDef articleKeyNode stroke:#F97316,stroke-width:3px class ArticleKey articleKeyNode classDef settingKeyNode stroke:#EC4899,stroke-width:3px class SettingKey settingKeyNode classDef navEntryNode stroke:#10B981,stroke-width:3px class NavEntry navEntryNode linkStyle 0 stroke:#64748B,stroke-width:3.5px linkStyle 1 stroke:#64748B,stroke-width:3.5px linkStyle 2 stroke:#3B82F6,stroke-width:3.5px linkStyle 3 stroke:#3B82F6,stroke-width:3.5px linkStyle 4 stroke:#06B6D4,stroke-width:3.5px linkStyle 5 stroke:#F97316,stroke-width:3.5px linkStyle 6 stroke:#EC4899,stroke-width:3.5px linkStyle 7 stroke:#EAB308,stroke-width:3.5px linkStyle 8 stroke:#3B82F6,stroke-width:3.5px linkStyle 9 stroke:#10B981,stroke-width:3.5px ```

NavEntry는 목적지(Destination)를 의미하며, 실제 화면("composable content")와 다양한 정보("metadata") 등을 지니는 객체다. 또, 목적지 별로 Key 개념이 생겼다. 목적지가 통째로 관리되는 것이 아니라 Key(이름표)를 통해 가볍게 관리되는 것이다. 이에 따라 EntryProvider라는 클래스도 생겼는데, Key를 NavEntry로 연결(변환) 짓는 역할을 수행한다. 프로그래머가 Key만 신경 써주면, EntryProvider에 의해 UI가 알아서(선언적으로) 갱신되는 식이다.

NavEntry가 NavBackStack에 의존한다는 것은 이론상으로는 옳을 수 있지만, 사실 실무적으로는 거의 틀린 말이다. 어떤 목적지 A에서 B로 가는 이벤트가 발생할 때, 즉, A Entry에서 B Entry로 갈 때 NavBackStack을 A가 직접 조작하는 경우는 없을 것이기 때문이다. 실제 서비스되는 앱이라면, 대부분 A는 "app" 모듈로부터 해당 이벤트를 State Hoisting으로 전달받아 쓸 것이다.

 

#3-2 MainActivity

package com.example.navigation3basics

...
import androidx.navigation3.runtime.NavKey
import androidx.navigation3.runtime.entryProvider
import androidx.navigation3.runtime.rememberNavBackStack
import androidx.navigation3.ui.NavDisplay
...
import kotlinx.serialization.Serializable

@Serializable
data object Home : NavKey

@Serializable
data class Article(val id: String) : NavKey

@Serializable
data object Setting : NavKey

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()

        setContent {
            Navigation3BasicsTheme {
                MyApp()
            }
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyApp() {
    val backStack = rememberNavBackStack(Home)

    Scaffold(
        modifier = Modifier.fillMaxSize(),
        topBar = {
            TopAppBar(
                title = {
                    Text("Back stack size: ${backStack.size}")
                },
            )
        },
    ) { innerPadding ->

        NavDisplay(
            backStack = backStack,
            modifier = Modifier.padding(innerPadding),
            onBack = {
                backStack.removeLastOrNull()
            },
            entryProvider = entryProvider {
                entry<Home> {
                    HomeRoute(
                        navigateToArticle = { articleId ->
                            backStack.add(Article(articleId))
                        },
                        navigateToSetting = {
                            backStack.add(Setting)
                        },
                    )
                }

                entry<Article> { article ->
                    ArticleRoute(
                        id = article.id,
                        navigateToHome = {
                            backStack.add(Home)
                        },
                        navigateToSetting = {
                            backStack.add(Setting)
                        },
                    )
                }

                entry<Setting> {
                    SettingRoute(
                        navigateToHome = {
                            backStack.add(Home)
                        },
                        navigateToArticle = { articleId ->
                            backStack.add(Article(articleId))
                        },
                    )
                }
            },
        )
    }
}

@Composable
fun HomeRoute(
    navigateToArticle: (String) -> Unit,
    navigateToSetting: () -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("Home")

        Button(
            onClick = {
                navigateToArticle("7")
            }
        ) {
            Text("Go to 7th Article")
        }

        Button(
            onClick = {
                navigateToSetting()
            }
        ) {
            Text("Go to Setting")
        }
    }
}

@Composable
fun ArticleRoute(
    id: String,
    navigateToHome: () -> Unit,
    navigateToSetting: () -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("${id}th Article")

        Button(
            onClick = {
                navigateToHome()
            }
        ) {
            Text("Go to Home")
        }

        Button(
            onClick = {
                navigateToSetting()
            }
        ) {
            Text("Go to Setting")
        }
    }
}

@Composable
fun SettingRoute(
    navigateToHome: () -> Unit,
    navigateToArticle: (String) -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.SpaceEvenly,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Text("Setting")

        Button(
            onClick = {
                navigateToHome()
            }
        ) {
            Text("Go to Home")
        }

        Button(
            onClick = {
                navigateToArticle("8")
            }
        ) {
            Text("Go to 8th Article")
        }
    }
}

코드에서 가장 눈에 띄는 차이는 바로 NavController가 제거되었다는 점이다. 그리고 NavController가 알아서 관리해 주던 백스택을 이제 프로그래머인 우리가 직접 관리한다. 그래도 편의를 위한 rememberNavBackStack()라는 헬퍼 함수는 제공한다. 일반적으로는 저 함수로 백스택 객체를 생성하면 된다.

 

#3-3 뉘앙스의 차이

단어 별로 뉘앙스의 차이를 곱씹어보면, 2 → 3 변화에 대한 이해가 더 깊어진다.

NavController → 제거됨
NavController가 back stack 소유 → 우리(프로그래머)가 소유ㆍ관리하게 바뀜
NavController.navigate() → (우리가 직접) Key를 back stack에 추가
Destination → Entry
Navigation Graph → 제거됨
Navigation Graph에 목적지(Destination) 하나 등록 → EntryProvider에서 (Key → Entry) 규칙 하나 추가
startDestination → BackStack의 초기 Key
NavHost → NavDisplay

Destination → Entry
Destination(목적지, 도착지)는 Entry(어떤 자료 구조 안에 들어 있는 항목 하나)로 바뀌었다. 자료 구조라 함은 바로 백스택을 암시한다. Destination이라는 표현도 여전히 쓰긴 한다.

 

Navigation Graph에 목적지(Destination) 하나 등록 → EntryProvider에서 (Key → Entry) 규칙 하나 추가

사용자는 NavHost를 통해 네비게이션 그래프를 그렸다. Navigation 3에서는 네비게이션 그래프를 구성했던 Destination들을 EntryProvider로 옮겨야 한다. 하지만, 이 둘은 중요한 차이가 있다. Entry는 Entry 간 부모-자식 관계를 이루지 않는다는 점이다. 즉 '자료 구조적'으로는 계층이 없는 수평 관계다. 하지만 사용자의 설계하기에 따라 논리적 계층은 얼마든지 존재할 수 있다. 가령, 반드시 Home을 거쳐 Article로 전환되도록 프로그래머가 강제할 수 있다.

 

NavHost → NavDisplay

Navigation Graph에 따른 현재 Destination의 UI를 관리(Hosting)하는 NavHost는, Navigation Graph가 사라짐에 따라 필요가 없어졌다. NavHost는 비슷한 역할의 NavDisplay로 대체되었는데 이 이름은, (프로그래머가 관리하는 백스택에 종속되어) 그저 스택 최상단에 있는 것(Entry)을 표시(Display)할 뿐이라는 뉘앙스를 지닌다.

 

#3-4 EntryProvider

// in EntryProvider.kt

package androidx.navigation3.runtime

public inline fun <T : Any> entryProvider(
    noinline fallback: (unknownScreen: T) -> NavEntry<T> = {
        throw IllegalStateException("Unknown screen $it")
    },
    builder: EntryProviderScope<T>.() -> Unit,
): (T) -> NavEntry<T> = EntryProviderScope(fallback).apply(builder).build()


↓ ↓ ↓ 쉽게 풀어쓴 버전 ↓ ↓ ↓


fun <T : Any> entryProvider(
    fallback: (T) -> NavEntry<T>,
    builder: EntryProviderScope<T>.() -> Unit,
): (T) -> NavEntry<T> {

    // 1. Entry 등록 정보를 담을 객체 생성 (≈ 아이템을 담을 List)
    val scope = EntryProviderScope<T>(fallback)

    // 2. 사용자가 작성한 DSL 실행
    scope.builder() 

    // 3. 등록 정보를 바탕으로, Key -> NavEntry 변환 함수 생성
    val provider = scope.build()

    // 4. 그 함수를 반환
    return provider
}

builder라는 매개변수 명이나 전체적인 흐름을 통해, builder 패턴을 쓰고 있음이 보인다. fallback은 모르는 NavKey가 들어왔을 때 어떻게 해야 하는지를 담는다. 분기문에서의 'else'와 같은 역할을 수행하는 것이다. "사용자가 작성한 DSL 실행"은 #3-2에 있는,

 

// 아래 함수가 builder()라는 이름으로 entryProvider()에 전달된다.
entry<Article> { article ->
    ArticleRoute(
        id = article.id,
        navigateToHome = {
            backStack.add(Home)
        },
        navigateToSetting = {
            backStack.add(Setting)
        },
    )
}

와 같은 코드를 실행함을 의미한다. 설명을 위해 entryProvider()를 하드 코딩하여 변형해보면,

 

fun <T : Any> entryProvider(
    fallback: (T) -> NavEntry<T>,
    builder: EntryProviderScope<T>.() -> Unit,
): (T) -> NavEntry<T> {

    // 1. Entry 등록 정보를 담을 객체 생성 (≈ 아이템을 담을 List)
    val scope = EntryProviderScope<T>(fallback)

    // 2. 사용자가 작성한 DSL 실행
    scope.entry<Home> {
        HomeRoute(
            ...
        )
    }
    
    scope.entry<Article> { article ->
        ArticleRoute(
            ...
        )
    }
    
    scope.entry<Setting> {
        ...
    }

    // 3. 등록 정보를 바탕으로, Key -> NavEntry 변환 함수 생성
    val provider = scope.build()

    // 4. 그 함수를 반환
    return provider
}

와 같은 코드가 된다.

 

#3-5 백스택 관리

Entry가 계층(부모-자식) 관계를 이루지 않는다면, 백스택 관리는 프로그래머의 몫인가? 그렇다. 간단한 앱에서는 관리가 어렵지 않겠지만, 앱이 커지면 부담이 점점 늘 것이다. Navigation Graph를 만들지 않아도 된다는 것은 장점이지만, 최소한의 백스택 조작 코드가 요구된다는 것은 단점일 수 있겠다. 앱이 커지는 경우엔, 별도의 백스택 관리 클래스를 만드는 것이 일반적이다. #3-6에 있는 Now in Android처럼 말이다.

 

#3-6 참조: Now in android에서의 쓰임

현재 게시글 작성 중

Navigation 3가 쓰인, 068d8cc 커밋 시점의 Now in Android를 분석한 게시글이다. 이 프로젝트에서는 백스택의 관리를 위해 NiaNavigator라는 전용 클래스를 만들어 백스택 관리의 책임을 몰아넣었다.

 

#4 결론

Jetpack Navigation 2 → 3로,

• 백스택 소유 및 관리의 책임이 라이브러리에서 앱(프로그래머)의 책임으로 넘어왔다. 따라서 앱의 책임과 자유도가 함께 커졌다. 앱의 규모가 작다면 Navigation 3가 오히려 불리하다. 하지만 규모가 커질수록, (프로그래머 입장에서) 목적지 전환 로직을 짜기 쉽다는 이점이 강화된다.
• Key 개념이 생겼다. Key는 백스택에 들어간다. 이는 실제 목적지는 아니고, 목적지에 대응하는 이름표다. 이렇게 분리한 이유는 (원래는 NavController가 수행하던) 목적지 전환 로직과 화면에 UI를 그리는 로직을 분리하기 위함이다. 전자는 (백스택을 조작하는) 프로그래머가, 후자는 NavDisplay가 담당한다. EntryProvider는 그 중간에서 Key → Entry 변환을 수행한다.
• Compose와 더 단순하게 통합된다. 백스택 자체가 앱이 소유하는 State가 되고, NavDisplay가 이를 관찰하여 UI를 갱신하는 구조이기 때문이다.
• 본 게시글에서 다루진 않았지만, 여러 destination을 동시에 사용하는 adaptive layout이 가능하다. 백스택 최상단에 있는 (Key에 대응하는) 단일 Entry 표시를 넘어, 2개 이상의 Entry를 표시하는 식이다.

 

#5 소스 코드

#5-1 Navigation 2

android-practice/navigation/Navigation2Basics at master · Kanmanemone/android-practice

 

#5-2 Navigation 3

android-practice/navigation/Navigation3Basics at master · Kanmanemone/android-practice