（有圖）仿QQ側滑選單：RecyclerView側滑選單，長按拖拽，滑動刪除

嚴振杰發表於2016-08-25
View

RecyclerView的出現不可否認是開發者們的福利，它自帶的ItemTouchHelper能非常輕鬆的完成側滑刪除、長按拖拽，但是難免有的開發者不會使。再加上實際的開發中側滑刪除往往會用側滑選單來實現，這就難為了有些開發者了。SwipeRecyclerView的出現就完美的解決了這些問題，側滑刪除、長按拖拽Item僅需要一句話…

  1. 需要說明的是，本庫沒有對RecyclerView做大的修改，只是ItemView的封裝。看起來是對RecyclerView的修改，其實僅僅是為RecyclerView新增了使用的方法API而已。
  2. 應開發者們的要求，本庫已經更新了三個版本了，會一直維護下去，根據小夥伴的要求，以後也會新增一些其它功能。

因為SwipeRecyclerView釋出已經一個月了，現在有了幾個不小的更新，都是剛需，所以再次分享出來給大家，希望大家能多多支援。

SwipeRecyclerView將完美解決這些問題：

  1. 以下功能全部支援：豎向ListView、橫向ListView、Grid、StaggeredGrid四種形式。
  2. RecyclerView 左右兩側 側滑選單。
  3. 選單可以自適應Item不同高度。
  4. 某一個Item顯示的不同的選單（類似QQ）。
  5. 選單橫向排布、選單豎向排布（看下圖）。
  6. RecyclerView長按拖拽Item。
  7. RecyclerView側滑刪除item。
  8. 指定RecyclerView的某一個Item不能滑動刪除或長按拖拽。
  9. 用SwipeMenuLayout在任何地方都可以實現你自己的側滑選單。
  10. 使用SwipeRecyclerView下拉重新整理、自動載入更多。
  11. 可以和ViewPager巢狀使用（相容滑動衝突）。

SwipeRecyclerView的原始碼託管在Github：github.com/yanzhenjie/…，歡迎Star。

如果你是手機看本文，記不住專案地址不要緊，記住我的個人主頁就好，我的所有專案在我網站都有。

我的域名是：yanzhenjie.com，也就是我名字嚴振杰.com，我相信你肯定記住了，沒記住的再看一眼啦。

要是還沒記住，更簡單的是百度/Google搜尋我名字：嚴振杰，排名第一的就是我。

效果圖

gif有一些失真，且網頁載入速度慢，可以[下載demo的apk][3]看效果。

側滑選單

  1. 左右兩側都有選單，主動調出第幾個選單或者手指滑動出現。
  2. 根據ViewType某一個Item顯示的不同的選單（類似QQ）

<兩側側滑選單 不同的Item不同的選單

和ViewPager巢狀 下拉重新整理、自動載入更多

  1. 和ViewPager巢狀使用，相容了滑動衝突。
  2. 可以和任何下拉重新整理的框架結合，滑動到底部自動載入更多。

和ViewPager巢狀使用 下拉重新整理載入更多

長按拖拽 側滑選單結合使用

  1. 一直按住Item進行拖拽排序，支援List、Grid形式。
  2. 長按拖拽並且和側滑選單結合使用。

List拖拽排序、選單 Grid拖拽排序、選單

直接滑動刪除 長按拖拽Item排序

  1. 側滑直接刪除，也可以長按拖拽排序。
  2. 可以指定某個Item不能被側滑刪除、不能被長按拖拽。

側滑刪除 指定某一個不能拖拽、滑動刪除

豎型選單 用自定義佈局實現自己的選單

  1. 給選單設定排列方向，支援橫向、豎向。
  2. 開發者用庫中的SwipeMenuLayout開發自己的側滑選單。

選單排列方向 自定義選單

引用方法

  • Eclipse 請自行下載原始碼。
  • AndroidStudio使用Gradle構建新增依賴（推薦） 
    compile 'com.yanzhenjie:recyclerview-swipe:1.0.2'複製程式碼

Or Maven:

<dependency>
  <groupId>com.yanzhenjie</groupId>
  <artifactId>recyclerview-swipe</artifactId>
  <version>1.0.2</version>
  <type>pom</type>
</dependency>複製程式碼

使用介紹

這裡列出關鍵實現，具體請參考demo，或者加最上面的交流群一起討論。 更多教程請進入我的部落格檢視。

啟用SwipeReyclerView的長按Item拖拽功能和側滑刪除功能

recyclerView.setLongPressDragEnabled(true);// 開啟長按拖拽
recyclerView.setItemViewSwipeEnabled(true);// 開啟滑動刪除。
recyclerView.setOnItemMoveListener(onItemMoveListener);// 監聽拖拽和側滑刪除，更新UI和資料。複製程式碼

新增Item側滑選單

側滑選單支援自動開啟某個Item的選單，並可以指定是左邊還是右邊的：

// 開啟第一個Item的左側選單。
recyclerView.openLeftMenu(0);

// 開啟第一個Item的右側選單。
recyclerView.openRightMenu(0);複製程式碼

  • 第一步，引用自定義View：SwipeMenuReyclerView： 

    <com.yanzhenjie.recyclerview.swipe.SwipeMenuRecyclerView
  android:id="@+id/recycler_view"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  app:layout_behavior="@string/appbar_scrolling_view_behavior" />複製程式碼

  • 第二步，設定選單建立器、選單點選監聽：

    SwipeMenuRecyclerView swipeMenuRecyclerView = findViewById(R.id.recycler_view);
// 設定選單建立器。
swipeMenuRecyclerView.setSwipeMenuCreator(swipeMenuCreator);
// 設定選單Item點選監聽。
swipeMenuRecyclerView.setSwipeMenuItemClickListener(menuItemClickListener);複製程式碼

  • 第三步，選單建立器建立選單：

    /**
* 選單建立器。在Item要建立選單的時候呼叫。
*/
private SwipeMenuCreator swipeMenuCreator = new SwipeMenuCreator() {
  @Override
  public void onCreateMenu(SwipeMenu swipeLeftMenu, SwipeMenu swipeRightMenu, int viewType) {

      SwipeMenuItem addItem = new SwipeMenuItem(mContext)
          .setBackgroundDrawable(R.drawable.selector_green)// 點選的背景。
          .setImage(R.mipmap.ic_action_add) // 圖示。
          .setWidth(size) // 寬度。
          .setHeight(size); // 高度。
      swipeLeftMenu.addMenuItem(addItem); // 新增一個按鈕到左側選單。

      SwipeMenuItem deleteItem = new SwipeMenuItem(mContext)
          .setBackgroundDrawable(R.drawable.selector_red)
          .setImage(R.mipmap.ic_action_delete) // 圖示。
          .setText("刪除") // 文字。
          .setTextColor(Color.WHITE) // 文字顏色。
          .setTextSize(16) // 文字大小。
          .setWidth(size)
          .setHeight(size);
      swipeRightMenu.addMenuItem(deleteItem);// 新增一個按鈕到右側側選單。.

      // 上面的選單哪邊不要選單就不要新增。
  }
};複製程式碼

更多使用方法請參考Demo，或者加最上方的QQ群來交流。

  • 第四步，繼承SwipeMenuAdapter，和正常的Adapter一樣使用：

    public class MenuAdapter extends SwipeMenuAdapter<MenuAdapter.DefaultViewHolder> {

  @Override
  public int getItemCount() {
      return 0;
  }

  @Override
  public View onCreateContentView(ViewGroup parent, int viewType) {
      return null;
  }

  @Override
  public ViewHolder onCompatCreateViewHolder(View realContentView, int viewType) {
      return null;
  }

  @Override
  public void onBindViewHolder(MenuAdapter.DefaultViewHolder holder, int position) {
  }
}複製程式碼

就到這裡，更多的細節，請參考Github上的demo和原始碼，原始碼demo下載傳送門。

相關文章