RecyclerView를 Lazy 목록으로 이전

RecyclerView는 대량의 데이터 세트를 쉽고 효율적으로 표시할 수 있는 뷰 구성요소입니다. 데이터 세트의 각 항목에 대한 뷰를 만드는 대신 RecyclerView은(는) 적은 수의 풀을 유지하여 앱 성능을 개선합니다. 항목을 스크롤하면서 재활용할 수 있습니다.

Compose에서 지연 목록을 사용하여 동일한 작업을 할 수 있습니다. 이 페이지 지연 목록을 사용하도록 RecyclerView 구현을 이전하는 방법을 설명합니다. 살펴보겠습니다

이전 단계

RecyclerView 구현을 Compose로 이전하려면 다음 단계를 따르세요.

  1. UI 계층 구조에서 RecyclerView를 주석 처리하거나 삭제하고, 계층 구조에 아직 ComposeView가 없는 경우 이를 대체하도록 ComposeView를 추가합니다. 추가할 Lazy 목록의 컨테이너입니다.

          <FrameLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent">

  <!--    <androidx.recyclerview.widget.RecyclerView-->
  <!--            android:id="@+id/recycler_view"-->
  <!--            android:layout_width="match_parent"-->
  <!--            android:layout_height="match_parent />"-->

          <androidx.compose.ui.platform.ComposeView
              android:id="@+id/compose_view"
              android:layout_width="match_parent"
              android:layout_height="match_parent" />

      </FrameLayout>

  2. 다음을 기준으로 필요한 지연 목록 컴포저블의 유형을 결정합니다. RecyclerView의 레이아웃 관리자 (아래 표 참고) 선택한 컴포저블 이는ComposeView 이전 단계로 넘어갑니다.

    LayoutManager

    컴포저블

    LinearLayoutManager

    LazyColumn 또는 LazyRow

    GridLayoutManager

    LazyVerticalGrid 또는 LazyHorizontalGrid

    StaggeredGridLayoutManager

    LazyVerticalStaggeredGrid 또는 LazyHorizontalStaggeredGrid

    		 

    // recyclerView.layoutManager = LinearLayoutManager(context)
composeView.setContent {
    LazyColumn(Modifier.fillMaxSize()) {
        // We use a LazyColumn since the layout manager of the RecyclerView is a vertical LinearLayoutManager
    }
}
    MigrationCommonScenariosSnippets.kt

  3. 다음과 같이 각 뷰 유형에 상응하는 컴포저블을 만듭니다. RecyclerView.Adapter 구현. 각 뷰 유형은 일반적으로 ViewHolder 서브클래스에 매핑되지만 항상 그런 것은 아닙니다. 이러한 컴포저블은 다양한 유형의 UI 표현으로 사용됩니다. 요소가 있습니다.

    @Composable
fun ListItem(data: MyData, modifier: Modifier = Modifier) {
    Row(modifier.fillMaxWidth()) {
        Text(text = data.name)
        // … other composables required for displaying `data`
    }
}
    MigrationCommonScenariosSnippets.kt

    RecyclerView.Adapter의 onCreateViewHolder() 및 onBindViewHolder() 메서드는 이러한 컴포저블로 대체되며 상태를 명시해야 합니다 Compose에서는 항목의 컴포저블을 만들고 데이터를 결합하는 방법을 보여줍니다. 이 개념은 병합되었습니다.

  4. 지연 목록의 content 슬롯(후행 람다 매개변수) 내에서 items() 함수(또는 이에 상응하는 오버로드)를 사용하여 목록의 데이터를 반복합니다. itemContent 람다에서 데이터에 적절한 컴포저블 항목을 호출합니다.

    val data = listOf<MyData>(/* ... */)
composeView.setContent {
    LazyColumn(Modifier.fillMaxSize()) {
        items(data) {
            ListItem(it)
        }
    }
}
    MigrationCommonScenariosSnippets.kt

를 통해 개인정보처리방침을 정의할 수 있습니다.

일반적인 사용 사례

상품 장식

RecyclerView에는 ItemDecoration 개념이 있으며 이를 사용하여 목록의 항목에 관한 특수 그리기를 추가할 수 있습니다. 예를 들어 ItemDecoration: 항목 사이에 구분선을 추가합니다.

val itemDecoration = DividerItemDecoration(recyclerView.context, LinearLayoutManager.VERTICAL)
recyclerView.addItemDecoration(itemDecoration)
MigrationCommonScenariosSnippets.kt

Compose에는 항목 장식에 상응하는 개념이 없습니다. 대신 은 컴포지션에서 목록의 UI 장식을 직접 추가할 수 있습니다. 예를 들어 목록에 구분선을 추가하려면 각 매개변수 뒤에 Divider 컴포저블을 사용하면 됩니다. 항목:

LazyColumn(Modifier.fillMaxSize()) {
    itemsIndexed(data) { index, d ->
        ListItem(d)
        if (index != data.size - 1) {
            HorizontalDivider()
        }
    }
}
MigrationCommonScenariosSnippets.kt

항목 애니메이션

RecyclerView에 ItemAnimator를 설정하여 어댑터에 변경사항을 적용할 수 있습니다. 기본적으로 RecyclerView는 다음을 사용합니다. DefaultItemAnimator는 삭제, 추가, 이동 이벤트를 수신합니다.

지연 리스트에는 animateItemPlacement 수정자를 통해 유사한 개념이 있습니다. 자세한 내용은 항목 애니메이션을 참고하세요.

추가 리소스

RecyclerView를 Compose로 이전하는 방법에 관한 자세한 내용은 다음을 참고하세요. 다음 리소스를 참고하세요.