انتقال RecyclerView به فهرست تنبل

RecyclerView یک مؤلفه View است که نمایش کارآمد مجموعه‌های بزرگ داده را آسان می‌کند. به‌جای ایجاد نما برای هر مورد در مجموعه داده، RecyclerView عملکرد برنامه‌تان را با نگه داشتن مجموعه کوچکی از نماها و بازیافت آن‌ها هنگام پیمایش در آن موارد بهبود می‌بخشد.

در Compose، می‌توانید از فهرست‌های Lazy برای انجام همین کار استفاده کنید. این صفحه شرح می‌دهد که چگونه می‌توانید پیاده‌سازی RecyclerView خود را برای استفاده از فهرست‌های Lazy در Compose انتقال دهید.

مراحل انتقال

برای انتقال پیاده‌سازی RecyclerView به Compose، این مراحل را دنبال کنید:

  1. RecyclerView را از سلسله‌مراتب میانای کاربری‌تان حذف کنید یا آن را به‌صورت نظر درآورید و ComposeView را برای جایگزینی آن اضافه کنید، اگر هنوز هیچ‌کدام در سلسله‌مراتب وجود ندارد. این محفظه Lazy list است که اضافه خواهید کرد:

          <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، تعیین کنید به چه نوع Lazy list composable نیاز دارید (جدول زیر را ببینید). ترکیب‌پذیری که انتخاب می‌کنید ترکیب‌پذیر سطح بالای 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 نگاشت می‌شود، اگرچه ممکن است همیشه این‌طور نباشد. این ترکیب‌شدنی‌ها به‌عنوان نمایش میانای کاربری برای انواع مختلف عناصر در فهرست شما استفاده خواهند شد:

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

    منطق موجود در روش‌های onCreateViewHolder() و onBindViewHolder() مربوط به RecyclerView.Adapter با این ترکیب‌پذیرها و وضعیتی که برای آن‌ها فراهم می‌کنید جایگزین خواهد شد. در Compose، هیچ جدایی بین ایجاد یک composable برای یک مورد و اتصال داده به آن وجود ندارد—این مفاهیم با هم ادغام شده‌اند.

  4. در جایگاه content از فهرست Lazy (پارامتر لامبدا انتهایی)، از تابع 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 مفهوم معادلی برای تزئینات مورد ندارد. درعوض، می‌توانید هرگونه تزئینات میانای کاربری را در فهرست مستقیماً در ترکیب‌بندی اضافه کنید. برای مثال، برای افزودن تقسیم‌کننده به فهرست، می‌توانید از Divider ترکیب‌پذیر بعداز هر مورد استفاده کنید:

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

پویانمایی‌های مورد

می‌توان ItemAnimator را روی RecyclerView تنظیم کرد تا ظاهر موارد را هنگام اعمال تغییرات در آداپتور پویانمایی کند. به‌طور پیش‌فرض، RecyclerView از DefaultItemAnimator استفاده می‌کند که پویانمایی‌های پایه را در رویدادهای برداشتن، افزودن، و انتقال ارائه می‌دهد.

فهرست‌های تنبل ازطریق اصلاح‌گر animateItemPlacement مفهوم مشابهی دارند. برای کسب اطلاعات بیشتر، به پویانمایی‌های مورد مراجعه کنید.

منابع بیشتر

برای اطلاعات بیشتر درباره انتقال RecyclerView به Compose، منابع زیر را ببینید: