今天是星期天的晚上,意味着周末结束了,赶紧调整一下状态,回到工作中来。

今天开始,我用两天的时间,来实现一个Android屏幕触摸校验的功能,其实代码不多,我是利用这次机会,尝试发表系列的博客。很多人都接触过屏幕触摸校验的功能,实质是:点击开始校验,然后就会出现一个点,然后点击那个点,就完成了个校验,然后连续重复几次,一整个校验过程就结束了。

今天开始第一阶段的开发:实现随机出现触摸点。

效果图如下:

android 检查副屏是否支持触摸_ide

这个是点击后的效果。

新建一个类,取名为TouchScreen,然后继承View,重载三个构造方法。

先看看这个阶段用到的变量:

private Paint mPaint;
// 坐标
private float x = 0, y = 0;
// 半径
private float radius = 0;
// 透明度
private float alpha = 0;
// 总宽度
private float mWidth;
// 透明度的最大值
private float MAX_ALPHA = 255;
// 装载x坐标
private List pointX;
// 装载y坐标
private List pointY;
// 角标
private int position = 0;
不是很多,重点看到这两个集合,我是这样给它赋值的:
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
for (int i = 0; i < 9; i++) {
Random random = new Random();
float x = random.nextInt((int) (w * 0.9))
% ((int) (w * 0.9) - (int) (w * 0.1) + 1) + (int) (w * 0.1);
pointX.add(x);
float y = random.nextInt((int) (h * 0.9))
% ((int) (h * 0.9) - (int) (h * 0.1) + 1) + (int) (h * 0.1);
pointY.add(y);
mWidth = w;
}
}
有一个for循环,然后走9次,就是生成了九个随机的点。
接着看到下面的,我是想要点击一个地方,然后出现一个点,这个点,就是刚刚随机生成的点,代码如下:
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
if (position < 9) {
x = pointX.get(position);
y = pointY.get(position);
position++;
radius = 0;
alpha = MAX_ALPHA;
handler.sendEmptyMessage(0);
}
break;
default:
break;
}
return true;
}
这里是给触摸事件按下事件进行处理,当按下的时候,就生成一个点,这里暂时不生成自己的点,这个是后期来做的,
然后下面是一个刷新和更新点的大小的方法,具体代码如下:
private Handler handler = new Handler() {
public void handleMessage(android.os.Message msg) {
refreshState();
invalidate();
if (alpha != 0) {
// 如果透明度没有到0,则继续刷新,否則停止刷新
handler.sendEmptyMessageDelayed(0, 50);
}
};
private void refreshState() {
radius += 5;
alpha -= 10;
if (alpha < 0) {
alpha = 0;
}
// System.out.println(alpha= + alpha);
mWidth = radius / 4;
mPaint.setAlpha((int) alpha);
mPaint.setStrokeWidth(mWidth);
}
};
这里面我们是动态的设置透明度和半径,就是透明度消失的时候,半径就是最大的。
在ondraw()方法里进行一个绘制那个点的效果:
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawCircle(x, y, radius, mPaint);
}
以上就是全部过程,下面贴上全部的代码:
“`
public class TouchScreen extends View {
private Paint mPaint;
// 坐标
private float x = 0, y = 0;
// 半径
private float radius = 0;
// 透明度
private float alpha = 0;
// 总宽度
private float mWidth;
// 透明度的最大值
private float MAX_ALPHA = 255;
// 装载x坐标
private List pointX;
// 装载y坐标
private List pointY;
// 角标
private int position = 0;
public TouchScreen(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
initView();
}
public TouchScreen(Context context, AttributeSet attrs) {
super(context, attrs);
initView();
}
public TouchScreen(Context context) {
super(context);
initView();
}
private void initView() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setColor(Color.GREEN);
mPaint.setStyle(Style.STROKE);
pointX = new ArrayList();
pointY = new ArrayList();
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
for (int i = 0; i < 9; i++) {
Random random = new Random();
float x = random.nextInt((int) (w * 0.9))
% ((int) (w * 0.9) - (int) (w * 0.1) + 1) + (int) (w * 0.1);
pointX.add(x);
float y = random.nextInt((int) (h * 0.9))
% ((int) (h * 0.9) - (int) (h * 0.1) + 1) + (int) (h * 0.1);
pointY.add(y);
mWidth = w;
}
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
if (position < 9) {
x = pointX.get(position);
y = pointY.get(position);
position++;
radius = 0;
alpha = MAX_ALPHA;
handler.sendEmptyMessage(0);
}
break;
default:
break;
}
return true;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawCircle(x, y, radius, mPaint);
}
private Handler handler = new Handler() {
public void handleMessage(android.os.Message msg) {
refreshState();
invalidate();
if (alpha != 0) {
// 如果透明度没有到0,则继续刷新,否則停止刷新
handler.sendEmptyMessageDelayed(0, 50);
}
};
private void refreshState() {
radius += 5;
alpha -= 10;
if (alpha < 0) {
alpha = 0;
}
// System.out.println(alpha= + alpha);
mWidth = radius / 4;
mPaint.setAlpha((int) alpha);
mPaint.setStrokeWidth(mWidth);
}
};
}“`