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();

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

时间: 2024-09-30 19:31:45

Android开发ImageView控件缩放图片的相关文章

CAD控件,CAD插件使用教程:Android开发使用控件--开发环境的搭建

Android开发使用控件入门--环境搭建 2014-12-24 09:57     14人阅读     评论(0)     收藏         编辑     删除 CAD控件.CAD三维控件,手机控件 Android开发控件 软件名称(,梦,,想.CAD  ,控件) 1. 环境搭建: 3 1.1. 安装Eclipse 3 1.2. 下载JDK 3 1.3. 下载Android SDK 5 1.4. 给Eclipse 安装ADT插件  8 1.5. 运行Eclipse设置Android ADT

Android开发_ImageButton控件

Android中的控件中的ImageButton有着一般Button控件所具有的一般特征,但有一个Image的脸 因此可以使用 setImageResource(resId); 来设定其图片资源. 经过测定,Button类组件的获取焦点,即setFocusChange()方法基本没有用,因为一般的Button都会响应点击时间,点击事件会覆盖掉获取焦点事件.

Android开发CheckBox控件,全选,反选,取消全选

在Android开发中我们经常会使用CheckBox控件,那么怎么实现CheckBox控件的全选,反选呢 首先布局我们的界面: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_paren

Android开发 设置控件边角半圆

1 <?xml version="1.0" encoding="utf-8"?> 2 <shape xmlns:android="http://schemas.android.com/apk/res/android" > 3 <corners android:radius="30dip" /> 4 <solid android:color="#ff3290f0" /

android 开发-设置控件/view的水平方向翻转

设置控件沿着水平方向翻转(即Y轴180°) 看效果: 代码: <pl.droidsonroids.gif.GifImageView android:id="@+id/gv_image1" android:layout_width="0dp" android:layout_weight="1" android:layout_height="150dp" android:scaleType="fitXY"

Android开发之控件-Android-PullToRefresh

下拉刷新,使用的是Android-PullToRefresh,Github--https://github.com/chrisbanes/Android-PullToRefresh PullToRefresh的简单使用办法 1.通过GitHub把相关的lib下载下来,导入到ADT 下载下来是这些文件 然后导入到ADT,导入以后是4个工程 LauncherActivityPullToRefreshListFragmentPullToRefreshViewPagerlibrary 假如导入以后,工程

【Android开发】控件外边框自定义

1.在drawable里面新建自定义的资源文件shape <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="10dp"

从零开始学android开发-获取控件

mBtnNews = (Button)findViewById(R.id.btn_news);//获取控件

android 开发-Toast控件的实现

Toast吐司: Toast内容简单,不做过多介绍,Toast支持自带简单吐司,自定义吐司.内容简单可见代码,详见API.A toast provides simple feedback about an operation in a small popup. It only fills the amount of space required for the message and the current activity remains visible and interactive. Fo