android - 滑动以在 android 中添加 View

Question

我想实现类似下面的 gif:

到目前为止我做了什么:

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

下面是我的代码:

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