Compose 상태관리

sumi Yoo·2024년 8월 30일

이벤트와 상태 관계

이벤트: 이벤트는 사용자 또는 프로그램의 다른 부분에 의해 생성됩니다.
상태 업데이트: 이벤트 핸들러가 UI에서 사용하는 상태를 변경합니다.
상태 표시: 새로운 상태를 표시하도록 UI가 업데이트됩니다.

The Composition

컴포저블을 실행할 때 Jetpack Compose에서 빌드한 UI에 관한 설명입니다.

Initial composition

처음 컴포저블을 실행하여 컴포지션을 만듭니다.

Recomposition

데이터가 변경될 때 컴포지션을 업데이트하기 위해 컴포저블을 다시 실행하는 것을 말합니다.

Sate/mutableStateOf

Compose에는 특정 상태를 읽는 컴포저블의 리컴포지션을 예약하는 특별한 상태 추적 시스템이 있습니다. 이를 통해 Compose가 세분화되어 전체 UI가 아닌 변경해야 하는 이러한 구성 가능한 함수만 재구성할 수 있습니다.
단독으로 사용 못한다. >> 상태가 변경될때마다 리컴포지션 되어 유지를 못하고 초기화 되어버린다.

import androidx.compose.runtime.MutableState
import androidx.compose.runtime.mutableStateOf

@Composable
fun WaterCounter(modifier: Modifier = Modifier) {
   Column(modifier = modifier.padding(16.dp)) {
       // Changes to count are now tracked by Compose
       val count: MutableState<Int> = mutableStateOf(0)

       Text("You've had ${count.value} glasses.")
        Button(onClick = { count.value++ }, Modifier.padding(top = 8.dp)) {
           Text("Add one")
       }
   }
}

인라인 함수 remember

remember로 계산된 값은 초기 컴포지션 중에 컴포지션에 저장되고 저장된 값은 리컴포지션 간에 유지됩니다.
일반적으로 remember와 mutableStateOf는 구성 가능한 함수에서 함께 사용됩니다.
remember는 컴포지션에 객체를 저장하고, remember가 호출되는 소스 위치가 리컴포지션 중에 다시 호출되지 않으면 객체를 삭제합니다.

import androidx.compose.runtime.remember

@Composable
fun WaterCounter(modifier: Modifier = Modifier) {
    Column(modifier = modifier.padding(16.dp)) {
        val count: MutableState<Int> = remember { mutableStateOf(0) }
        Text("You've had ${count.value} glasses.")
        Button(onClick = { count.value++ }, Modifier.padding(top = 8.dp)) {
            Text("Add one")
        }
    }
}

by 키워드

위임된 속성
위임의 getter 및 setter 가져오기를 추가하면 매번 MutableState의 value 속성을 명시적으로 참조하지 않고도 count를 간접적으로 읽고 변경할 수 있습니다.

import androidx.compose.runtime.getValue
import androidx.compose.runtime.setValue

@Composable
fun WaterCounter(modifier: Modifier = Modifier) {
   Column(modifier = modifier.padding(16.dp)) {
       var count by remember { mutableStateOf(0) }

       Text("You've had $count glasses.")
       Button(onClick = { count++ }, Modifier.padding(top = 8.dp)) {
           Text("Add one")
       }
   }
}

상태 호이스팅

컴포저블을 스테이트리스(Stateless)로 만들기 위해 상태를 컴포저블의 호출자로 옮기는 패턴입니다.
스테이트리스(Stateless) 컴포저블은 상태를 소유하지 않는 컴포저블입니다. 즉, 새 상태를 보유하거나 정의하거나 수정하지 않습니다.
스테이트풀(Stateful) 컴포저블은 시간이 지남에 따라 변할 수 있는 상태를 소유하는 컴포저블입니다.

ViewModel

화면 또는 UI 상태는 화면에 표시할 내용을 나타냅니다.
ViewModel은 구성 변경 후에도 유지되므로 컴포지션보다 전체 기간이 더 깁니다.
Compose에서 MutableList를 위해 추적하는 것이 요소 추가 및 삭제와 관련된 변경사항이기 때문입니다. 삭제가 작동하는 이유가 바로 이것입니다.
문제를 해결하는 두 가지 방법은 다음과 같습니다.

데이터 클래스 WellnessTask를 변경하여 checkedState가 Boolean 대신 MutableState이 되도록 합니다. 그러면 Compose에서 항목 변경사항을 추적합니다.
변경하려는 항목을 복사하고 목록에서 항목을 삭제한 후 변경된 항목을 다시 목록에 추가합니다. 그러면 Compose에서 이 목록 변경사항을 추적합니다.

configuration change(구성변경)

구성변경 시점: 화면 회전, 언어 변경, 다크모드 변경
remember를 사용하면 리컴포지션 간에 상태를 유지하는 데 도움이 되지만 구성 변경 간에는 유지되지 않습니다.
remember 대신 rememberSaveable을 사용해야 합니다.
Activity가 다시 생성된 후 UI 상태를 복원하려면 rememberSaveable을 사용합니다.