这篇讲的是如何生成一个自定义的ImageView,实现自动放大缩小动画。
为什么实现这个功能呢?因为我想在ViewPager实现图片放大缩小的动画,但是ViewPager几个页面的动画会一起动,而且放大全屏图片的话会相互覆盖,很诡异。于是上网搜demo,一无所获。迫于无奈。。。
废话不多说,直接贴代码。
1.配置文件直接添加
当直接在布局文件中添加图片的话,可以在自定义View代码中用getDrawable()获取图片资源,然后通过DrawBitmap绘制图片。通过不断绘制图片的位置,达到放大缩小的功能。
第一种情况实在XML布局文件中直接添加的:
public class CoolImageView extends ImageView {
private int mLeft = 0;
private int mTop = 0;
private Handler mHandler;
private Bitmap bitmap;
private Rect srcRect = new Rect();
private Rect dstRect = new Rect();
private int imgWidth;
private int imgHeight;
private boolean flag;
private boolean istart;
public CoolImageView(Context context) {
super(context);
}
public CoolImageView(Context context, AttributeSet attrs) {
super(context, attrs);
setUp(context, attrs);
}
public CoolImageView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
setUp(context, attrs);
}
private void setUp(Context context, AttributeSet attrs) {
mHandler = new MoveHandler();
mHandler.sendEmptyMessageDelayed(1, 220L);
istart = true;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int width = getWidth();
int height = getHeight();
//获取图片资源
BitmapDrawable drawable = (BitmapDrawable) getDrawable();
bitmap = drawable.getBitmap();
dstRect.left = 0;
dstRect.top = 0;
dstRect.right = width;
dstRect.bottom = height;
if (bitmap != null) {
if (istart) {
// 获取图片的宽高
imgWidth = bitmap.getWidth();
imgHeight = bitmap.getHeight();
srcRect.left = 0 + mLeft;
srcRect.right = imgWidth - mLeft;
srcRect.top = 0 + mTop;
srcRect.bottom = imgHeight - mTop;
canvas.drawBitmap(bitmap, srcRect, dstRect, null);
} else {
canvas.drawBitmap(bitmap, null, dstRect, null);
}
}
}
private class MoveHandler extends Handler {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case 1:
if (imgHeight != 0) {
if (mTop == 0) {
mTop += 5;
mLeft += 5;
} else if (mTop == 120) {
mTop -= 5;
mLeft -= 5;
}
}
postInvalidate();
mHandler.sendEmptyMessageDelayed(1, 250);
break;
}
}
}
public void start() {
mTop = 0;
mLeft = 0;
istart = true;
mHandler.sendEmptyMessageDelayed(1, 220L);
}
public void stop() {
istart = false;
}
}
2 .通过Glide加载图片的方式
通过Glide加载图片的话,不能直接用getDrawable获取图片资源。Glide加载图片的方式也需要改变。废话不多说,直接上代码。
CoolimageView直接从Glide的缓存中加载图片。
Glide.with(GoodsPagerActivity.this)
.load(sList.get(position).img)
.override(width, height)
.centerCrop()
.into(new SimpleTarget() {
@Override
public void onResourceReady(GlideDrawable resource, GlideAnimation super GlideDrawable> glideAnimation) {
imageView.setImageDrawable(resource);
}
});
CoolImageView.java:
唯一不同的是获取图片的方式;
```java
public class CoolImageView extends ImageView {
private int mLeft = 0;
private int mTop = 0;
private Handler mHandler;
private Bitmap bitmap;
private Rect srcRect = new Rect();
private Rect dstRect = new Rect();
private int imgWidth;
private int imgHeight;
private boolean flag;
private boolean istart;
private int width;
private int height;
public CoolImageView(Context context) {
super(context);
}
public CoolImageView(Context context, AttributeSet attrs) {
super(context, attrs);
setUp(context, attrs);
}
public CoolImageView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
setUp(context, attrs);
}
private void setUp(Context context, AttributeSet attrs) {
mHandler = new MoveHandler();
mHandler.sendEmptyMessageDelayed(1, 220L);
istart = true;
}
@Override
public void setImageDrawable(@Nullable Drawable drawable) {
super.setImageDrawable(drawable);
if (mHandler != null) {
mHandler.sendEmptyMessageDelayed(1, 220L);
} else {
mHandler = new MoveHandler();
mHandler.sendEmptyMessageDelayed(1, 220L);
istart = true;
}
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
width = getWidth();
height = getHeight();
GlideBitmapDrawable drawable = (GlideBitmapDrawable) getDrawable();
if (drawable != null) {
bitmap = drawable.getBitmap();
}
dstRect.left = 0;
dstRect.top = 0;
dstRect.right = width;
dstRect.bottom = height;
if (bitmap != null) {
if (istart) {
imgWidth = bitmap.getWidth();
imgHeight = bitmap.getHeight();
srcRect.left = 0 + mLeft;
srcRect.right = imgWidth - mLeft;
srcRect.top = 0 + mTop;
srcRect.bottom = imgHeight - mTop;
canvas.drawBitmap(bitmap, srcRect, dstRect, null);
} else {
canvas.drawBitmap(bitmap, null, dstRect, null);
}
}
}
private class MoveHandler extends Handler {
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case 1:
if (imgHeight != 0) {
if (mTop == 0) {
flag = true;
} else if (mTop == 60) {
flag = false;
}
if (!flag) {
mTop -= 2;
mLeft -= 1;
} else {
mTop += 2;
mLeft += 1;
}
}
postInvalidate();
mHandler.sendEmptyMessageDelayed(1, 200);
break;
}
}
}
public void start() {
mTop = 0;
mLeft = 0;
istart = true;
mHandler.sendEmptyMessageDelayed(1, 220L);
}
public void stop() {
istart = false;
}
}
如果感觉动画不够流畅可以缩小线程等待时间。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。