RecyclerViewItemTouchHelperDemo【使用ItemTouchHelper進行拖拽排序功能】

版權聲明:本文爲HaiyuKing原創文章,轉載請註明出處!java

前言

記錄使用ItemTouchHelper對Recyclerview進行拖拽排序功能的實現。android

效果圖

代碼分析

ItemTouchHelper是一個工具類,可實現側滑刪除和拖拽移動,使用這個工具類須要RecyclerView和Callback。同時根據須要重寫onMove和onSwiped方法。git

使用步驟

1、項目組織結構圖

注意事項:github

一、  導入類文件後須要change包名以及從新import R文件路徑app

二、  Values目錄下的文件(strings.xml、dimens.xml、colors.xml等),若是項目中存在,則複製裏面的內容,不要整個覆蓋ide

2、導入步驟

(1)在build.gradle中引用recyclerview【版本號和appcompat保持一致】

apply plugin: 'com.android.application'

android {
    compileSdkVersion 27
    defaultConfig {
        applicationId "com.why.project.recyclerviewitemtouchhelperdemo"
        minSdkVersion 16
        targetSdkVersion 27
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:27.1.1'
    implementation 'com.android.support.constraint:constraint-layout:1.1.2'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'

    //RecyclerView compile "com.android.support:recyclerview-v7:27.1.1"
}

(2)在AndroidManifest.xml中聲明震動權限

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.why.project.recyclerviewitemtouchhelperdemo">

    <!-- ======================RecyclerView拖拽震動效果====================== -->
    <uses-permission android:name="android.permission.VIBRATE" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>

</manifest>

(3)在項目中實現Recyclerview基本數據展示

一、建立Bean類函數

package com.why.project.recyclerviewitemtouchhelperdemo.bean;

/**
 * Created by HaiyuKing
 * Used 列表項的bean類
 */

public class ChannelBean {
    private String channelId;//頻道id值
    private String channelName;//頻道名稱

    public String getChannelId() {
        return channelId;
    }

    public void setChannelId(String channelId) {
        this.channelId = channelId;
    }

    public String getChannelName() {
        return channelName;
    }

    public void setChannelName(String channelName) {
        this.channelName = channelName;
    }
}
ChannelBean.java

二、建立Adapter以及item的佈局文件工具

package com.why.project.recyclerviewitemtouchhelperdemo.adapter;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.why.project.recyclerviewitemtouchhelperdemo.R;
import com.why.project.recyclerviewitemtouchhelperdemo.bean.ChannelBean;

import java.util.ArrayList;

/**
 * Created by HaiyuKing
 * Used 頻道列表適配器
 */

public class ChannelAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
    /**上下文*/
    private Context myContext;
    /**頻道集合*/
    private ArrayList<ChannelBean> listitemList;

    /**
     * 構造函數
     */
    public ChannelAdapter(Context context, ArrayList<ChannelBean> itemlist) {
        myContext = context;
        listitemList = itemlist;
    }

    /**
     * 獲取總的條目數
     */
    @Override
    public int getItemCount() {
        return listitemList.size();
    }

    /**
     * 建立ViewHolder
     */
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(myContext).inflate(R.layout.channel_list_item, parent, false);
        ItemViewHolder itemViewHolder = new ItemViewHolder(view);
        return itemViewHolder;
    }

    /**
     * 聲明grid列表項ViewHolder*/
    static class ItemViewHolder extends RecyclerView.ViewHolder
    {
        public ItemViewHolder(View view)
        {
            super(view);

            listItemLayout = (LinearLayout) view.findViewById(R.id.listitem_layout);
            mChannelName = (TextView) view.findViewById(R.id.tv_channelName);
        }

        LinearLayout listItemLayout;
        TextView mChannelName;
    }

    /**
     * 將數據綁定至ViewHolder
     */
    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int index) {

        //判斷屬於列表項仍是上拉加載區域
        if(viewHolder instanceof ItemViewHolder){
            ChannelBean channelBean = listitemList.get(index);
            final ItemViewHolder itemViewHold = ((ItemViewHolder)viewHolder);

            itemViewHold.mChannelName.setText(channelBean.getChannelName());

            //若是設置了回調,則設置點擊事件
            if (mOnItemClickLitener != null)
            {
                itemViewHold.listItemLayout.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        int position = itemViewHold.getLayoutPosition();//在增長數據或者減小數據時候,position和index就不同了
                        mOnItemClickLitener.onItemClick(itemViewHold.listItemLayout, position);
                    }
                });
                //長按事件
                itemViewHold.listItemLayout.setOnLongClickListener(new View.OnLongClickListener() {
                    @Override
                    public boolean onLongClick(View view) {
                        int position = itemViewHold.getLayoutPosition();//在增長數據或者減小數據時候,position和index就不同了
                        mOnItemClickLitener.onItemLongClick(itemViewHold.listItemLayout, position);
                        return false;
                    }
                });
            }

        }
    }

    /**
     * 添加Item--用於動畫的展示*/
    public void addItem(int position,ChannelBean listitemBean) {
        listitemList.add(position,listitemBean);
        notifyItemInserted(position);
    }
    /**
     * 刪除Item--用於動畫的展示*/
    public void removeItem(int position) {
        listitemList.remove(position);
        notifyItemRemoved(position);
    }

    /*=====================添加OnItemClickListener回調================================*/
    public interface OnItemClickLitener
    {
        void onItemClick(View view, int position);
        void onItemLongClick(View view, int position);
    }

    private OnItemClickLitener mOnItemClickLitener;

    public void setOnItemClickLitener(OnItemClickLitener mOnItemClickLitener)
    {
        this.mOnItemClickLitener = mOnItemClickLitener;
    }
}
ChannelAdapter.java
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/listitem_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="10dp"
    android:layout_margin="10dp"
    android:background="#c5c5c5">

    <TextView
        android:id="@+id/tv_channelName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="頻道名稱"
        android:textSize="18sp"
        android:layout_gravity="center"/>

</LinearLayout>
channel_list_item.xml

三、在Activity佈局文件中引用Recyclerview控件佈局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="match_parent" android:cacheColorHint="#00000000" android:divider="@null" android:listSelector="#00000000" android:scrollbars="none"
        />

</RelativeLayout>

四、在Activity類中初始化recyclerview數據gradle

package com.why.project.recyclerviewitemtouchhelperdemo;

import android.app.Service;
import android.graphics.Color;
import android.os.Bundle;
import android.os.Vibrator;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;
import android.util.Log;
import android.view.View;
import android.widget.Toast;

import com.why.project.recyclerviewitemtouchhelperdemo.adapter.ChannelAdapter;
import com.why.project.recyclerviewitemtouchhelperdemo.bean.ChannelBean;

import java.util.ArrayList;
import java.util.Collections;

public class MainActivity extends AppCompatActivity {

    private RecyclerView mRecyclerView;
    private ArrayList<ChannelBean> mChannelBeanArrayList;
    private ChannelAdapter mChannelAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();
        initDatas();
        initEvents();

    }

    private void initViews() {
        mRecyclerView = findViewById(R.id.recycler_view);
    }

    private void initDatas() {
        //初始化集合
        mChannelBeanArrayList = new ArrayList<ChannelBean>();
        for(int i=0; i<10;i++){
            ChannelBean channelBean = new ChannelBean();
            channelBean.setChannelId("123"+i);
            channelBean.setChannelName("頻道"+i);

            mChannelBeanArrayList.add(channelBean);
        }

        //設置佈局管理器
        GridLayoutManager gridLayoutManager = new GridLayoutManager(this,3);
        mRecyclerView.setLayoutManager(gridLayoutManager);

        //設置適配器
        if(mChannelAdapter == null){
            //設置適配器
            mChannelAdapter = new ChannelAdapter(this, mChannelBeanArrayList);
            mRecyclerView.setAdapter(mChannelAdapter);
            //添加分割線
            //設置添加刪除動畫
            //調用ListView的setSelected(!ListView.isSelected())方法,這樣就能及時刷新佈局
            mRecyclerView.setSelected(true);
        }else{
            mChannelAdapter.notifyDataSetChanged();
        }
    }

private void initEvents() { //列表適配器的點擊監聽事件 mChannelAdapter.setOnItemClickLitener(new ChannelAdapter.OnItemClickLitener() { @Override public void onItemClick(View view, int position) { Toast.makeText(MainActivity.this, mChannelBeanArrayList.get(position).getChannelName(), Toast.LENGTH_SHORT).show(); } @Override public void onItemLongClick(View view, int position) { Toast.makeText(MainActivity.this, "長按", Toast.LENGTH_SHORT).show(); } }); } }

3、使用方法

在基本的Recyclerview基礎上添加ItemTouchHelper【注意,紫色標記的是用來演示用的,能夠去掉

package com.why.project.recyclerviewitemtouchhelperdemo;

import android.app.Service;
import android.graphics.Color;
import android.os.Bundle;
import android.os.Vibrator;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;
import android.util.Log;
import android.view.View;
import android.widget.Toast;

import com.why.project.recyclerviewitemtouchhelperdemo.adapter.ChannelAdapter;
import com.why.project.recyclerviewitemtouchhelperdemo.bean.ChannelBean;

import java.util.ArrayList;
import java.util.Collections;

public class MainActivity extends AppCompatActivity {

    private RecyclerView mRecyclerView;
    private ArrayList<ChannelBean> mChannelBeanArrayList;
    private ChannelAdapter mChannelAdapter;

    /**拖拽功能*/
    private ItemTouchHelper itemTouchHelper; private int currentPagePosition = -1;//當前拖拽的item的原始位置,從0開始【長按時賦值】,用來和currentPageNewPosition對比進行判斷是否執行排序接口
    private int currentPageNewPosition = -1;//當前item拖拽後的位置,從0開始
    private boolean newOrder = false;//標記是否拖拽排序過,默認是false

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();
        initDatas();
        initEvents();

    }

    private void initViews() {
        mRecyclerView = findViewById(R.id.recycler_view);
    }

    private void initDatas() {
        //初始化集合
        mChannelBeanArrayList = new ArrayList<ChannelBean>();
        for(int i=0; i<10;i++){
            ChannelBean channelBean = new ChannelBean();
            channelBean.setChannelId("123"+i);
            channelBean.setChannelName("頻道"+i);

            mChannelBeanArrayList.add(channelBean);
        }

        //設置佈局管理器
        GridLayoutManager gridLayoutManager = new GridLayoutManager(this,3);
        mRecyclerView.setLayoutManager(gridLayoutManager);

        //設置適配器
        if(mChannelAdapter == null){
            //設置適配器
            mChannelAdapter = new ChannelAdapter(this, mChannelBeanArrayList);
            mRecyclerView.setAdapter(mChannelAdapter);
            //添加分割線
            //設置添加刪除動畫
            //調用ListView的setSelected(!ListView.isSelected())方法,這樣就能及時刷新佈局
            mRecyclerView.setSelected(true);
        }else{
            mChannelAdapter.notifyDataSetChanged();
        }

        initItemTouchHelper();
    }

    private void initItemTouchHelper() {
        //拖拽
        itemTouchHelper = new ItemTouchHelper(new ItemTouchHelper.Callback(){ //開啓長按拖拽功能,默認爲true【暫時用不到】 //若是須要咱們自定義拖拽和滑動,能夠設置爲false,而後調用itemTouchHelper.startDrag(ViewHolder)方法來開啓!
 @Override public boolean isLongPressDragEnabled() { return true; } //開始滑動功能,默認爲true【暫時用不到】 //若是須要咱們自定義拖拽和滑動,能夠設置爲false,而後調用itemTouchHelper.startSwipe(ViewHolder)方法來開啓!
 @Override public boolean isItemViewSwipeEnabled() { return true; } /*用於設置是否處理拖拽事件和滑動事件,以及拖拽和滑動操做的方向 好比若是是列表類型的RecyclerView,拖拽只有UP、DOWN兩個方向 而若是是網格類型的則有UP、DOWN、LEFT、RIGHT四個方向 */ @Override public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) { int dragFlags = 0;//dragFlags 是拖拽標誌
                int swipeFlags = 0;//swipeFlags是側滑標誌,咱們把swipeFlags 都設置爲0,表示不處理滑動操做
                if (recyclerView.getLayoutManager() instanceof GridLayoutManager) { dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN | ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT; swipeFlags = 0; } else { dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN; swipeFlags = 0; } Log.w("ItemTouchHelper","{getMovementFlags}dragFlags="+dragFlags+";swipeFlags="+swipeFlags); return makeMovementFlags(dragFlags, swipeFlags); } /*若是咱們設置了非0的dragFlags ,那麼當咱們長按item的時候就會進入拖拽並在拖拽過程當中不斷回調onMove()方法 咱們就在這個方法裏獲取當前拖拽的item和已經被拖拽到所處位置的item的ViewHolder, 有了這2個ViewHolder,咱們就能夠交換他們的數據集並調用Adapter的notifyItemMoved方法來刷新item*/ @Override public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) { int fromPosition = viewHolder.getAdapterPosition();//獲得拖動ViewHolder的position
                int toPosition = target.getAdapterPosition();//獲得目標ViewHolder的position
                Log.w("ItemTouchHelper","{onMove}fromPosition="+fromPosition+";toPosition="+toPosition); //這裏能夠添加判斷,實現某一項不可交換
                if (fromPosition < toPosition) { for (int i = fromPosition; i < toPosition; i++) { Collections.swap(mChannelBeanArrayList, i, i + 1); } } else { for (int i = fromPosition; i > toPosition; i--) { Collections.swap(mChannelBeanArrayList, i, i - 1); } } mChannelAdapter.notifyItemMoved(fromPosition, toPosition); return true; } /*同理若是咱們設置了非0的swipeFlags,咱們在側滑item的時候就會回調onSwiped的方法,咱們不處理這個事件,空着就好了。*/ @Override public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) { } //咱們但願拖拽的Item在拖拽的過程當中發生震動或者顏色變深,這樣就須要繼續重寫下面兩個方法 //當長按選中item的時候(拖拽開始的時候)調用 //ACTION_STATE_IDLE:閒置狀態 //ACTION_STATE_SWIPE:滑動狀態 //ACTION_STATE_DRAG:拖拽狀態
 @Override public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) { Log.w("ItemTouchHelper","{onSelectedChanged}actionState="+actionState); if (actionState == ItemTouchHelper.ACTION_STATE_DRAG) { //獲取系統震動服務
                    Vibrator vib = (Vibrator) MainActivity.this.getSystemService(Service.VIBRATOR_SERVICE); //震動70毫秒
                    vib.vibrate(70); viewHolder.itemView.setPressed(true); viewHolder.itemView.setBackgroundColor(Color.parseColor("#ff0000"));//演示拖拽的時候item背景顏色加深(實際狀況中去掉)
 } super.onSelectedChanged(viewHolder, actionState); } //當手指鬆開的時候(拖拽或滑動完成的時候)調用,這時候咱們能夠將item恢復爲原來的狀態(相對於背景顏色加深來講的)
 @Override public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) { super.clearView(recyclerView, viewHolder); Log.w("ItemTouchHelper","{clearView}viewHolder.getAdapterPosition="+viewHolder.getAdapterPosition()); viewHolder.itemView.setPressed(false); currentPageNewPosition = viewHolder.getAdapterPosition(); Log.w("ItemTouchHelper","{clearView}currentPagePosition="+currentPagePosition); Log.w("ItemTouchHelper","{clearView}currentPageNewPosition="+currentPageNewPosition); if(!(currentPagePosition == currentPageNewPosition)){ newOrder = true; //執行其餘方法,好比設置拖拽後的item爲選中狀態
 } viewHolder.itemView.setBackgroundColor(Color.parseColor("#c5c5c5"));//演示拖拽的完畢後item背景顏色恢復原樣(實際狀況中去掉)
                mChannelAdapter.notifyDataSetChanged();//解決重疊問題
 } }); //設置是否能夠排序
 itemTouchHelper.attachToRecyclerView(mRecyclerView);
    }

    private void initEvents() {
        //列表適配器的點擊監聽事件
        mChannelAdapter.setOnItemClickLitener(new ChannelAdapter.OnItemClickLitener() {
            @Override
            public void onItemClick(View view, int position) {
                Toast.makeText(MainActivity.this, mChannelBeanArrayList.get(position).getChannelName(), Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onItemLongClick(View view, int position) {
                currentPagePosition = position;//拖拽用到的
                Toast.makeText(MainActivity.this, "長按", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

混淆配置

參考資料

Android使用ItemTouchHelper打造可拖拽的RecyclerView

RecyclerView進階:使用ItemTouchHelper實現拖拽和側滑刪除

RecyclerView愛恨情仇之ItemTouchHelper

項目demo下載地址

https://github.com/haiyuKing/RecyclerViewItemTouchHelperDemo

相關文章
相關標籤/搜索