Android自定义view之实现仿抖音双击点赞单击暂停特效

       2018年抖音、快手、火山等短视频App比较火,最近自己做短视频项目时有个需求,就是类似抖音的点赞特效,单击屏幕时视频暂停,再次点击时视频恢复播放,双击或者连续多次点击时出现点赞特效(飘小心心特效),而且是全屏可以随意点击,都是可以响应双击及多击事件。我们的需求是点赞效果出现的同时请求接口,所以还是遇到很多问题的,这里记录一下.先放上一张抖音的点赞效果截图如下:

:

分析一下效果图:

1.当手指单击屏幕时,视频暂停播放,再次点击屏幕视频恢复播放.

2.当连续点击屏幕时,响应双击事件出现小心心特效,而且点击次数为两次或者两次以上.

3.单击暂停视频时和双击点赞同时可以响应,两个事件事件互不冲突.

4.点击整个屏幕都可以响应单击和双击事件.

5.多次点击时间间隔要设置在短时间内不响应,要不会出现多次响应,重复点赞(我们的需求是双击或者多击时请求点赞接口).

实现过程如下:

1.自定义点赞view

/**

* 作者: njb

* 时间: 2018/9/20 0020-上午 11:44

* 描述: 双击点赞心形动画

* 来源:

*/

public class Like extends RelativeLayout {
private Context mContext;
float[] num = {-30, -20, 0, 20, 30};//随机心形图片角度
//记录上一次的点击时间
private long  lastClickTime = 0;
//点击的时间间隔
private long INTERVAL = 200;
private MyClickListener.MyClickCallBack onClickListener;

public Like(Context context) {
    super(context);
    initView(context);
}

public Like(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
    initView(context);
}

public Like(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    initView(context);
}

private void initView(Context context) {
    mContext = context;
}

@Override
protected void dispatchDraw(Canvas canvas) {
    super.dispatchDraw(canvas);
}

@Override
public boolean dispatchTouchEvent(MotionEvent event) {
    switch (event.getAction()){
        case MotionEvent.ACTION_DOWN:
            //获取点击时间
            long currTime = System.currentTimeMillis();
            //判断点击之间的时间差
            long  interval = currTime - lastClickTime;
            lastClickTime = currTime;
            if(interval 

}

2.事件监听类MyClickListener

 

/**

* 作者: njb

* 时间: 2018/11/30 18:18

* 描述:单击和多次点击事件监听回调

* 来源:

*/

public class MyClickListener implements View.OnTouchListener {
    private static int timeout=400;//双击间四百毫秒延时
    private int clickCount = 0;//记录连续点击次数
    private Handler handler;
    private MyClickCallBack myClickCallBack;

    public interface MyClickCallBack{
        void oneClick();//点击一次的回调
        void doubleClick();//双击及连续多次点击的回调
    }


    public MyClickListener(MyClickCallBack myClickCallBack) {
        this.myClickCallBack = myClickCallBack;
        handler = new Handler();
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            clickCount++;
            handler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    if (clickCount == 1) {
                        myClickCallBack.oneClick();
                    }else if(clickCount>=2){
                        myClickCallBack.doubleClick();
                    }
                    handler.removeCallbacksAndMessages(null);
                    //清空handler延时,并防内存泄漏
                    clickCount = 0;//计数清零
                }
            },timeout);//延时timeout后执行run方法中的代码
        }
        return false;//让点击事件继续传播,方便再给View添加其他事件监听
    }
}

3.布局文件代码:



    

    

 

4.Activity代码:

/**
 * 作者: njb
 * 时间: 2018/12/13 14:55
 * 描述:
 * 来源:
 */
public class LikeActivity extends AppCompatActivity {
    private Like like;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_like);
        initView();
    }

    private void initView() {
        like = findViewById(R.id.like);
        like.setOnClickListener(new MyClickListener.MyClickCallBack() {
            @Override
            public void oneClick() {
                Toast.makeText(LikeActivity.this,"单击事件",Toast.LENGTH_SHORT).show();
            }

            @Override
            public void doubleClick() {
                Toast.makeText(LikeActivity.this,"双击或多击事件",Toast.LENGTH_SHORT).show();
            }
        });
    }
}

5.以上就是单击和双击及多击事件监听和点赞动画自定义view实现,由于时间问题后面会加上视频播放、单击暂停等,慢慢完善例子,并给出源码,写得不好,还望大家见谅,有问题大家可以提出一起探讨解决.

点赞动画源码地址:https://gitee.com/jackning_admin/LoveClick

 

你可能感兴趣的:(开发实例)