Jetpack Compose : remember, mutableStateOf

aram·2021년 10월 30일
0

remember

메모리에 로컬 상태를 저장한다

mutableStateOf()

mutableStateOf() 에 전달된 값이 업데이트 될 때마다 이 state를 사용하는 컴포저블과 하위 요소는 재구성(recomposition) 한다.

활용하기

장문의 텍스트를 ellipsis로 숨겼다가 보여주는 토글 버튼 만들기.
boolean 값의 mutableState로 See More / See Less 토글 텍스트 컴포넌트를 만들었다.


@Composable
fun ToggleText(string: String) {
    var seeMore by remember { mutableStateOf(true) }

    Text(
        text = string,
        style = MaterialTheme.typography.body2,
        maxLines = if (seeMore) 5 else Int.MAX_VALUE,
        overflow = TextOverflow.Ellipsis
    )
    val textButton = if (seeMore) {
        stringResource(id = R.string.see_more)
    } else {
        stringResource(id = R.string.see_less)
    }
    Text(
        text = textButton,
        style = MaterialTheme.typography.button,
        textAlign = TextAlign.Center,
        color = MaterialTheme.colors.primaryVariant,
        modifier = Modifier
            .heightIn(20.dp)
            .fillMaxWidth()
            .padding(top = 15.dp)
            .clickable {
                seeMore = !seeMore
            }
    )
}

0개의 댓글