zoukankan      html  css  js  c++  java
  • Android开发ImageView控件缩放图片

    首先还是最基础的ImageView控件如何显示图片:

    <ImageView
                    Android:id="@+id/imgView"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:src="@drawable/ic_prepicture"
                    android:scaleType="matrix"
                    />

    以上布局中xml的代码主要是scaleType的设置,决定了图片初始显示的状态,ImageView.ScaleType设置图解 这篇文章可以清楚的看到每个参数的效果。

    这里我们主要用matrix这个效果实现缩放,一定要设置scaleType为Matrix,才能实现相应的效果,也可以在代码中imgView.setScaleType(ScaleType.MATRIX);如此设置。

    直奔主题

    第一步:了解操作对象(Matrix)以及操作方式(平移和缩放)

    1,    ImageView控件有getImageMatrix,setImageMatrix这两个函数获取/设置其像素矩阵Matrix;(这个就是我们要操作的对象)

    2.1 矩阵Matrix又有如下的函数1:postTranslate(double dx, double dy)可以实现矩阵平移(dx, dy)它的API说明是:Postconcats the matrix with the specified translation. M' = T(dx, dy) * M。

    2.2 函数2:postScale(float sx, float sy, float px, float py)  可以实现矩阵水平/垂直方向缩放sx,sy;同时控制缩放的中心点(px, py)API说明:Postconcats the matrix with the specified scale. M' = S(sx, sy, px, py) * M

    第二步:了解如何获取平移参数值(dx, dy)以及缩放参数值(sx, sy, centerPoint.x, centerPoint.y)

    对于Android开发来说,这样的实现应该很简单,只是一个OnTouchListener类的实现,重写public boolean onTouch(View v, MotionEvent event) 函数,其中平移是单指,缩放是多指

    1, switch(event.getAction() & MotionEvent.ACTION_MASK),与MotionEvent.ACTION_MASK做与运算主要是为了多指消息的识别,不然不能响应多指。

    2, 平移情况:比较简单,直接在ACTION_MOVE实现中计算dx, dy(event.getX(), event.getY());

    3, 缩放情况:需要计算两个手指之间的距离dis1, dis2, 这样scale = dis2/dis1; 同时还要算出两个手指的中心点,作为缩放的中心点。

    4,再次理一下思路:当出发Down的消息(手指按下)时候,记录初始点的状态;当响应Move的时候,将当前状态与初始状态作比较,做平移或者缩放的操作;当up的时候,初始化状态。

    第三步,通过前面的赘述,直接上代码:

    @Override
     public boolean onTouch(View v, MotionEvent event) {
      // TODO Auto-generated method stub
      switch(event.getAction() & MotionEvent.ACTION_MASK)
      {
      //单指按下
      case MotionEvent.ACTION_DOWN:
      {
          mMode = DRAGMODE;
          mStarPt.set(event.getX(), event.getY());
          mCurrMatrix = mImageView.getImageMatrix();
          
          break;
      }
      //多指缩放的按下
      case MotionEvent.ACTION_POINTER_DOWN:
      {
       mMode = ZOOMMODE;
       mStarDis = GetDistance(event);
       mMidPt  = GetMidPt(event);
       mCurrMatrix = mImageView.getImageMatrix();
       break;
      }
      //移动
      case MotionEvent.ACTION_MOVE:
      {
       if(mMode == DRAGMODE)
       {
        float left = 0, top = 0, right = 0, bottom = 0;
        float dx = event.getX() - mStarPt.x;
        float dy = event.getY() - mStarPt.y;
        
        mMatrix.set(mCurrMatrix);
        mMatrix.postTranslate(dx, dy);
        mStarPt.set(event.getX(), event.getY());
       }
       else if(mMode == ZOOMMODE)
       {
        float endDis = GetDistance(event);
        if (endDis > 10f)
        {
         float fScale = endDis /mStarDis;
         mMatrix.set(mCurrMatrix);
         
         mMatrix.postScale(fScale, fScale, mMidPt.x, mMidPt.y);
         //注意加上这一句,否则缩放为数量级了
         mStarDis = endDis;
        }
       }
       mImageView.setImageMatrix(mMatrix);
       break;
      }
      //单指抬起
      case MotionEvent.ACTION_UP:
      //多指抬起
      case MotionEvent.ACTION_POINTER_UP:
      {
       mMode = 0;
       break;
      }
      
      }
      
      return true;
     }

    以下是全局变量的定义:

            private ImageView mImageView;
     private int mMode;    //模式:1-拉动;2-缩放
     final private int DRAGMODE = 1;
     final private int ZOOMMODE = 2;
     
     private PointF  mStarPt = new PointF();
     private float    mStarDis;
     private PointF  mMidPt = new PointF();
     
     private Matrix mMatrix = new Matrix();
     private Matrix mCurrMatrix = new Matrix();

    这样就实现了简单的缩放和平移操作了,代码思路还是参考了网上的一些博客文章。
     
    但是,这样还是有一个问题,就是缩放的限制,不能无限大,也不能无限小,平移也需要定义范围内的平移。下一章就要讲如何实现图片浏览器中的效果。到时再将整体代码贴上来。

  • 相关阅读:
    Access中出现改变字段“自己主动编号”类型,不能再改回来!(已解决)
    移动闭塞
    信号系统基本设备介绍——应答器
    行车闭塞
    计轴
    联锁
    SqlServer 查看缓存 并合理设置最大内存
    SQL Server中bcp命令的用法以及数据批量导入导出
    5 个免费的受欢迎的 SQLite 管理工具
    Qt之操作数据库(SQLite)
  • 原文地址:https://www.cnblogs.com/exmyth/p/4490827.html
Copyright © 2011-2022 走看看