Android 模仿QQ消息列表拖拽滑动和侧滑效果简单实现

举报
xq9527 发表于 2022/06/09 15:41:08 2022/06/09
【摘要】 前言:相信大家都用过QQ 我们在消息列表里面可以使用拖拽滑动改变当前聊天联系人的位置 最近我有模仿做了一个相同的效果,所以现在分享给大家 废话不多说 我们正式开始 效果图: 具体实现<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/a...

前言:

相信大家都用过QQ 我们在消息列表里面可以使用拖拽滑动改变当前聊天联系人的位置 最近我有模仿做了一个相同的效果,所以现在分享给大家 废话不多说 我们正式开始

效果图:

6865547-2bc3994b1bbf7057.jpg
6865547-3c50173037dee222.gif

具体实现

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

     <android.support.v7.widget.RecyclerView
         android:id="@+id/main_ryview"
         android:layout_width="match_parent"
         android:layout_height="match_parent">
     </android.support.v7.widget.RecyclerView>
</RelativeLayout>

6865547-49a63d2eaf1863fb.png
首先我们在MainActivity 布局文件中写一个 RecyclerView 来实现滑动的列表

package com.materialdesign_demo;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;
import java.util.List;

public class MainActivity extends AppCompatActivity  {
    private RecyclerView recyclerView;
    private  Myadapter myadapter;
    ItemTouchHelper itemTouchHelper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initview();
    }

    private void initview() {
        recyclerView=findViewById(R.id.main_ryview);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        List<QQmessage>list=DataUtils.list();
        myadapter=new Myadapter(list, new StartdragCallback() {
            @Override
            public void startdrag(RecyclerView.ViewHolder viewHolder) {
                itemTouchHelper.startDrag(viewHolder);
            }
        });
        recyclerView.setAdapter(myadapter);
        ItemTouchHelper.Callback callback=new 
        MessageitemtochCallback(myadapter);
        itemTouchHelper=new ItemTouchHelper(callback);
        itemTouchHelper.attachToRecyclerView(recyclerView);
    }
}

我们定义一个
MessageitemtochCallback 继承 ItemTouchHelper.Callback
通过重写 getMovementFlags 方法和 onMove来处理 RecyclerView item的拖拽和滑动

package com.materialdesign_demo;

import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;




public class MessageitemtochCallback extends ItemTouchHelper.Callback {
    private  ItemTouchAdapterCallback itemTouchAdapterCallback;
    public MessageitemtochCallback(ItemTouchAdapterCallback itemTouchAdapterCallback) {
        this.itemTouchAdapterCallback = itemTouchAdapterCallback;
    }

    /**
     * @param recyclerView
     * @param viewHolder
     * @return
     * 判断是否需要监听哪个动作 侧滑 拖拽
     */
    @Override
    public int getMovementFlags(@NonNull RecyclerView recyclerView, @NonNull RecyclerView.ViewHolder viewHolder) {
       int  dragFlags=ItemTouchHelper.UP|ItemTouchHelper.DOWN;
       int  swipeFlags=ItemTouchHelper.LEFT|ItemTouchHelper.RIGHT;
        return makeMovementFlags(dragFlags,swipeFlags);

    }

    /**
     *
     * @param recyclerView
     * @return
     * 拖拽的时候回调这个方法
     *
     */

    @Override
    public boolean onMove(@NonNull RecyclerView recyclerView, @NonNull RecyclerView.ViewHolder srcholder,
                          @NonNull RecyclerView.ViewHolder targethodler) {

        /**
         * 刷新数据
         * 刷新界面(刷新adapter)
         *
         */
        itemTouchAdapterCallback.onitemmove(srcholder.getAdapterPosition(),targethodler.getAdapterPosition());
        return false;
    }

    @Override
    public void onSwiped(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
     itemTouchAdapterCallback.onitemSwiped(viewHolder.getAdapterPosition());

    }

    @Override
    public boolean isLongPressDragEnabled() {
        return true;
    }
}

我们在 onMove 方法和 onSwiped方法里面 通过itemTouchAdapterCallback 回调处理 刷新数据

    @Override
    public boolean onMove(@NonNull RecyclerView recyclerView, @NonNull RecyclerView.ViewHolder srcholder,
                          @NonNull RecyclerView.ViewHolder targethodler) {
        /**
         * 刷新数据
         * 刷新界面(刷新adapter)
         *
         */
        itemTouchAdapterCallback.onitemmove(srcholder.getAdapterPosition(),targethodler.getAdapterPosition());
        return false;
    }
    @Override
    public void onSwiped(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
     itemTouchAdapterCallback.onitemSwiped(viewHolder.getAdapterPosition());
  }

我们在 Myadapter 里面需要实现 ItemTouchAdapterCallback来具体的实现的具体的 onitemmove 方法 和onitemSwiped方法 来刷新界面

package com.materialdesign_demo;
public interface ItemTouchAdapterCallback {
    boolean onitemmove(int fromposition , int toposition);
    void  onitemSwiped(int position);
}

Myadapter 具体实现

package com.materialdesign_demo;

import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.Collections;
import java.util.List;


public class Myadapter extends RecyclerView.Adapter<Myadapter.MyViewHodler> implements ItemTouchAdapterCallback{
   private List<QQmessage> data;
   private StartdragCallback satrtdragCallback;
    public Myadapter(List<QQmessage> data, StartdragCallback satrtdragCallback) {
        this.data = data;
        this.satrtdragCallback = satrtdragCallback;
    }
    @NonNull
    @Override
    public Myadapter.MyViewHodler onCreateViewHolder(@NonNull ViewGroup parent, int i) {
       View  view=LayoutInflater.from(parent.getContext()).inflate(R.layout.listitem,parent,false);
        return new MyViewHodler(view);
    }

    @Override
    public void onBindViewHolder(@NonNull final Myadapter.MyViewHodler myViewHodler, int position) {

          QQmessage qqmessage=data.get(position);
          myViewHodler.imageView.setImageResource(qqmessage.getLogo());
          myViewHodler.textView.setText(qqmessage.getName());
          myViewHodler.imageView.setOnTouchListener(new View.OnTouchListener() {
             @Override
             public boolean onTouch(View v, MotionEvent event) {
                satrtdragCallback.startdrag(myViewHodler);
                 return false;
             }
         });
    }
    @Override
    public int getItemCount() {
        return data.size();
    }
    public class  MyViewHodler extends RecyclerView.ViewHolder{
     ImageView imageView;
     TextView textView;
        public MyViewHodler(@NonNull View itemView) {
            super(itemView);
            imageView=itemView.findViewById(R.id.item_imageview);
            textView=itemView.findViewById(R.id.item_textview);
        }
    }
    @Override
    public boolean onitemmove(int fromposition, int toposition) {
        Collections.swap(data ,fromposition,toposition);
           notifyItemMoved(fromposition,toposition);
        return false;
    }

    @Override
    public void onitemSwiped(int position) {

        data.remove(position);
        notifyItemRemoved(position);
    }

}

在 onitemmove 方法里面调用

//改变集合中元素的位置  
 Collections.swap(data ,fromposition,toposition);
//刷新适配器
 notifyItemMoved(fromposition,toposition);
    @Override
    public boolean onitemmove(int fromposition, int toposition) {
        Collections.swap(data ,fromposition,toposition);
           notifyItemMoved(fromposition,toposition);
        return false;
    }

在 onitemSwiped 来调用 data.remove(position);删除集合数据

 @Override
    public void onitemSwiped(int position) {
      //删除集合中某一条数据 
        data.remove(position);
      //  刷新适配器 
        notifyItemRemoved(position);
    }

然后我们在MainActivity 中对itemTouchHelper 进行处理即可

 recyclerView=findViewById(R.id.main_ryview);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        List<QQmessage>list=DataUtils.list();
        myadapter=new Myadapter(list, new StartdragCallback() {
            @Override
            public void startdrag(RecyclerView.ViewHolder viewHolder) {
                itemTouchHelper.startDrag(viewHolder);
            }
        });
        recyclerView.setAdapter(myadapter);
        ItemTouchHelper.Callback callback=new 
        MessageitemtochCallback(myadapter);
        itemTouchHelper=new ItemTouchHelper(callback);
        itemTouchHelper.attachToRecyclerView(recyclerView);

到此我们需要实现仿造QQ的拖拽滑动和侧滑删除已经实现了
###最后总结:
这个是 模仿QQ里面拖拽滑动和侧滑效果是materialdesign材料设计的里面的 ItemTouchHelper.Callback android.support.v7包里面的提供的方法
我们需要继承 重写 getMovementFlags onMove onSwiped 等方法来是实现相应的效果 ,到此整个效果我们就实现完成了, 有兴趣的同学可以留言
项目地址 :https://gitee.com/qiuyu123/FileGit.git

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。