Android 背景图片的缩放实现

android 背景图片的缩放

 one goal ,one passion !

我们看到一些效果,控件中的背景图片会慢慢变大,但是控件不会随着图片的放大而变大.效果如下:

分析:

想让图片变大,而且控件本身大小不能改变,那么就要改变图片自身大小,而不能改变控件大小.

实现原理:

1,首先拿到我们要放大的图片bitmap.

2,使用bitmap.createbitmap().创建一个bitmap的副本.

3,使用matrix去改变图片副本本身大小

4,使用valueanimator去根据变化率将副本绘制出来.

自定义view

 public class scaleimage extends view {

  /**
   * 设置的背景图片
   */
  private drawable background;
  /**
   * 画布的背景图片
   */
  private bitmap bitmapcopy;
  /**
   * 跟随动画实时更新的 放大比例
   */
  float scal = 1f;

  /**
   * 让原图放大 1.3倍,这个值可以随意更改.目的是让原图填充满控件
   */
  private float orgfrac = 1.3f;
  /**
   * 控件宽
   */
  private int widthsize;
  /**
   * 控件高
   */
  private int heightsize;
  private float downy;
  private float downx;


  public scaleimage(context context) {
    this(context, null);
  }

  public scaleimage(context context, attributeset attrs) {
    this(context, attrs, 0);
  }

  public scaleimage(context context, attributeset attrs, int defstyleattr) {
    super(context, attrs, defstyleattr);
  }

  @override
  protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
    super.onmeasure(widthmeasurespec, heightmeasurespec);


    widthsize = measurespec.getsize(widthmeasurespec);
    heightsize = measurespec.getsize(heightmeasurespec);


  }

  @override
  protected void ondraw(final canvas canvas) {
    super.ondraw(canvas);


    if (background != null) {
      bitmapdrawable bd = (bitmapdrawable) background;
      final bitmap bitmap = bd.getbitmap();


      final matrix matrix = new matrix();

      bitmapcopy = bitmap.createbitmap(bitmap, 0, 0,
          bitmap.getwidth(), bitmap.getheight(),
          matrix, true);


      /**
       * float sx, float sy, float px, float py
       *
       * sx,sy x,y方向缩放比例
       * px,py 以px py为轴心进行缩放
       * 放大比例加了默认的orgfrac.是为了在还没有开始缩放时
       * 放图片能够填充控件.如果图片过小的话,可能控件和图片
       * 之间会有边界空白
       *
       * 注意: 这里的px py :matrix作用于哪个对象上,那么px,py就是对象上的坐标点
       * 如 : 这里就是 bitmapcopy 上的px,py坐标点.
       */

      matrix.setscale(orgfrac + scal, 1, bitmapcopy.getwidth() / 2, bitmapcopy.getheight() / 2);



      canvas.drawbitmap(bitmapcopy, matrix, null);

    }


  }

  /**
   * 开始缩放
   *
   * @param drawableid 需要放大的背景图片
   */
  public void startscale(int drawableid) {


    background = getresources().getdrawable(drawableid);
    if (background == null) {
      throw new runtimeexception("background must not null");
    } else {


      valueanimator animator = valueanimator.offloat(0, 1);
      animator.addupdatelistener(new valueanimator.animatorupdatelistener() {
        @override
        public void onanimationupdate(valueanimator animation) {

          float fraction = (float) animation.getanimatedvalue();

          scal = (float) (0.5 * fraction);
          invalidate();


        }
      });

      animator.setduration(5000);
      animator.setinterpolator(new bounceinterpolator());

      animator.start();

    }

  }

  @override
  public boolean ontouchevent(motionevent event) {

    switch (event.getaction()) {
      case motionevent.action_down:

        downy = event.gety();
        downx = event.getx();

        break;
      case motionevent.action_up:

        float upy = event.gety();
        float upx = event.getx();


        if (math.abs(upy - downy) < 5 && math.abs(upx - downx) < 5) {
          listener.backgroundclick();
        }

        break;
    }


    return true;
  }

  onbackgroundcilcklistener listener;

  /**
   * 点击事件的监听
   *
   * @param listener
   */
  public void addbackgroundcilcklistener(onbackgroundcilcklistener listener) {
    this.listener = listener;
  }


  public interface onbackgroundcilcklistener {
    void backgroundclick();
  }


  }

跑起来

 image = (scaleimage) findviewbyid(r.id.image);

    image.startscale(r.drawable.parallax_img);

    image.addbackgroundcilcklistener(new scaleimage.onbackgroundcilcklistener() {
      @override
      public void backgroundclick() {

      }
    });

小提琴家

matrix使用待续

好了.直接使用控件,我们将资源文件中的drawable传入就可以了.

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！