Kotlin | navGraphViewModels

 

Jetpack Navigation에서 ViewModel을 공유하는 방법: navGraphViewModels 사용법

안녕하세요! 오늘은 Jetpack Navigation 라이브러리와 ViewModel을 결합하여 여러 화면(Fragment) 간에 ViewModel을 공유하는 방법에 대해 알아보겠습니다. 특히 **navGraphViewModels**를 사용해 Navigation Graph 내에서 어떻게 ViewModel을 관리하고, 여러 Fragment에서 데이터를 쉽게 공유할 수 있는지에 대해 설명드릴 예정입니다.

1. Navigation Component와 ViewModel 개념 복습

Navigation Component란?

Jetpack의 Navigation Component는 앱 내에서 화면 간의 전환을 관리하는 라이브러리입니다. 이를 사용하면 화면 전환을 단순화하고, 다양한 전환 애니메이션과 복잡한 화면 흐름을 쉽게 처리할 수 있습니다.

ViewModel이란?

ViewModel은 UI 관련 데이터를 저장하고, 구성 변경에 영향을 받지 않게 만들어주는 클래스입니다. 예를 들어, 화면 회전 시 Activity나 Fragment가 다시 생성되더라도 ViewModel은 데이터를 계속해서 유지할 수 있습니다.

---

2. navGraphViewModels란 무엇인가?

navGraphViewModels는 Navigation Component와 ViewModel을 결합한 유틸리티입니다. 이를 통해 Navigation Graph 내의 여러 화면에서 동일한 ViewModel을 공유하거나, 해당 그래프에서 ViewModel을 접근할 수 있습니다. 주로 여러 Fragment가 서로 상태를 공유해야 할 때 유용하게 사용됩니다.

---

3. 왜 navGraphViewModels를 사용해야 할까요?

일반적으로 ViewModel은 Fragment나 Activity 단위로 관리되며, 각 화면에서 데이터를 관리합니다. 하지만, Navigation Graph를 사용하여 여러 화면을 관리할 때, 각 화면에 필요한 데이터를 공유하려면 복잡한 코드가 필요할 수 있습니다.

navGraphViewModels를 사용하면 Navigation Graph의 범위 내에서 ViewModel을 공유할 수 있기 때문에, 여러 Fragment 간에 데이터를 쉽게 공유하고, 각 화면에 동일한 상태를 유지할 수 있습니다.

---

4. navGraphViewModels 사용 방법

4.1. Navigation Graph 설정

먼저, 프로젝트에 Navigation Graph가 설정되어 있어야 합니다. 이 Graph 파일은 화면 간의 전환 흐름을 정의하며, 다음과 같은 XML 파일 형태로 작성됩니다.

<!-- res/navigation/nav_graph.xml -->
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    app:startDestination="@id/firstFragment">

    <fragment
        android:id="@+id/firstFragment"
        android:name="com.example.app.FirstFragment"
        android:label="First Fragment"
        tools:layout="@layout/fragment_first" />
        
    <fragment
        android:id="@+id/secondFragment"
        android:name="com.example.app.SecondFragment"
        android:label="Second Fragment"
        tools:layout="@layout/fragment_second" />
        
</navigation>

이제 Navigation Graph가 설정되었으니, 각 Fragment가 ViewModel을 어떻게 공유할지에 대해 살펴보겠습니다.

4.2. ViewModel을 Navigation Graph 내에서 공유하기

navGraphViewModels를 사용하면, 주어진 Navigation Graph 내에서 여러 Fragment들이 동일한 ViewModel을 공유할 수 있습니다.

// FirstFragment.kt
class FirstFragment : Fragment(R.layout.fragment_first) {
    
    // navGraphViewModels를 사용하여 Navigation Graph 내에서 동일한 ViewModel을 가져옴
    private val sharedViewModel: SharedViewModel by navGraphViewModels(R.id.nav_graph)

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        sharedViewModel.data.observe(viewLifecycleOwner) { data ->
            // 데이터 업데이트
            // UI에 반영
        }
    }
}

// SecondFragment.kt
class SecondFragment : Fragment(R.layout.fragment_second) {

    // FirstFragment와 동일한 ViewModel을 공유
    private val sharedViewModel: SharedViewModel by navGraphViewModels(R.id.nav_graph)

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        sharedViewModel.data.observe(viewLifecycleOwner) { data ->
            // 데이터 업데이트
            // UI에 반영
        }
    }
}

4.3. ViewModel 클래스 구현

이제 ViewModel 클래스를 작성하여 공유할 데이터를 관리합니다.

class SharedViewModel : ViewModel() {
    // LiveData나 StateFlow로 데이터를 관리
    private val _data = MutableLiveData<String>()
    val data: LiveData<String> get() = _data

    fun updateData(newData: String) {
        _data.value = newData
    }
}

4.4. NavHostFragment와 연결하기

NavHostFragment가 Navigation Graph를 사용하여 화면 전환을 관리합니다. 다음과 같이 설정합니다:

<!-- MainActivity.xml -->
<androidx.fragment.app.FragmentContainerView
    android:id="@+id/nav_host_fragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:navGraph="@navigation/nav_graph"
    app:defaultNavHost="true" />

5. navGraphViewModels의 장점

• Fragment 간 데이터 공유: 여러 Fragment가 동일한 ViewModel을 공유함으로써, 데이터 상태를 쉽게 관리하고 유지할 수 있습니다.
• 구성 변경에 대한 강건성: ViewModel은 화면 회전과 같은 구성 변경에 영향을 받지 않기 때문에, 상태를 안전하게 유지할 수 있습니다.
• 코드 간소화: navGraphViewModels를 사용하면, ViewModel을 쉽게 가져오고 관리할 수 있어 코드가 간결해집니다.

---

6. 결론

navGraphViewModels는 Jetpack Navigation과 ViewModel을 결합하여 화면 간의 데이터 공유를 손쉽게 할 수 있도록 해주는 매우 유용한 도구입니다. 여러 Fragment가 동일한 데이터를 다루어야 할 때, navGraphViewModels를 활용하면 코드의 복잡성을 줄이고, 상태를 안전하게 관리할 수 있습니다.

이제 여러분도 Navigation Graph와 ViewModel을 효과적으로 결합하여 더욱 강력한 앱을 만들 수 있을 것입니다!

 

https://developer.android.com/guide/navigation?hl=ko#kts

탐색  |  Android Developers

https://developer.android.com/topic/libraries/architecture/viewmodel?hl=ko

ViewModel 개요  |  Android Developers