[Android/Kotlin] 안드로이드 학습 3.2 - 네비게이션

이번에 알아볼 내용은 프레그먼트간의 화면 전환을 쉽게 해주는 네비게이션이다.

Android Kotlin Fundamentals: 03.2 Define navigation paths  |  Android Developers

The Navigation component is a library that can manage complex navigation, transition animation, deep linking, and compile-time checked argument passing between the screens in your app.

이 네비게이션 라이브러리를 이용하면 전환 애니메이션, 딥 링크 및 컴파일 시 스크린 사이의 인수 전달 등을 관리할 수 있다고 함.

 

 

Navigation 사용

 

1. gradle 세팅

build.gradle(Project)에 다음 코드 추가

ext {
        ...
        navigationVersion = "2.3.0"
        ...
    }

build.gradle(Module)에 다음 코드 추가

dependencies {
  ...
  implementation "androidx.navigation:navigation-fragment-ktx:$navigationVersion"
  implementation "androidx.navigation:navigation-ui-ktx:$navigationVersion"
  ...
}

--> 그럼 사용할 준비 끝

 

 

2. 프로젝트에 Navigation 그래프 추가하기

res > New > Android Resource Directory 에서 리소스 타입을 navigation으로 지정

 

 

3.  호스트가 되는 NavHostFragment 생성

<!-- The NavHostFragment within the activity_main layout -->
            <fragment
                android:id="@+id/myNavHostFragment"
                android:name="androidx.navigation.fragment.NavHostFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:navGraph="@navigation/navigation"
                app:defaultNavHost="true" />

 

4.  네비게이션 그래프에 fragment 추가

(2)에서 만들어준 navigation.xml에서 아래 코드 추가. 그래프에서 사용할 프레그먼트

<fragment
   android:id="@+id/gameFragment"
   android:name="com.example.android.navigation.GameFragment"
   android:label="GameFragment"
   tools:layout="@layout/fragment_game" />

디자인 편집기에서 두 프레그먼트를 연결하면

<action
    android:id="@+id/action_titleFragment_to_gameFragment"
    app:destination="@id/gameFragment" />

코드가 추가됨

 

5.  setOnClickListener 사용 -> 화면 전환

binding.playButton.setOnClickListener { view : View ->
       view.findNavController().navigate(R.id.action_titleFragment_to_gameFragment)
}

 

 

백스택 관리

백버튼 동작 변경

Android 시스템은 사용자가 Android 기반 장치에서 탐색하는 위치를 추적한다. 사용자가 기기의 새 위치(창)로 이동할 때마다 Android는 해당 대상을 백 스택에 추가한다.

사용자가 뒤로 가기 버튼을 누르면 앱은 백 스택의 맨 위에 있는 대상으로 이동한다. ❗️기본적으로 백 스택의 맨 위는 사용자가 마지막으로 본 화면이다.❗️

 만약 뒤로 가기 버튼을 눌렀을 때, 이전에 있었던 화면이 아니라 다른 화면으로의 이동을 지정해주고 싶다면 navigation action을 활용할 수 있다. 이를 통해 백스택을 관리해줄 수 있게 되는 것이다.

 

 

1. navigation action에 대한 팝업 동작 설정

"pop" 동작을 통해 백스택을 관리해줄 수 있음.

pop 동작	설명
popUpTo	화면 이동 전에 백스택을 지정된 대상으로 팝업한다. (목적지는 백스택에서 제거)
popUpToInclusive	false로 설정 or 설정되지 않을 때 -> 지정된 목적지까지는 경로를 제거. 하지만 지정된 목적지는 백스택에 남겨둠  true로 설정 -> 지정된 목적지를 포함해 모든 목적지를 백스택에서 제거한다.

* popUpInclusive가 ture거나 popUpTo가 앱의 시작 위치로 설정되었다면 동작은 백스택에서부터 모든 앱의 목적지를 지운다.

 

 

2. 액션바에 뒤로가기 추가

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    ...
    val navController = this.findNavController(R.id.myNavHostFragment)
    NavigationUI.setupActionBarWithNavController(this, navController)
}

override fun onSupportNavigateUp(): Boolean {
    val navController = this.findNavController(R.id.myNavHostFragment)
    return navController.navigateUp()
}

 

 

4. 옵션 메뉴 추가

 

5. 탐색창 추가

 

Learn More

Udacity course:

• Developing Android Apps with Kotlin

Android developer documentation:

• Navigation Architecture Component
• Implement navigation with the navigation components
• Update UI components with NavigationUI
• NavigationUI
• NavHostFragment
• Designing Back and Up navigation
• Providing proper Back navigation
• Creating an options menu
• Create a navigation drawer

Material Design documentation:

• Understanding navigation
• App bars: top
• Navigation drawer