当前位置: 首页 > 编程笔记 >

Android条目拖拽删除功能实例代码

李景天
2023-03-14
本文向大家介绍Android条目拖拽删除功能实例代码,包括了Android条目拖拽删除功能实例代码的使用技巧和注意事项,需要的朋友参考一下

项目中需求,要做条目条目拖拽删除效果,实际效果和QQ消息删除一样,侧滑有制定和删除。

效果图

第一步效果图

1.0自定义控件 SwipeLayout 继承FrameLayout重写里面三个构造方法,分别调用initView().

2.0在布局中使用自定义控件

3.0在initView()方法中,创建拖拽辅辅助工具 ViewDragHelper()

 该方法需要传入回调 MyCallBack()

4.0,创建MyCallBack()回调,继承ViewDragHelper.Callback

  在回调中 覆盖tryCaptureView方法,返回true 允许child被拖拽,被 覆盖clampViewPositionHorizontal 返回left系统提供拖拽位置

5.0 onInterceptTouchEvent 返回:让ViewDragHelper判断是否需要拦截事件

6.0  onTouchEvent 返回true 并且让ViewDragHelper分析事件

具体代码:

布局:

<cn.itheima.swipelayout.SwipeLayout 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="wrap_content"> 
 <!--正文部分--> 
 <RelativeLayout 
  android:layout_width="match_parent" 
  android:layout_height="wrap_content" 
  android:background="#fff" 
  android:orientation="horizontal"> 
  <TextView 
   android:id="@+id/item_tv_name" 
   android:layout_width="wrap_content" 
   android:layout_height="wrap_content" 
   android:padding="10dp" 
   android:text="张三" 
   android:textSize="20sp" /> 
 </RelativeLayout> 
 <!--按钮部分--> 
 <LinearLayout 
  android:layout_width="wrap_content" 
  android:layout_height="wrap_content" 
  android:orientation="horizontal"> 
  <TextView 
   android:layout_width="wrap_content" 
   android:layout_height="wrap_content" 
   android:background="#888888" 
   android:padding="10dp" 
   android:text="呼叫" 
   android:textSize="20sp" /> 
  <TextView 
   android:layout_width="wrap_content" 
   android:layout_height="wrap_content" 
   android:background="#f00" 
   android:padding="10dp" 
   android:text="删除" 
   android:textSize="20sp" /> 
 </LinearLayout> 
</cn.itheima.swipelayout.SwipeLayout> 

SwipeLayout 代码:

public class SwipeLayout extends FrameLayout { 
 private ViewDragHelper mDragHelper; 
 public SwipeLayout(Context context) { 
  super(context); 
  initView(); 
 } 
 public SwipeLayout(Context context, AttributeSet attrs) { 
  super(context, attrs); 
  initView(); 
 } 
 public SwipeLayout(Context context, AttributeSet attrs, int defStyleAttr) { 
  super(context, attrs, defStyleAttr); 
  initView(); 
 } 
 private void initView() { 
  mDragHelper = ViewDragHelper.create(this,new MyCallBack()); 
 } 
 // 让ViewDragHelper就是拖拽辅助工具 返回true 则表示要拦截触摸事件 
 @Override 
 public boolean onInterceptTouchEvent(MotionEvent ev) { 
  //让拖拽辅助工具判断是否需要拦截 事件 
  return mDragHelper.shouldInterceptTouchEvent(ev); 
 } 
 @Override 
 public boolean onTouchEvent(MotionEvent event) { 
  //让拖拽辅助工具分析事件 分析用户手势 
  mDragHelper.processTouchEvent(event); 
  return true; 
 } 
 private class MyCallBack extends ViewDragHelper.Callback{ 
  /** 
   * 如果返回 true 则表示 child 允许被拖拽 
   */ 
  @Override 
  public boolean tryCaptureView(View child, int pointerId) { 
   return true; 
  } 
  /** 
   * 固定被拖拽控件的水平位置, 
   * 参数里的 left 是系统推荐移动到的位置,可以进行修正, 
   * 方法返回的值就是 child 将要移动到的位置 
   */ 
  @Override 
  public int clampViewPositionHorizontal(View child, int left, int dx) { 
   return left; 
  } 
 } 
} 

第二步:

1.0创建onFinishInflate方法获取子控件,并且判断健壮性

/* 
  控件初始化时执行,可以用于获取子控件 
  */ 
 @Override 
 protected void onFinishInflate() { 
  // 健壮性检查 
  if (getChildCount()!=2){ 
   throw new RuntimeException("SwipeLayout 必须存放两个子控件"); 
  } 
  if (!(getChildAt(0) instanceof ViewGroup)||!(getChildAt(1) instanceof ViewGroup)){ 
   throw new RuntimeException("SwipeLayout 的子控件必须是 ViewGroup"); 
  } 
  mContent = (ViewGroup) getChildAt(0); 
  mDeletePanel = (ViewGroup) getChildAt(1); 
 } 

2.0创建onSizeChanged方法,在控件大小改变的时候调用,获取控件的宽高,和删除的面板的最大移动范围

/** 
  * 当控件大小改变的时候调用这个方法 
  */ 
 @Override 
 protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
  super.onSizeChanged(w, h, oldw, oldh); 
  int mWith = w; 
  int mHeigth = h; 
  //界面创建过程中,不能使用 getWidth 方法 
  int mRang = mDeletePanel.getMeasuredWidth(); 
 } 

3.0在onLayout中指定侧拉面板的位置

//指定侧拉面板的位置 
 @Override 
 protected void onLayout(boolean changed, int left, int top, int right, int bottom) { 
  super.onLayout(changed, left, top, right, bottom); 
  mDeletePanel.layout(mWith,0,mWith+mRang,mHeigth); 
 } 

4.0在onViewPositionChanged方法中实现联动效果

/** 
  * 当被拖拽的控件已经移动过后,会调用这个方法,可以用于处理控件间的联动效果 
  * @left 被拖拽控件的真实移动位置 
  * @dx 被拖拽控件的真实偏移大小 
  */ 
  @Override 
  public void onViewPositionChanged(View changedView, int left, int top, int dx, int dy) { 
   if (changedView==mContent){ 
    // 移动正文的同时也要移动侧栏 
    mDeletePanel.offsetLeftAndRight(dx); 
   }else{ 
    mContent.offsetLeftAndRight(dx); 
   } 
  } 

5.0在 clampViewPositionHorizontal方法中  固定被拖拽控件的水平位置,

/** 
   * 固定被拖拽控件的水平位置, 
   * 参数里的 left 是系统推荐移动到的位置,可以进行修正, 
   * 方法返回的值就是 child 将要移动到的位置 
   */ 
  @Override 
  public int clampViewPositionHorizontal(View child, int left, int dx) { 
   if (child==mContent){ 
    if (left>0){ 
     left=0; 
    }else if (left<-mRang){ 
      left=-mRang; 
    } 
   }else{ 
    if (left>mWith){//mWith是屏幕的宽度 
     left=mWith; 
    }else if (left<mWith-mRang){ 
     left=mWith-mRang; 
    } 
   } 
   return left; 
  } 

第三步:

效果图

1.0onViewReleased中根据来开局里面,判断是否打开还是关闭

2.0  在  moveContent中第一次滑动

3.0computeScroll中,继续滑动,直到滑动到指定的位置

4.0注意在onViewPositionChanged中手动刷新界面,调用invalidate方法

如果不手动刷新界面,效果展示不出来

/** 
  * 当用户松手时执行 
  * @xvel 松手时在 X 方向的移动速度,如果为 正数 则说明是向右移动,如果是 负数 则说明是向左移动,如果为零,说明是静止状态 
  */ 
  @Override 
  public void onViewReleased(View releasedChild, float xvel, float yvel) { 
   if (xvel>0){ 
    //向右移动 
    close(); 
   }else if (xvel<0){ 
    //向左移动 
    opend(); 
   }else if (xvel>-mRang/2){// 静止状态 
    close();// 展开不到一半,关闭面板 
   }else{ 
    opend(); 
   } 
  } 
 } 
 /** 
 * 打开面板 
 */ 
 private void opend() { 
  int left=-mRang; 
  moveContent(left); 
 } 
 /** 
 * 关闭面板 
 */ 
 private void close() { 
  int left=0; 
  moveContent(left); 
 } 
 private void moveContent(int left) { 
  // 开启平滑滚动,如果返回 true 则说明要继续刷新界面,保持滚动 
  if(mDragHelper.smoothSlideViewTo(mContent,left,0)){ 
   invalidate(); 
  } 
 } 
 @Override 
 public void computeScroll() { 
  // 继续平滑滚动,如果返回 true 则说明要继续刷新界面,保持滚动 
  if (mDragHelper.continueSettling(true)){ 
   invalidate(); 
  } 
 } 

第四步:

1.0现给ListView赋值   在这就省略

2.0在SwipeLayout中使用枚举记录面板的状态

 private enum Status{ 
 CLOSED,OPENED,DRAGING; 
} 
 private Status status = Status.CLOSED; 
 public Status getStatus() { 
  return status; 
 } 

3.0// 记录上一个打开的面板。注意:一定要是 静态变量

private static SwipeLayout preSwipeLayout;

4.0在onViewPositionChanged中创建一个方法操作关闭面板

// 关闭上一个打开的面板
closePre();

5.0closePre()在这个方法中,判断当前面板的状态,并且根据状态,关闭上一个打开的面板

// 判断当前面板是否正在打开,如果正在打开则将上一个打开的面板关闭 
 private void closePre() { 
  //记录旧状态 
  Status preStatus=status; 
  if (mContent.getLeft()==-mRang){ 
   //记录当前面板已经打开 
   status=status.OPENED; 
  }else if (mContent.getLeft()==0){ 
   //当前面板已经关闭 
   status=status.CLOSED; 
  }else { 
   status=status.DRAGING; 
  } 
  // 如果当前面板旧状态为关闭,并且新状态为拖拽,那么此时可以关闭之前打开的面板 
  if (preStatus==status.CLOSED&&status==status.DRAGING){ 
   if (preSwipeLayout!=null&&preSwipeLayout!=this){ 
    // 关闭上一个面板 
    preSwipeLayout.close(); 
   } 
   // 将当前面板标记为 打开的面板 
   preSwipeLayout=this; 
  } 
 } 

总结

以上所述是小编给大家介绍的Android条目拖拽删除功能实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持!

 类似资料:
  • 本文向大家介绍Android中RecyclerView拖拽、侧删功能的实现代码,包括了Android中RecyclerView拖拽、侧删功能的实现代码的使用技巧和注意事项,需要的朋友参考一下 废话不多说,下面展示一下效果。 这是GridView主文件实现。 代码不难理解,就是activity里面设置一大堆初始化的东西。RecyclerView 初始化,setLayoutManager、addIte

  • 本文向大家介绍js实现拖拽功能,包括了js实现拖拽功能的使用技巧和注意事项,需要的朋友参考一下 效果图:(红色方块可任意拖动) 代码如下: 以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持呐喊教程!

  • 本文向大家介绍基于jquery插件实现拖拽删除图片功能,包括了基于jquery插件实现拖拽删除图片功能的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了jquery插件实现拖拽删除图片功能的具体代码,供大家参考,具体内容如下 实现以下效果 完全拖出这个层,图片会消失,否则图片会回到原来的位置 以上就是本文的全部内容,希望对大家学习jquery程序设计有所帮助。

  • 本文向大家介绍Android实现按钮拖拽还原功能,包括了Android实现按钮拖拽还原功能的使用技巧和注意事项,需要的朋友参考一下 具体代码如下所示: 代码解释: 图一,是完整代码。按钮可以随意拖拽(X+Y轴),抬手,按钮恢复到初始位置。 图二区域,按此方式可以实现横向拖拽,类似接打电话动画效果,左边接听,右边挂断。 总结 以上所述是小编给大家介绍的Android实现按钮拖拽还原功能,希望对大家有

  • 本文向大家介绍js拖拽功能的实现?相关面试题,主要包含被问及js拖拽功能的实现?时的应答技巧和注意事项,需要的朋友参考一下 参考回答: 首先是三个事件,分别是mousedown,mousemove,mouseup 当鼠标点击按下的时候,需要一个tag标识此时已经按下,可以执行mousemove里面的具体方法。     clientX,clientY标识的是鼠标的坐标,分别标识横坐标和纵坐标,并且我

  • 本文向大家介绍BootStrap modal实现拖拽功能,包括了BootStrap modal实现拖拽功能的使用技巧和注意事项,需要的朋友参考一下 bootstrap中有javascript插件modal也就是对话框,加入拖拽功能,具体内容如下 在使用modal时首选需要引用js 编辑Html代码 要完成拖拽功能需要修改一下javascript 推荐 有关bootstrap modal插件使用详细