Android自定义ImageView实现自动放大缩小动画

这篇讲的是如何生成一个自定义的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<GlideDrawable>() {
              @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;
  }
}

如果感觉动画不够流畅可以缩小线程等待时间。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android自定义GestureDetector实现手势ImageView

    不说废话了,进入我们今天的主题吧. 先贴上前面内容的地址: Android手势ImageView三部曲(一) Android手势ImageView三部曲(二) Android手势ImageView三部曲(三) 前面我们讲到了ScaleGestureDetector这个工具类,我在疑惑,为什么搞出一个ScaleGestureDetector,不顺带把什么旋转.移动.做了呢? 好吧-! 谷歌肯定还是想给开发者留一点自己的空间哈. 仿照ScaleGestureDetector,我们来定义一个叫Move

  • Android自定义控件之圆形、圆角ImageView

    一.问题在哪里? 问题来源于app开发中一个很常见的场景--用户头像要展示成圆的:  二.怎么搞? 机智的我,第一想法就是,切一张中间圆形透明.四周与底色相同.尺寸与头像相同的蒙板图片,盖在头像上不就完事了嘛,哈哈哈! 在背景纯色的前提下,这的确能简单解决问题,但是如果背景没有这么简单呢? 在这种不规则背景下,有两个问题: 1).背景图常常是适应手机宽度缩放,而头像的尺寸又是固定宽高DP的,所以固定的蒙板图片是没法保证在不同机型上都和背景图案吻合的. 2).在这种非纯色背景下,哪天想调整一下头像

  • android自定义ImageView仿图片上传示例

    看下效果图 主要看下自定义view 代码 public class ProcessImageView extends ImageView{ private Context context; private Paint paint; private LogUtil log=LogUtil.getInstance(); int progress = 0; private boolean flag; public ProcessImageView(Context context) { super(co

  • Android自定义ImageView实现在图片上添加图层效果

    首先我们先看下效果图 实现思路 这是两张前后对比图,右边第二张图里面的已抢光标签图片当已经没有商品的时候就会显示了,在每个图片的中心位置,第一想法是在ImageView的外层再套一层RelativeLayout 实现方法 <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <SelectableRoundedImageVi

  • Android布局自定义Shap圆形ImageView可以单独设置背景与图片

    一.图片预览: 一.实现功能: 需求要实现布局中为圆形图片,图片背景与图标分开且合并到一个ImageView. 二.具体实现: XML中布局中定义ImageView,关健设置两个参数 Android:backgroup(设置背景),Android:src(设置ImageVIew中图片),圆形图片制作Drawable下定义xml shap样式(solid-color,size-width\hight) XML代码如下: <ImageView android:id="@+id/zhongjie

  • Android 自定义imageview实现图片缩放实例详解

    Android 自定义imageview实现图片缩放实例详解 觉得这个自定义的imageview很好用 性能不错  所以拿出来分享给大家  因为不会做gif图  所以项目效果 就不好贴出来了  把代码贴出来 1.项目结构图 2.Compat.class package com.suo.image; import android.os.Build.VERSION; import android.os.Build.VERSION_CODES; import android.view.View; pu

  • Android自定义圆角ImageView控件

    目前一些比较火的图片加载库虽然支持圆角加载,若你是接的别人作了一半的项目,刚好别人用的图片加载库刚好不支持圆角加载,那么这颗控件你值得拥有.(支持网络图片的加载) 1.创建CustomImageView 类在你的项目中(源码如下) import android.content.Context; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.Bitmap.

  • Android 自定义圆形头像CircleImageView支持加载网络图片的实现代码

    在Android开发中我们常常用到圆形的头像,如果每次加载之后再进行圆形裁剪特别麻烦.所以在这里写一个自定义圆形ImageView,直接去加载网络图片,这样的话就特别的方便. 先上效果图 主要的方法 1.让自定义 CircleImageView 继承ImageView /** * 自定义圆形头像 * Created by Dylan on 2015/11/26 0026. */ public class CircleImageView extends ImageView { } 2.在构造方法中

  • Android通过自定义ImageView控件实现图片的缩放和拖动的实现代码

    概述:通过自定义ImageView控件,在xml布局里面调用自定的组件实现图片的缩放. /** * 自定义的ImageView控制,可对图片进行多点触控缩放和拖动 * * @author qiuwanyong */ public class MyImageView extends ImageView { /** * 初始化状态常量 */ public static final int STATUS_INIT = 1; /** * 图片放大状态常量 */ public static final i

  • Android自定义圆角ImageView

    废话不多说了,直接给大家贴代码了. java类如下: import android.content.Context; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.Bitmap.Config; import android.graphics.Canvas; import android.graphics.Color; import android.gra

  • Android编程实现自定义ImageView圆图功能的方法

    本文实例讲述了Android编程实现自定义ImageView圆图功能的方法.分享给大家供大家参考,具体如下: 首先很感谢开源项目Universal Image Loader图片加载框架.之前也看过一段时间框架源码,但是却没有时间进行知识点的总结. 今天项目遇到了需要实现圆头像的编辑显示,Universal就已经提供了这个显示RoundedBitmapDisplayer这个类实现了圆图功能.看它的代码可以发现是实现的Drawable public static class RoundedDrawa

随机推荐