Compose - Navigation

Navigation Controller

• Compose 에서 화면 상태를 추적하는 Navigation Controller

기본 Navigation Controller 방법

• https://developer.android.com/jetpack/compose/navigation?hl=ko

스크린 선언

• 스크린 네비게이션을 정리해서 표현 하기 위해 sealed class 를 이용하여 선언, route 는 경로를 표현.
• NavHost 를 선언, 이동이 가능한 화면들을 선언.

sealed class NavScreen (val route: String) {
    object AuthScreen: NavScreen(Define.SCREEN_AUTH)
    object BioScreen: NavScreen(Define.SCREEN_BIO)
    object SecretNumberScreen: NavScreen(Define.SCREEN_SECRET_NUMBER)
}

@Composable
fun NavGraph (navController: NavHostController) {
    NavHost(navController = navController,
    	// 처음 노출 화면.
        startDestination = NavScreen.AuthScreen.route,) {
        composable(route = NavScreen.AuthScreen.route) {
            AuthScreen(navController)
        }
        composable(route = NavScreen.BioScreen.route) {
            BioScreen()
        }
        composable(route = NavScreen.SecretNumberScreen.route) {
            SecretNumberScreen()
        }
    }
}

화면 노출

• MainActivity 에서 onCreate 에서 다음과같이 컨트롤러를 설정해 주어 화면 노출.

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

        setContent {
           ComposeUIApplicationTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colors.background
                ) {
                    val navController = rememberNavController()
                    NavGraph(navController = navController)
                }
            }
        }
    }
}

• 첫 화면으로 설정한 AuthScreen 으로 이동.

• AuthScreen 에서는 navContoller를 받아서 이동시에 사용

@Composable
fun AuthScreen(navController: NavController) {
...
	// 특정 동작 시 다른 스크린으로 이동
   navController.navigate(NavScreen.SecretNumberScreen.route)
...