像Netflix一样滑动项目回收器视图

Question

我想像在 Netflix 中一样滑动 recyclerview 中的所有项目，但我不知道该怎么做。下面是我写的代码，但效果不太好。

此代码在我的适配器中：

Handler(Looper.getMainLooper()).postDelayed({

            if (isOpenItems) {
                moveDownloadContainer(binding, -56f, 0L)
                moveDeleteBtn(binding, -56f, 0L)
            } else {
                moveDownloadContainer(binding, 0f, 0L)
                moveDeleteBtn(binding, 0f, 0L)
            }
        }, 0)

这是 moveDownloadContainer 函数：

private fun moveDownloadContainer(
    binding: ItemDownloadsBinding, translationX: Float, time: Long
) {
    val animator = ObjectAnimator.ofFloat(
        binding.downloadsContainer, "translationX", Func.dpToPx(fragment.context, translationX)
    )
    val animationDuration = time
    val interpolator = AccelerateDecelerateInterpolator()
    animator.duration = animationDuration
    animator.interpolator = interpolator
    animator.start()
}

这是 moveDeleteBtn 函数：

private fun moveDeleteBtn(binding: ItemDownloadsBinding, translationX: Float, time: Long) {
    val animator = ObjectAnimator.ofFloat(
        binding.deleteBtn, "translationX", Func.dpToPx(fragment.context, translationX)
    )
    val animationDuration = time
    val interpolator = AccelerateDecelerateInterpolator()
    animator.duration = animationDuration
    animator.interpolator = interpolator
    animator.start()
}

这是我的 reycyclerview 项目：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

<LinearLayout
    android:id="@+id/swipe_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/app_background"
    android:orientation="horizontal"
    app:show_mode="lay_down">


    <LinearLayout
        android:id="@+id/downloads_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:gravity="center"
        android:orientation="horizontal"
        android:paddingHorizontal="16dp"
        android:paddingVertical="7dp">

        <com.google.android.material.card.MaterialCardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardCornerRadius="10dp"
            app:cardElevation="0dp"
            app:strokeColor="@color/transparent">

            <ImageView
                android:id="@+id/film_image"
                android:layout_width="128dp"
                android:layout_height="70dp"
                android:scaleType="centerCrop"
                app:srcCompat="@drawable/test_img_hor" />

        </com.google.android.material.card.MaterialCardView>


        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginStart="@dimen/dp_10"
            android:layout_weight="1"
            android:orientation="vertical">

            <TextView
                android:id="@+id/film_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/inter_semi_bold"
                android:maxLines="2"
                android:textColor="@color/white"
                android:textSize="14sp"
                tools:text="Название фильма" />


            <TextView
                android:id="@+id/duration"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/inter_regular"
                android:textColor="@color/neutral"
                android:textSize="12sp"
                tools:text="13 мин" />

            <TextView
                android:id="@+id/download_state"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/inter_regular"
                android:textColor="@color/light_gray"
                android:textSize="12sp"
                tools:text="Загружено" />


            <TextView
                android:id="@+id/downloaded_bytes"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/inter_regular"
                android:textColor="@color/light_gray"
                android:textSize="12sp"
                tools:text="Загружено" />


        </LinearLayout>

        <FrameLayout
            android:id="@+id/progress_container"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <com.google.android.material.progressindicator.CircularProgressIndicator
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:progress="100"
                app:indicatorColor="@color/white"
                app:indicatorSize="@dimen/dp_32"
                app:trackColor="@color/transparent" />

            <com.google.android.material.progressindicator.CircularProgressIndicator
                android:id="@+id/progress_bar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:progress="50"
                app:indicatorColor="@color/white"
                app:indicatorSize="30dp"
                app:trackColor="@color/transparent"
                app:trackThickness="@dimen/sp_16" />

        </FrameLayout>

        <FrameLayout
            android:id="@+id/play_pause_btn"
            android:layout_width="@dimen/dp_40"
            android:layout_height="@dimen/dp_40"
            android:visibility="gone">

            <ImageView
                android:id="@+id/download_state_image"
                android:layout_width="@dimen/dp_20"
                android:layout_height="@dimen/dp_20"
                android:layout_gravity="center"
                android:src="@drawable/icon_pause" />

        </FrameLayout>


    </LinearLayout>

    <FrameLayout
        android:id="@+id/delete_btn"
        android:layout_width="@dimen/dp_56"
        android:layout_height="match_parent"
        android:background="@color/mirage"
        android:visibility="visible">

        <ImageView
            android:layout_width="@dimen/dp_16"
            android:layout_height="@dimen/dp_16"
            android:layout_gravity="center"
            android:src="@drawable/icon_close"
            app:tint="@color/white" />

    </FrameLayout>

</LinearLayout>

</FrameLayout>

您能否提供有关如何实现这一目标的任何提示。预先感谢。

Answer 1

它不是 netflix，但有一个依赖项，您可以使用它来创建 Tinder 风格的卡片视图。

implementation ‘com.daprlabs.aaron:cardstack:0.3.1-beta0’

您可以在这里查看完整的教程： https://www.geeksforgeeks.org/tinder-swipe-view-with-example-in-android/