[Compose] compose에서 RecyclerView를 쓰는법

기존에 list 뷰를 만들려면 RecyclerView.Adapter, RecyclerView.ViewHolder 등을 만들어야 했다.

무척 번거로웠지만 compose에서는 어떻게 만들면 될까?

LazyColumn

LazyColumn이란 compose에서 list를 만들 때 쓰는 layout이다.
이름부터 볼 수 있듯이 세로형 list를 만들 수 있는 것인데
한번 코드를 살펴보자.

@Composable
fun Greetings(name: List<String> = List(1000) { "${it}" }) {
    LazyColumn(Modifier.padding(vertical = 4.dp)) {
        items(name) { name ->
            Greeting(name = name)
        }
    }

}

items에 어떠한 데이터가 들어갈지 넣어주면 된다.

결과로 이런 layout이 그려질 것이다.

LazyRow

LazyRow는 LazyColumn과 같이 list 뷰를 그려줄 때 사용한다.
이름에서 볼 수 있듯이 가로형 list의 뷰를 그릴 때 사용한다.
한번 코드를 살펴보자

@Composable
@Preview
fun Greetings(name: List<String> = List(1000) { "${it}" }) {
    LazyRow(Modifier.padding(vertical = 4.dp)) {
        items(name) { name ->
            Greeting(name = name)
        }
    }

}

코드는 크게 달라진 것은 없고
LazyColumn에서 LazyRow로 바뀌었을 뿐이다.

기존에는 번거롭게 리스트 뷰를 만들어야 했지만 Compose에서는 간단하게 만들 수 있어 큰 이점이다.

상태유지

만약 화면을 회전하면 기존 layout의 변화가 초기화될 것이다.
이를 방지할려면 remember 대신 rememberSaveable을 사용하면 된다.