滑动以在 android 中添加视图

Question

我想实现类似下面的 gif：

到目前为止我做了什么：

我正在使用 swipelayout 使用我能够实现如果你滑动行项目的部分，它会显示 "Add to Cart" 图标但我无法实现它放大的动画购物车图标并将其添加到购物车（我无法创建可以调用 addToCart 函数的挂钩）。

下面是我的代码：

行XML文件：

<RelativeLayout
    android:id="@+id/swipe_view"
    android:layout_width="120dp"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    android:minWidth="96dp">

    <ImageView
        android:id="@+id/add_to_cart"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="@dimen/activity_margin"
        android:layout_marginStart="@dimen/activity_margin"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:clickable="true"
        android:padding="@dimen/activity_margin"
        android:scaleType="center"
        android:src="@drawable/ic_menu_cart"/>

</RelativeLayout>

<RelativeLayout
    android:id="@+id/restaurant_menu_details_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/half_activity_margin"
    android:paddingLeft="@dimen/activity_margin"
    android:paddingRight="@dimen/activity_margin"
    android:paddingTop="@dimen/half_activity_margin">

    <ImageView
        android:id="@+id/item_image"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_centerVertical="true"
        android:scaleType="centerCrop"
        tools:src="@drawable/placeholder_restaurant"/>

    <TextView
        android:id="@+id/item_price"
        style="@style/secondary_tv"
        fontPath="@string/ubuntu_light"
        android:layout_width="48dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginBottom="@dimen/half_activity_margin"
        android:layout_marginLeft="@dimen/half_activity_margin"
        android:gravity="center_horizontal"
        android:maxLines="2"
        tools:text="5KD"/>


    <LinearLayout
        android:id="@+id/restaurant_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toEndOf="@+id/item_image"
        android:layout_toLeftOf="@+id/item_price"
        android:layout_toRightOf="@+id/item_image"
        android:layout_toStartOf="@+id/item_price"
        android:orientation="vertical">

        <TextView
            android:id="@+id/item_name"
            fontPath="@string/ubuntu_mono_regular"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/half_activity_margin"
            android:layout_marginTop="@dimen/half_activity_margin"
            android:gravity="start"
            android:textAllCaps="true"
            android:textColor="@color/black_primary_text_color"
            android:textSize="@dimen/medium_text"
            tools:text="Restaurant Name"/>

        <TextView
            android:id="@+id/item_desc"
            style="@style/secondary_tv"
            fontPath="@string/ubuntu_light"
            android:layout_marginBottom="@dimen/half_activity_margin"
            android:layout_marginLeft="@dimen/half_activity_margin"
            android:layout_marginTop="4dp"
            android:ellipsize="end"
            android:maxLines="2"
            tools:text="Restaurant Description, max 1 line"/>
    </LinearLayout>

</RelativeLayout>

Java代码

来自 RecyclerView 适配器：

SwipeLayout swipeLayout = (SwipeLayout) itemView.findViewById(R.id.swipe);
    swipeLayout.addSwipeListener(new SwipeLayout.SwipeListener() {
                            @Override
                            public void onStartOpen(SwipeLayout layout) {

                            }

                            @Override
                            public void onOpen(SwipeLayout layout) {

                            }

                            @Override
                            public void onStartClose(SwipeLayout layout) {

                            }

                            @Override
                            public void onClose(SwipeLayout layout) {

                            }

                            @Override
                            public void onUpdate(SwipeLayout layout, int leftOffset, int topOffset) {
        // i tried leveraging the leftOffset which tells me the position of the //layout on the screen but because it is called multiple times, It was //adding many entries to the cart in just one swipe :(
                            }

                            @Override
                            public void onHandRelease(SwipeLayout layout, float xvel, float yvel) {

                            }
                        });

如果有人能提出更好的方法来修复此问题或任何执行此类操作的开源库，我将不胜感激。

非常感谢！

PS：如果您需要我提供更多信息以帮助我，请添加评论。 :)

Answer 1

我要写的是根据你提供的信息的最佳猜测，但似乎就在那里：

@Override
public void onUpdate(SwipeLayout layout, int leftOffset, int topOffset) {
    float percent = ((float)leftOffset/((float)totalWidth));
    // use `percent` to animate the icon, something like:
    icon.setAlpha(percent);
}

@Override
public void onOpen(SwipeLayout layout) {
    // here is the swipe fully open
    addToCart(item); // create the method
    layout.close(); // close the layout again
}

滑动以在 android 中添加视图

Swipe to Add view in android

android

swipe-gesture