RecyclerView를 Lazy 목록으로 이전

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

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

이전 단계

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

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

          <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
        }
    }

  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`
        }
    }

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

  4. 지연 목록의 content 슬롯 (후행 람다 매개변수) 내에서 items() 함수 (또는 상응하는 오버로드)를 사용하여 데이터입니다. itemContent 람다에서 적절한 구성 가능한 항목을 정의합니다.

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

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

일반적인 사용 사례

아이템 장식

RecyclerView에는 ItemDecoration의 개념이 있으며, 이를 통해 특수 그리기를 사용합니다. 예를 들어 ItemDecoration: 항목 사이에 구분선을 추가합니다.

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

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

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

항목 애니메이션

RecyclerViewItemAnimator를 설정하여 어댑터가 변경될 때마다 이러한 항목을 전송합니다. 기본적으로 RecyclerView는 다음을 사용합니다. DefaultItemAnimator는 삭제, 추가, 이동 이벤트를 수신합니다.

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

추가 리소스

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