最近终于想好了自己发展方向,决定学一学相关的知识,第一课决定从微信的小视频学起,而小视频的第一步就是点击按钮的制作。照例先放效果图
这个按钮提供了轻触和长按两种回掉,长按回掉里还包括了正常回掉和录制时间过短的回掉。
这个自定义view的知识点有:
1.两个圆盘的绘制
2.点击与长按事件的判断
3.根据事件给两个圆添加缩放动画
4.进度条动画的开始与结束
5.添加一些自定义属性供外部调用
好了,思路有了就开始动手解决
1.自定义RecoreButton继承自view,重写onMeasure方法和onDraw方法,用canvas的 canvas.drawCircle方法分别画出内外 两个圆
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int viewWidth = MeasureSpec.getSize(widthMeasureSpec);
int viewHeigth = MeasureSpec.getSize(heightMeasureSpec);
//取长宽的最小值把view绘制成一个正方形
mViewLength = Math.min(viewWidth, viewHeigth);
mCircleCenterX = mViewLength / 2;
mCircleCenterY = mViewLength / 2;
reSetParameters();
setMeasuredDimension(mViewLength, mViewLength);
}
在测量出view的长度之后,外圈灰色圆放大后的半径也就确定了,取view长度的一半作为外圆的半径,保证它放大之后刚好到达这个view的边界,也减少冗余触摸界面,什么是冗余触摸界面呢?我们都知道view整体绘制出来是正方形的,而其中的内容只是一个圆,就会导致我点击的是正方形的角,但是也会出发圆盘的动画。所以圆盘尽量充满view可以让视觉上本不应该点击的部分少一点
@Override
protected void onDraw(Canvas canvas) {
//画外圈圆
canvas.drawCircle(mCircleCenterX, mCircleCenterY, mExternalCircleRadius, mExternalPaint);
//画内圈圆
canvas.drawCircle(mCircleCenterX, mCircleCenterY, mInnerCircleRadius, mInnerPaint);
//画弧形
canvas.drawArc(mRectF, -90, mSweepAngle, false, mProgressPaint);
}
onDraw里只是绘制了两个圆和一个弧形并没有太多内容,这下我们的第一步绘制圆和进度条就完成了,具体圆的半径我会在下文指出。
第二步也是这个自定义view最重要的一步:点击和长按事件的判断
我最初的思路是尽量用系统中有的方法来处理问题,所以我重写了onClick,onLongClick,onTouch方法,想通过系统自带的方法解决事件分发的问题,但很快我就发现了一个问题,如果onLongClick和onTouoch的返回值都为false把事件传递到下一级处理就会出现onTouch的Action_Down-》onLongClick-》onClick的顺序执行,如果返回值为true就是消耗了事件,不会传递到下一级,这样就导致了要么三个方法都执行一遍,要么有的情况判断不到的问题。
所以只能自己处理事件逻辑,这个问题的关键点在只有一个Action_Down事件如何在设置一个分水岭让这个时间之前的触摸执行点击而之后的触摸执行长按,点击还好,在Action_Down里记录手势按下的时间,Action_Up里记录手势抬起的时间,判断这两个时间差是不是小于某个阈值,如果小于就是点击,那么长按事件该如何判断呢?这个还真让我头疼了一阵子&#x