Jetpack Navigation-1 기초 및 구성 요소

seong-hwan Kim
shDev
Published in
7 min readJan 19, 2021

개요

Android Jetpack의 Navigation component는 애플리케이션에서 navigation flow를 생성하고 수정할 수 있는 도구이자 API입니다.

Navigation 컴포넌트는 Single Activity Architecture 기반의 애플리케이션에서 Fragment들의 생성과 전환, 파라미터의 전달, 내비게이션 흐름을 구현하는데 도움을 줍니다.

기존의 방식으로 프래그먼트를 사용하기 위해선 프래그먼트의 생성, 파라미터의 전달, 트랜지션 설정, 트랜잭션 백 스택의 관리 등 대부분의 작업을 직접 관리해야 했습니다. Navigation은 이러한 모든 작업을 추상화하여 제공하며 Toolbar, Navigation Drawer, Bottom Navigation 등 복잡한 요소에 대해서도 편의성을 제공합니다.

Navigation의 장점

  • 프래그먼트 트랜잭션에 대해 추상화를 제공하여 DestinationAction으로 내비게이션 흐름을 관리할 수 있습니다.
  • Navigation graph에 GUI 디자인을 제공하여 내비게이션 흐름을 직관적으로 파악할 수 있습니다.
  • 안드로이드 리소스 폴더는 소스 코드처럼 패키지로 분리할 수 없기 때문에 애플리케이션의 사이즈가 커질수록 레이아웃 리소스가 비대해지고 원하는 파일을 찾기 힘들어집니다. 내비게이션 컴포넌트는 Navigation graph라는 새로운 타입의 리소스를 사용하여 레이아웃을 유스케이스로 그룹화시킬 수 있습니다.

구성 요소

내비게이션 컴포넌트는 세 가지 주요 요소를 가집니다.

  • Navigation graph(new XML resource): 루트 요소로부터 연관된 모든 내비게이션을 명세한 XML 리소스. 내비게이션 그래프는 앱 내에서 destination이라고 부르는 모든 독립적인 콘텐츠 영역과 사용자가 이동할 수 있는 모든 경로(action)를 포함합니다.
  • NavHost(Layout XML view): 그래프에서 destination을 나타내는 컨테이너. 내비게이션 컴포넌트는 NavHost의 기본 구현 클래스로 NavHostFragment를 제공합니다.
  • NavController(Kotlin/Java object): NavHost 내부의 내비게이션 흐름을 관리하는 객체.

Navigation graph

새로운 형식의 안드로이드 리소스로, 사용자가 앱 내에서 이동할 수 있는 모든 경로와 영역을 나타냅니다. destinationaction으로 구성되며 안드로이드 스튜디오에서 Navigation Editor를 활용하여 그래프를 시각적으로 확인할 수 있습니다.

Navigation graph sample

Destination

대표적으로 프래그먼트나 액티비티, 다이얼로그처럼 사용자가 앱 내에서 접근할 수 있는 영역을 말합니다. 위의 그래프에서 각각의 레이아웃이 내비게이션 그래프의 destination을 나타내고 있습니다.

Action

destination간의 이동 경로를 나타내는 요소로, 그래프 상에서 화살표로 표시되고 있습니다. 단순히 경로 뿐만 아니라 트랜지션 애니메이션과 전달할 파라미터, 백 스택 제어 등의 정보도 포함하며, safe args plugin을 사용하여 파라미터를 안전하게 넘길 수 있습니다.

구성

<navigation>

app:startDestination

내비게이션 그래프의 root destination을 명시하는 속성.

<fragment>

android:id

내비게이션 그래프에서 destination을 식별하는 id. 지정된 id는 XML 또는 코드상에서 참조할 수 있다.

android:name

fragment 노드에 대해 실제 Fragment 클래스를 지정하는 속성. 해당 클래스의 Canonical Name을 사용한다.

android:label

값을 지정하면 해당하는 프래그먼트로 이동했을 때 app bar의 title을 자동으로 지정한 값으로 변경할 수 있다.

fragment 태그는 하위 태그로 <action>, <argument>, <deeplink> 를 가질 수 있다.

<action>

android:id

action을 식별하는 ID를 지정한다. destination으로 구분될 수 있기 때문에 action의 ID는 중복될 수 있다.

app:destination

action으로 이동할 destination을 지정한다.

Transition 관련

app:enterAnim

이동 시 target destination에 적용되는 애니메이션.

app:exitAnim

이동 시 이동하는 destination에 적용되는 애니메이션.

app:popEnterAnim

스택에서 pop 될 때 target destination에 적용되는 애니메이션.

app:popExitAnim

스택에서 pop 될 때 이동하는 destination에 적용되는 애니메이션.

Pop behavior 관련

app:popUpTo

destination으로 이동하기 전에 지정된 destination 까지 스택에서 pop 한다.

app:popUpToInclusive

true 로 지정하면 popUpTo 에 지정된 destination도 스택에서 pop 한다.

Launch option 관련

app:launchSingleTop

action에 지정된 destination의 launchMode를 singleTop으로 지정한다.

NavHost

NavHost는 사용자의 행동에 따라 앱에서 destination이 교체될 컨테이너에 해당합니다. 다음 코드는 NavHost가 추가된 액티비티 레이아웃의 일부를 보여주고 있습니다.

android:name

NavHost를 구현하는 클래스의 canonical name를 지정한다.

app:defaultNavHost

해당 속성을 true로 하면 시스템의 백 버튼을 NavHostFragment와 연결한다.

app:navGraph

NavHost와 연결할 내비게이션 그래프를 지정한다.

상황에 따라 NavHost를 수동으로 지정할 필요가 있습니다. 이럴땐 FragmentManager를 사용하여 프로그래매틱 방식으로 NavHost를 생성할 수 있습니다.

NavController

destination간의 상호 작용은 NavController를 통해서 이루어집니다. NavController의 객체는 다음 메서드를 사용하여 얻을 수 있습니다.

Kotlin:

Note!
FragmentContainerView를 사용하여 NavHostFragment를 만들 때 또는 FragmentTransaction을 통해 NavHostFragment를 액티비티에 수동으로 추가할 경우 Navigation.findNavController(Activity, @IdRes int)를 통해 액티비티의 onCreate()에서 NavController를 검색하려고 하면 실패합니다. 대신 NavHostFragment에서 직접 NavController를 검색해야 합니다.

참고

Android Developers-Navigation

Codelab-Navigation

Github-architecture-components-samples/NavigationBasicSample

Youtube-MAD Skills(Navigation)

--

--