안드로이드 UI의 상태를 관리하는 방법 – @Composable/Android

안드로이드 UI의 상태를 정의하는 방법은 두가지가 있다.

첫번째, 해당 UI 내부에서만 사용하는 상태값

이렇게 정의된 상태값은 해당 UI 내부에서만 사용할 수 있다. 따라서 다른 UI와 공유하지 않는 값들은 모두 이런 방식으로 관리하면 된다.

var count by remember { mutableStateOf(0) }

화면에 적용한 전체 코드는 다음과 같다.

@Composable
fun Screen() {
    var count by remember { mutableStateOf(0) }

    Column {
        Text("Screen: $count")
        Button(onClick = { count++ }) {
            Text("Increase")
        }
    }
}

두번째, 여러개의 UI에서 공유하는 상태값

여러개의 UI에서 상태값을 공유하기 위해서는 뷰 모델을 사용해야 한다. 다음과같이 뷰 모델의 상태값을 가져와서 사용하면 여러개의 화면에서 상태값을 공유할 수 있다.

@Composable
fun Screen(sharedViewModel: SharedViewModel = viewModel()) {
    val count by remember { sharedViewModel.count }

    Column {
        Text("Screen: $count")
        Button(onClick = { sharedViewModel.increment() }) {
            Text("Increase")
        }
    }
}

뷰 모델은 다음과 같이 정의할 수 있다.

class SharedViewModel : ViewModel() {
    var count by mutableStateOf(0)
        private set

    fun increment() {
        count++
    }

    fun decrement() {
        count--
    }
}

서로 다른 두개의 화면에서 상태를 공유하는 방법

우선 메인 액티비티에 뷰 모델을 생성합니다.

// 메인 액티비티에 뷰 모델을 생성
class MainActivity : ComponentActivity() {
    private val sharedViewModel: SharedViewModel by viewModels()
    ...
}

그 이후, 화면에 전달해서 공유해 줍니다.

composable(Screen1(navController, sharedViewModel)}
composable(Screen2(navController, sharedViewModel)}
composable(Screen3(navController, sharedViewModel)}