티스토리 뷰

안드로이드/코드

Compose LaunchedEffect

알렌보이스 2022. 10. 27. 21:09
728x90

@Composable
@NonRestartableComposable
@OptIn(InternalComposeApi::class)
fun LaunchedEffect(
    key1: Any?,
    block: suspend CoroutineScope.() -> Unit
) {
    val applyContext = currentComposer.applyCoroutineContext
    remember(key1) { LaunchedEffectImpl(applyContext, block) }
}

LaunchedEffect는 위와 같은 구조로 이루어져 있습니다.

block이 CorutineScope로 되어 있으므로 코루틴으로 동작하는 함수들을 실행할 수 있습니다.

기본적인 사용 방법은 다음과 같습니다.

스크린샷 2022-10-26 오후 4.35.23.png

val context = LocalContext.current
val number = remember {
    mutableStateOf(0)
}
Box {
    Text(
        text = "${number.value} click",
        modifier = Modifier
            .align(Alignment.Center)
    )

    Row(
        horizontalArrangement = Arrangement.spacedBy(10.dp),
        modifier = Modifier
            .padding(horizontal = 10.dp, vertical = 20.dp)
            .align(Alignment.BottomCenter)
    ) {
        Button(
            onClick = { number.value = number.value + 1 },
            modifier = Modifier.weight(1f)
        ) {
            Text(text = "+1")
        }

        Button(
            onClick = { number.value = number.value + 0 },
            modifier = Modifier.weight(1f)
        ) {
            Text(text = "+0")
        }
    }
}

LaunchedEffect(number.value) {
    Toast.makeText(context, "현재 값은 ${number.value}입니다.", Toast.LENGTH_SHORT)
        .show()
}L

해당 코드의 결과는 실행 후 바로 “현재 값은 0입니다”의 토스트를 보여주고

+1 버튼을 누르면 증가한 값의 토스트 출력 / +0 버튼 클릭 시 아무것도 출력되지 않습니다.

LaunchedEffect는 최초 1회는 무조건 동작을 하게 되며

key의 들어간 값이 변경될 때마다 다시 실행이 됩니다.

val isStart = remember { mutableStateOf(false) }
val state by animateFloatAsState(
    targetValue = if (isStart.value) width else 0.0f,
    animationSpec = tween(durationMillis = 2500)
)

LaunchedEffect(Unit) {
    isStart.value = true
}

최초 1회는 실행이 된다는 것을 이용해서 위와같이 애니메이션이 자동 실행 되도록 설장할 수 있습니다.

if (number.value == 2) {
    LaunchedEffect(number.value) {
        Toast.makeText(context, "+1을 두번 째 눌렀습니다.", Toast.LENGTH_SHORT)
            .show()
    }
}

특정 조건에서 1회만 동작하고 싶다고 하면 위와 같이

if 문 안에 넣어서 사용하면 됩니다.

728x90

'안드로이드 > 코드' 카테고리의 다른 글

Compose Naver Map  (1) 2022.10.29
Compose GoogleMap  (0) 2022.10.27
Compose GraphicsLayer  (0) 2022.09.02
Compose 기초 4 : Gradient  (0) 2022.09.01
Compose 기초 3 : ViewPager  (0) 2022.08.30
댓글