android 自定义裁剪 陌陌,Android之View篇6————仿陌陌卡片左右滑动选择布局

Android之View篇6————仿陌陌卡片左右滑动选择控件

一.目录

Android之View篇6————仿陌陌卡片左右滑动选择控件

一.目录

二.效果图

三.业务需求梳理

四.思路分析

1. 新建TinderCardView类，并继承FrameLayout

2. 新建TinderStackLayout 类，并继承FrameLayout

五.源码地址

二.效果图

三.业务需求梳理

卡片随着手指的移动进行移动

卡片在移动过程中，随着距离的加大，卡片绕z轴旋转

判断手指的移动方向，显示选择/删除图标，同时图标随距离的增大，透明度增加

手指离开卡片后，根据移动的距离，判断卡片是否移出屏幕，从左边移动还是右边移动

显示的卡片移出完后，增加新的卡片。

显示的4张卡片，需要展示出卡片的层次感

四.思路分析

根据上面的业务逻辑梳理，明显可以知道，实现该功能需要自定义两个View，一个是卡片View(TinderCardView)，一个是卡片的容器(TinderStackLayout)。

需求1,2,3都是手指移动过程中发生，即MotionEvent的ACTION_MOVE事件中。

MotionEvent 这一块不知道的可以看我前面写的博客Android之View篇2————View的事件分发

需求4是在手指离开屏幕后中发生的，即MotionEvent的MotionEvent.ACTION_UP事件中

需求5是卡片动画结束后，判断剩余卡片数量，选择是否要加载新的卡片

需求6是加载新卡片时，要求实现的。

1. 新建TinderCardView类，并继承FrameLayout

a.TinderCardView即展示信息的卡片类，重写其onTouch方法

@Override

public boolean onTouch(final View view, MotionEvent motionEvent) {

TinderStackLayout tinderStackLayout = ((TinderStackLayo