实现原理
使用帧布局叠加 2 个 ImageView,每个 ImageView 负责显示一张图片。给上面的 ImageView 设置触摸的事件,当手指触摸到图片上时,将手指触摸到的点周边的图片的像素点设置为透明的,这样下面的图片就一点一点显示出来了。
注意的事项如下:
1.触摸事件 onTouch 的返回值必须设置为 true,否则触摸的事件将不被处理
2.使用 BitmapFactory 的 decodeResouces 方法得到的图片是没有透明度的,即图片格式为 RGB_565,所以若想能够修改透明度,需要使用 Canvas 对象对图片进行重绘,重新绘制的图片格式采用 ARGB。
使用帧布局叠加 2 个 ImageView,每个 ImageView 负责显示一张图片。给上面的 ImageView 设置触摸的事件,当手指触摸到图片上时,将手指触摸到的点周边的图片的像素点设置为透明的,这样下面的图片就一点一点显示出来了。
注意的事项如下:
1.触摸事件 onTouch 的返回值必须设置为 true,否则触摸的事件将不被处理
2.使用 BitmapFactory 的 decodeResouces 方法得到的图片是没有透明度的,即图片格式为 RGB_565,所以若想能够修改透明度,需要使用 Canvas 对象对图片进行重绘,重新绘制的图片格式采用 ARGB。
3.加载图片时需要对其进行一下压缩,防止图片与控件大小不匹配。
iv = (ImageView) findViewById(R.id.iv);
//1. 获取上图的位图
final Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.up);
//2. 创建一张空白画纸
final Bitmap bitmap2 = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Config.ARGB_8888);
//3. 创建一个画板,并把白纸粘上去
Canvas canvas = new Canvas(bitmap2);
//4. 将top画到纸上
Matrix matrix = new Matrix();
canvas.drawBitmap(bitmap, matrix, null );
//5. 将白纸(已经不是白纸了)设置到 ImageView上
iv.setImageBitmap(bitmap2);
//6. 给ImageView设置滑动监听事件
iv.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent. ACTION_MOVE) {
//获取到当前滑到的坐标
int x = ( int) event.getX();
int y = ( int) event.getY();
int startX = x - 10 > 0 ? x - 10 : 0;
int endX = x + 10 < bitmap.getWidth() ? x + 10 : bitmap.getWidth();
int startY = y - 10 > 0 ? y - 10 : 0;
int endY = y + 10 < bitmap.getHeight() ? y + 10 : bitmap.getHeight();
for ( int i = startX; i < endX; i++) {
for (int j = startY; j < endY; j++) {
//将bitmap2 中指定的像素点设置为透明的
bitmap2.setPixel(i, j, Color.TRANSPARENT);
}
}
//由于 bitmap2的属性修改了,因此需要重新设置到 ImageView上
iv.setImageBitmap(bitmap2);
}
return true;
}
});