반응형 Android Jetpack Compose/Navigation, Route8 Bottom Navigation 구현방법 총정리 # Route 오늘은 BottomNavigation 의 구현방법에 대해서 정리해 보도록 하겠습니다. BottomNavigation을 구현하기 위해서는, Jetpack Compose Navigation 구현방법에 대해서 알고 있으면 도움이 되는데요. 이에 관해서는 아래 글을 참조해 주세요. >> Navigation 구현 방법 총정리 # Route Jetpack Compose 1. Route 정의 먼저 BottomNavigation 에서 사용할 Route 들을 sealed class 로 정의해 주겠습니다. badge count 를 활용하기 위해서, badgeCount 를 넣어주었습니다. sealed class Screen( val route: String, val title: String, val icon: Image.. 2023. 5. 29. Navigation 구현 방법 총정리 # Route Jetpack Compose 오늘은 Jetpack Compose 에서 구현하는 Navigation 에 대해서 정리해 보도록 하겠습니다. 1. Navigation Library 가장 먼저 준비할 것은 navigation 구현을 위해 라이브러리를 implement 하는 것 입니다. 아래의 라이브러리들이 모두 이 글의 예제를 구현하는데 필수적인 것은 아니지만, navigation과 viewModel, savedState 등을 같이 사용하기에 도움을 주는 라이브러리이므로 포함시켰습니다. app레벨의 build.gradle에 implement 시켜주면 됩니다. dependencies { def nav_version = "2.5.3" implementation "androidx.navigation:navigation-compose:$nav_v.. 2023. 5. 27. Nested Navigation 구현 및 총정리 # 중첩 Route Jetpack Compose 실제 앱을 만들다보면, Navigation Graph가 복잡해 지게 됩니다. 중첩된, 즉 nested navigation이 필요하기 때문인데요. 오늘은 Jetpack Compose 에서 Nested Navigation 을 구현하는 방법에 대해서 정리해 보겠습니다. 이 글을 이해하기 위해서는 Jetpack Compose Navigation 구현방법에 대해서 알고 있어야 하는데요. 이에 관해서는 아래 글을 참조해 주세요. >> Navigation 구현 방법 총정리 # Route Jetpack Compose 1. 라이브러리 Implementation 이 글에 나오는 코드를 구현하기 위해서, 아래 라이브러리들이 app레벨의 build.gradle에 implement 되어야 합니다. dependencies { d.. 2023. 5. 26. 다른 Origin 에서 들어오는 route 에 대한 처리 방법 # Jetpack Compose Navigation 오늘은 각각 다른 origin(출발지)에서 공유되는 Screen 으로 route가 들어오는 경우, 그것의 처리 방법에 대해서 정리해 보도록 하겠습니다. 1. 큰 그림 각각 다른 Origin에서 들어오는 경우의 생각해야 할 문제점은, 다른 UI에서 각각 다른 데이터를 들고 들어온다는 것 입니다. 이것은 origin 별로 다르게 데이터를 처리해서 보여주어야 한다는 것을 의미합니다. 이 문제를 해결하기 위한 방법은 여러가지이겠지만, 다음과 같은 방법이 있을 수 있겠네요. 우선은 isFromXXOrigin 이라는 boolean 을 route의 argument 로 받아서, 그것을 보고 각기 다르게 처리하는 방식이구요. 다른 하나는 Sealed Class를 사용해서 route를 구분해서 받는 것 입니다. isFro.. 2023. 4. 27. 공유되는 Route 의 Navigation 구현방법 # Jetpack Compose Jetpack Compose의 Navigation을 사용할 때, 페이지가 교차되는 Route 가 존재하는 경우가 생기게 되는데요. 오늘은 이런 교차되는 혹은 공유되는 Route 의 구현 방법에 대해서 정리해 보도록 하겠습니다. 다만, 이 글은 Jetpack Compose 의 Navigation의 기본 구현방법에 대해서는 다루지 않습니다. 1. 큰 그림 다음과 같은 형태의 NavigationGraph 가 있다고 가정해 보겠습니다. Main페이지에는 Home과 Profile 이 존재하는데, 둘다 같은 Settings로 routing 되어야 합니다. Home -> Settings Profile -> Settings 2023. 4. 22. Route 에서 전달된 값을 ViewModel 에서 받는 방법 # Jetpack Compose Navigaion savedStateHandle 오늘은 Route에서 넘어온 값을 ViewModel 에서 savedStateHandle 을 이용해 받아서 사용하는 방법에 대해서 정리해 보겠습니다. 1. Route에서 값을 넘겨줄 때 먼저 route에서 값을 넘겨주는 코드를 보고 가겠습니다. testId를 route에 실어서 보내주는 코드인데요. TestId는 ViewModel에서 받아서 사용할 것이므로, TestPage에 인자로 넘겨주지 않았습니다. ... composable( route = "test_route" + "/{testId}", arguments = listOf( navArgument("testId") { type = NavType.LongType defaultValue = -8889L }, ), ) { TestPage() } 2023. 4. 13. Navigation Drawer 구현방법 # Jetpack Compose 오늘은 Jetpack Compose 를 이용해서 Navigation Drawer 를 구현하는 방법에 대해서 정리해 보도록 하겠습니다. 이 글에서는 TopAppBar등 Scaffold를 이용하면 빠르게 구현할 수 있는 요소들이 있어서, Scaffold 를 사용하고 있는데요. 이에 대한 기본적인 내용은 아래 글을 참조해 주세요. >> Scaffold SnackBar Floating Action Button구현 # Android Jetpack Compose UI Part3 1. Drawer에 표현할 메뉴들 Enum Class로 정의하기 Drawer에 들어올 메뉴들을 미리 정의해 놓았습니다. sealed class로 정의하면, 다이나믹한 데이터를 추가할 수 있지만, enum Class로 들어오면, iterate.. 2022. 11. 16. Navigation 과 Bottom Navigation 구현방법 정리 # Jetpack Compose 이 글은 예전에 작성된 글로서, 주제가 방대하여서 Navigation과 Bottom Navigation 의 구현방법을, 아래 2개의 글로 분리하여 정리하였습니다. 1. Navigation 구현방법 Navigation 구현방법은 아래 글을 참조해 주시면 되구요. >> Navigation 구현 방법 총정리 # Route Jetpack Compose Navigation 구현 방법 총정리 # Route Jetpack Compose 오늘은 Jetpack Compose 에서 구현하는 Navigation 에 대해서 정리해 보도록 하겠습니다. 1. Navigation Library 가장 먼저 준비할 것은 navigation 구현을 위해 라이브러리를 implement 하는 것 입니다. 아래의 라이 developer88... 2022. 10. 19. 이전 1 다음
