微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

android自定义View滑动删除效果

分类：Android作者：编程之家AI导航网

View滑动删除效果图

实现功能

1、可以向左滑动,右侧出现删除
2、向左滑动如果删除出现一大半,松手打开删除,反之关闭删除
3、应用场景
          微信消息的删除功能

实现原理

1、外面是一个ListView
2、条目是一个自定义控件继承ViewGroup
    1）、左边一个TextView,右侧屏幕外也有一个TextView
    2）、所以继承ViewGroup

实现步骤

1、创建一个SlideDeleteView类

    1）.构造方法要关联

public class SlideDelete extends ViewGroup {

 private View leftView;
 private View rightView;
 private ViewDragHelper helper;

 //第一步关联构造方法
 //第二步重写onMeasure和onLViewayout测量子View和布局子View
 public SlideDelete(Context context) {
  this(context,null);
 }

 public SlideDelete(Context context,AttributeSet attrs) {
  this(context,attrs,0);
 }

 public SlideDelete(Context context,AttributeSet attrs,int defStyleAttr) {
  super(context,defStyleAttr);

  helper = ViewDragHelper.create(this,callback);

 }
}

2、在布局文件中设置SlideDeleteView里面的子View

    SlideDeleteView height=80

        TextView
            width:matchParent
            height:matchparent
        TextView

<com.example.movedelete.SlideDelete
  android:id="@+id/container"
  android:layout_width="match_parent"
  android:layout_height="80dp">

  <TextView

   android:id="@+id/content"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:gravity="center"
   android:background="#33000000"
   android:text="第0个条目"
   android:textColor="#fff"
   android:textSize="20sp" />
  <TextView

   android:id="@+id/delete"
   android:layout_width="80dp"
   android:layout_height="match_parent"
   android:background="#f00"
   android:gravity="center"
   android:text="删除"
   android:textColor="#fff"
   android:textSize="20sp" />

 </com.example.movedelete.SlideDelete>

3、重写onMeasure,给子View进行测量

 protected void onMeasure(int widthMeasureSpec,int heightMeasureSpec) {
  //对当前组合View的测量,不使用的话,也可以自己设置
  measureChildren(widthMeasureSpec,heightMeasureSpec);
  super.onMeasure(widthMeasureSpec,heightMeasureSpec);

 }

4、重写onLayout,给子View进行布局

注意事项:要设置leftView,也要设置rightView,不要都写成leftView了

 protected void onLayout(boolean changed,int l,int t,int r,int b) {
  //第一步获取里面子View
  leftView = getChildAt(0);
  rightView = getChildAt(1);
  //第二步给子View提供相应的布局
  int leftL = 0;
  int leftT = 0;
  int leftR = leftView.getMeasuredWidth();
  int leftB = leftView.getMeasuredHeight();
  leftView.layout(leftL,leftT,leftR,leftB);

  //给rightView提供相应的布局
  int rightL = leftView.getMeasuredWidth();
  int rightT = 0;
  int rightR = leftView.getMeasuredWidth()+ rightView.getMeasuredWidth();
  int rightB = rightView.getMeasuredHeight();
  rightView.layout(rightL,rightT,rightR,rightB);

 }

5、设置View的滑动事件onTouchEvent,实现滑动
    1）.因为要滑动,所以消费该事件返回true
    2）.使用ViewDragHelper来实现滑动效果

注意事项:

只能实现leftView的滑动,右侧RightView看不到所以滑动不了

只能给滑动的View设置监听,当滑动的时候,重新设置另一个View的布局跟着滑动

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  //1,要消费该事件,所以直接返回true
  //2,使用ViewDragHelper来实现滑动效果
  helper.processtouchEvent(event);
  return true;
 }

6、重写滑动事件的监听onViewPositionChanged解决只有lefView滑动的问题

    1）.重写的方法是在ViewDragHelper.Callback的子实现类中

    2）.要实现滑动事件,必须在tryCaptureView方法中返回true

 private ViewDragHelper.Callback callback = new ViewDragHelper.Callback() {
  //手势滑动时
  @Override
  public boolean tryCaptureView(View child,int pointerId) {
   return true;
  }

  //监听控件移动状态
  @Override
  public void onViewPositionChanged(View changedView,int left,int top,int dx,int dy) {

   //如果左边控件拖动,我们要让右边控件也重新布局
   if(changedView == leftView){
    rightView.layout(rightView.getLeft()+dx,rightView.getRight()+dx,rightView.getBottom()+dy);
   }else if(changedView == rightView){
    leftView.layout(leftView.getLeft()+dx,leftView.getRight()+dx,leftView.getBottom()+dy);
   }


  }

7、重写clampViewPositionHorizontal水平位置移动,解决左右越界问题

    1.返回值为移动时左侧滑动的距离
    2.如果滑动的控件是leftView时,解决越界
    3.如果滑动的控件是rightView时,解决越界

 public int clampViewPositionHorizontal(View child,int dx) {
   //对左右越界问题的处理
   if(child == leftView){
    //处理两边的越界问题
    if(left >= 0){
     left = 0;
    }else if(left <= -rightView.getMeasuredWidth()){
     left = -rightView.getMeasuredWidth();
    }
   }else if(child == rightView){
    //只处理右边的越界问题,因为左侧越界的时看不到该View
    if(left <= leftView.getMeasuredWidth()- rightView.getMeasuredWidth()){
     left = leftView.getMeasuredWidth()- rightView.getMeasuredWidth();
    }else if(left >= leftView.getMeasuredWidth()){
     left = leftView.getMeasuredWidth();
    }


   }

   return left;
  }

8、手松开时重写onViewReleased方法,实现滑动手松开时,rightView是打开还是关闭

    1.使用ViewDragHelper滑动时,要调用invalidate方法,回调computeScroll方法
    2.重写computeScroll方法

        1）.先判断是否要继承滑动

        2）.使用兼容的invalidate方法来实现匀速滑动

  @Override
  public void onViewReleased(View releasedChild,float xvel,float yvel) {

   //松开后,什么时候打开rightView,什么时候关闭leftView
   //临界值,rightView.getLeft() 和 屏幕的宽度-rightView.getWidth()/2
   if(releasedChild == leftView){
    if(rightView.getLeft() < getMeasuredWidth() - rightView.getMeasuredWidth()/2){
     //使用ViewDragHelper来滑动
     helper.smoothSlideViewTo(rightView,getMeasuredWidth()-rightView.getMeasuredWidth(),0);

     invalidate();
    }else{
     helper.smoothSlideViewTo(rightView,getMeasuredWidth(),0);
     invalidate();
    }
   }

  }



 //需要重写computeScroll

 @Override
 public void computeScroll() {
  //判断是否要继承滑动
  if(helper.continueSettling(true)){
   //invalidate();
   //兼容使用
   ViewCompat.postInvalidateOnAnimation(this);
  }
 }

9、实现删除rightView的点击删除事件

    1.在listView的adapter中找到右侧的rightView
    2.调用rightView的点击事件
    3.删除该条目

        1）删除集合中的数据
            list.remove(position);
        2）更新adapter
            notifyDataSetChanged();
        3）重新绘制整个条目
            requestLayout();

  //设置删除的点击事件
  vh.delete.setonClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    //删除当前的数据
    list.remove(position);
    notifyDataSetChanged();

    //让父容器更新下

   }
  });

  vh.container.requestLayout();

注意事项

1、在重写onLayout方法的时候,给rightView设置布局的时候,写成leftView一直出错
2、在onTouchEvent中要返回true,因为要消费该事件
3、在使用ViewDragHelper.Callback时,重写tryCaptureView时要返回true
4、在onTouchEvent中,不使用scrollby或者scrollTo,而是使用ViewDragHelper工具类,不需要判断滑动的距离

总结

1、首先该控件是自定义view,不是组合控件,因为组合的话rightView在屏幕右侧不能实现
2、是自定义view中的继承ViewGroup,因为左侧leftView和右侧rightView都是TextView不需要自己画

源码

SlideDelete的源码

package com.example.movedelete;

import android.content.Context;
import android.support.v4.view.ViewCompat;
import android.support.v4.widget.ViewDragHelper;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by guixin on 2017/1/5.
 */

public class SlideDelete extends ViewGroup {

 private View leftView;
 private View rightView;
 private ViewDragHelper helper;



 //第一步关联构造方法
 //第二步重写onMeasure和onLViewayout测量子View和布局子View


 public SlideDelete(Context context) {
  this(context,callback);

 }

 private ViewDragHelper.Callback callback = new ViewDragHelper.Callback() {
  //手势滑动时
  @Override
  public boolean tryCaptureView(View child,int pointerId) {
   return true;
  }


  //拖动控件水平移动
  @Override
  public int clampViewPositionHorizontal(View child,因为左侧越界的时看不到该View
    if(left <= leftView.getMeasuredWidth()- rightView.getMeasuredWidth()){
     left = leftView.getMeasuredWidth()- rightView.getMeasuredWidth();
    }else if(left >= leftView.getMeasuredWidth()){
     left = leftView.getMeasuredWidth();
    }


   }

   return left;
  }


  //监听控件移动状态
  @Override
  public void onViewPositionChanged(View changedView,leftView.getBottom()+dy);
   }


  }

  //解决滑动一半松手时,View的复位

  /**
   *
   * @param releasedChild 松开的View
   * @param xvel
   * @param yvel
   */
  @Override
  public void onViewReleased(View releasedChild,0);
     invalidate();
    }
   }

  }
 };

 //需要重写computeScroll

 @Override
 public void computeScroll() {
  //判断是否要继承滑动
  if(helper.continueSettling(true)){
   //invalidate();
   //兼容使用
   ViewCompat.postInvalidateOnAnimation(this);
  }
 }

 @Override
 protected void onMeasure(int widthMeasureSpec,heightMeasureSpec);



 }

 @Override
 protected void onLayout(boolean changed,rightB);

 }

 //View的事件传递

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  //1,使用ViewDragHelper来实现滑动效果
  helper.processtouchEvent(event);
  return true;
 }
}

MainActivity.java源码

package com.example.movedelete;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ListView;

import com.example.movedelete.adapter.SlideDeleteAdapter;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

 private ListView lv;
 private ArrayList<String> list;

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

  //初始化视图
  initView();
  //初始化数据
  initData();
  //初始化事件
  initEvent();


 }

 //初始化视图
 private void initView() {
  lv = (ListView) findViewById(R.id.lv);
 }

 //初始化数据
 private void initData() {
  list = new ArrayList<>();
  for (int i = 0; i < 20; i++) {
   list.add("第"+i+"项条目");
  }
 }

 //初始化事件
 private void initEvent() {
  SlideDeleteAdapter adapter = new SlideDeleteAdapter(list);
  lv.setAdapter(adapter);

 }
}

SlideDeleteAdapter.java源码

package com.example.movedelete.adapter;

import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

import com.example.movedelete.R;
import com.example.movedelete.SlideDelete;

import java.util.ArrayList;

/**
 * Created by guixin on 2017/1/5.
 */
public class SlideDeleteAdapter extends BaseAdapter{
 private ArrayList<String> list;

 public SlideDeleteAdapter(ArrayList<String> list) {
  this.list = list;
 }

 @Override
 public int getCount() {
  return list == null ? 0 : list.size();
 }

 @Override
 public String getItem(int position) {
  return list == null ? null : list.get(position);
 }

 @Override
 public long getItemId(int position) {
  return position;
 }

 @Override
 public View getView(final int position,View convertView,ViewGroup parent) {
  ViewHolder vh;
  if(convertView == null){
   convertView = View.inflate(parent.getContext(),R.layout.item_slide,null);
   vh = new ViewHolder(convertView);

   convertView.setTag(vh);
  }else{
   vh = (ViewHolder) convertView.getTag();
  }

  vh.content.setText(list.get(position));

  //设置删除的点击事件
  vh.delete.setonClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    //删除当前的数据
    list.remove(position);
    notifyDataSetChanged();

    //让父容器更新下

   }
  });

  vh.container.requestLayout();

  return convertView;
 }

 class ViewHolder{
  private TextView content;
  private TextView delete;
  private SlideDelete container;

  public ViewHolder(View v){
    container = (SlideDelete) v.findViewById(R.id.container);
   content = (TextView) v.findViewById(R.id.content);
    delete = (TextView) v.findViewById(R.id.delete);
  }
 }

}

activity_main.xml

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

 <ListView
  android:id="@+id/lv"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

 </ListView>



</RelativeLayout>

item_slide.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical" android:layout_width="match_parent"
 android:layout_height="match_parent">
 <com.example.movedelete.SlideDelete
  android:id="@+id/container"
  android:layout_width="match_parent"
  android:layout_height="80dp">

  <TextView

   android:id="@+id/content"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:gravity="center"
   android:background="#33000000"
   android:text="第0个条目"
   android:textColor="#fff"
   android:textSize="20sp" />
  <TextView

   android:id="@+id/delete"
   android:layout_width="80dp"
   android:layout_height="match_parent"
   android:background="#f00"
   android:gravity="center"
   android:text="删除"
   android:textColor="#fff"
   android:textSize="20sp" />

 </com.example.movedelete.SlideDelete>

</LinearLayout>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

Android 性能优化——之控件的优化
Android性能优化——之控件的优化 前面讲了图像的优化，接下来分享一下控件的性能优化，这里主要是面向自定义View的优化。 1、首先先说一下我们在自定义View中可能会犯的3个错误： 1）UselesscallstoonDraw()：我们知道调用View.invalidate()会触发Vi...
android TextView描边
前言 上一篇已经讲了如何实现textView中粗字体效果，里面主要重写了onDraw方法。 这一边讲一个进阶功能，实现textView的描边效果。 上效果图。 上代码： 原理讲解： 效果实现思路是：因为系统api只给paint设置strokewidth方法，却没有提供设置描边的色值的方法，而且我们通
GreenDao教程1
最近项目重构，涉及到了数据库和文件下载，发现GreenDao这个框架还是不错的。直接面向对象的，可以通过对对象的操作，实现数据的存储。 但是官网上的API是在不敢恭维，文档写的很糙，看了半天，才搞懂一系列的流程。在此进行一下纪念。免得那天需要修改的时候，一脸懵逼。直接上干货 官网地址：http://
WebView加载页面的两种方式——网络页面和本地页面
WebView加载页面的两种方式 一、加载网络页面 加载网络页面，是最简单的一种方式，只需要传入http的URL就可以，实现WebView加载网络页面 代码如下图： 二、加载本地页面 1、加载assets目录下的HTML页面： 加载assets目录的页面，大多数可以用来做页面数据的存储打包，这样可以
Android 全局使用第三方字体
给APP全局设置字体主要分为两个方面来介绍 一、给原生界面设置第三方字体 1、准备工作-下载第三方字体：传送门 将文件放入工程assets目录下。（一般个人习惯单独命名一个文件夹放字体文件，也可直接放入根目录，但记得改引用路径） 2、代码实现 a、自定义application，将第三方的字体，替换当
Android中粗字体
前言 最近UI大牛出了一版新的效果图，按照IOS的效果做的，页面里面有普通字体、中粗字体、加粗字体。对于IOS的小伙伴，分分钟搞定，但是对于Android开发的我，瞬间懵逼了。WTF！ 安卓只有粗和不粗呀，哪有中粗这回事。硬着头皮做出来一版之后，看到UI嫌弃的表情。深深的刺痛了我的完美心。说啥也要搞
TabLayout基本使用
前言 Tablayout继承自HorizontalScrollView，可以用作顶部标签效果、底部导航栏效果。一般多与ViewPager一起使用。 想直接了解如何实现短下滑效果的请看：TabLayout的高级用法 首先上几个效果图。 图： 使用方法 下面我们来看如何使用， 第一步，先在gradle引
AndroidStudio 各种异常情况处理大法
最近使用AndroidStudio出现了.java文件，显示为xml文件等问题，通过各种采坑之后，发现删除本地的缓存文件这个方法最管用，差不多可以根治95%的莫名其妙的问题。解决办法如下； 先将AS关闭，然后找到你电脑的目录C:\Users\用户名\.AndroidStudio3.5\system\
Android文件各种存储路径的比较
1、File cacheDir = context.getCacheDir(); 应用内部存储空间（数据文件私有）文件存储到这个路径下，不需要申请权限，当应用被卸载的时候，目录下的文件会被删除。 需要注意的是，这个文件的目录和应用的存储位置有关， 当应用被移动到外部存储设备的时候，文件的绝对路径也是
汉诺塔问题
汉诺塔问题 最近面试题遇到过汉诺塔的问题，当时竟然懵逼了，不会了！！大学研究的问题竟然都忘光了，于是抓紧捡起来。然而在网上看了看博客，发现非递归算法还真挺多。下面总结了一下。 一、递归算法 1、递归算法优缺点：递归算法算是最易于理解也是最容易实现的，但是对内存的消耗也是巨大的，因为递归需要系统堆栈来
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-bootreact-native