如何获得图像的缩放功能?

Posted

技术标签:

【中文标题】如何获得图像的缩放功能?【英文标题】:How can I get zoom functionality for images? 【发布时间】:2011-02-01 23:52:02 【问题描述】:

有没有一种常用的方法来显示大图像并允许用户放大和缩小以及平移图像?

到目前为止,我找到了两种方法:

    覆盖ImageView,对于这样一个常见的问题来说似乎有点过分了。 使用 web 视图,但对整体布局等的控制较少。

【问题讨论】:

有一个ZOOM CONTROL(Widget),你可以监听OnTouch事件来处理平移。 一个类似的问题***.com/questions/2537396/…,有一个指向本教程的链接anddev.org/…。您可能会发现平移您的 iamge 很有用。我没有详细阅读它,但它也可能会给您一些关于如何执行缩放功能的想法。 有没有人尝试在缩放时保存图像?我希望保存的图像处于默认状态而不是缩放状态。请看我的问题:***.com/questions/24730793/… 谢谢 【参考方案1】:

更新

我刚刚给了 TouchImageView 一个新的更新。除了平移和捏缩放之外,它现在还包括双击缩放和投掷。下面的代码非常过时了。您可以查看github project 以获取最新代码。

用法

将 TouchImageView.java 放在您的项目中。然后它可以像使用一样使用 图像视图。示例:

TouchImageView img = (TouchImageView) findViewById(R.id.img);

如果你在 xml 中使用 TouchImageView,那么你必须提供完整的包 名称,因为它是自定义视图。示例:

<com.example.touch.TouchImageView
    android:id="@+id/img”
    android:layout_
    android:layout_ />

注意:我已经删除了我之前的答案,其中包括一些非常旧的代码,现在直接链接到 github 上最新的代码。

ViewPager

如果您有兴趣将 TouchImageView 放入 ViewPager,refer to this answer.

【讨论】:

Paulo,我没有遇到性能问题,但我没有在平板电脑上进行测试。慢,你的意思是滞后吗?我在 onScale 开始时将最大缩放系数设置为 1.05。这就是你在说的吗?如果没有,请尝试以下操作: 1. 您是否处于调试模式?这将大大减慢它的速度。 2.你设置什么尺寸的图像。我没有使用非常大(8mp)的图像进行测试,但这可能会减慢速度。 3. 你有可以测试的手机吗? 4. 如果所有其他方法都失败,请查看将 mScaleFactor 乘以 2(如果 > 1)或 0.5(如果 @Ahsan 将 View 构造函数更改为:TouchImageView(Context context, AttributeSet attrs) 并调用 super(context, attrs); 这是因为当您为自定义视图充气时,它是由两个参数构造的,而不仅仅是一个。当我解决它时,我将修复 TouchImageView 以支持三个视图构造函数和可绘制对象。 @Ahsan 因为是自定义视图,所以需要在XML文件中写出全名,即&lt;com.example.TouchImageView android:id="@+id/img" /&gt;。你这样做了吗? 这是好东西,找了好久了。请使用来自 github 的代码,因为它是更新的并且效果更好 @Mike 我已经尝试过此代码,但自定义库不起作用。有什么技巧可以解决这个问题。【参考方案2】:

我修改了一些代码来创建一个支持多点触控 (>2.1) 的 TouchImageView。 它的灵感来自于书Hello, Android! (3rd edition)

它包含在以下 3 个文件中 TouchImageView.java WrapMotionEvent.java EclairMotionEvent.java

TouchImageView.java

import se.robertfoss.ChanImageBrowser.Viewer;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.util.FloatMath;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView 

    private static final String TAG = "Touch";
    // These matrices will be used to move and zoom image
    Matrix matrix = new Matrix();
    Matrix savedMatrix = new Matrix();

    // We can be in one of these 3 states
    static final int NONE = 0;
    static final int DRAG = 1;
    static final int ZOOM = 2;
    int mode = NONE;

    // Remember some things for zooming
    PointF start = new PointF();
    PointF mid = new PointF();
    float oldDist = 1f;

    Context context;


    public TouchImageView(Context context) 
        super(context);
        super.setClickable(true);
        this.context = context;

        matrix.setTranslate(1f, 1f);
        setImageMatrix(matrix);
        setScaleType(ScaleType.MATRIX);

        setOnTouchListener(new OnTouchListener() 

            @Override
            public boolean onTouch(View v, MotionEvent rawEvent) 
                WrapMotionEvent event = WrapMotionEvent.wrap(rawEvent);

                // Dump touch event to log
                if (Viewer.isDebug == true)
                    dumpEvent(event);
                

                // Handle touch events here...
                switch (event.getAction() & MotionEvent.ACTION_MASK) 
                case MotionEvent.ACTION_DOWN:
                    savedMatrix.set(matrix);
                    start.set(event.getX(), event.getY());
                    Log.d(TAG, "mode=DRAG");
                    mode = DRAG;
                    break;
                case MotionEvent.ACTION_POINTER_DOWN:
                    oldDist = spacing(event);
                    Log.d(TAG, "oldDist=" + oldDist);
                    if (oldDist > 10f) 
                        savedMatrix.set(matrix);
                        midPoint(mid, event);
                        mode = ZOOM;
                        Log.d(TAG, "mode=ZOOM");
                    
                    break;
                case MotionEvent.ACTION_UP:
                    int xDiff = (int) Math.abs(event.getX() - start.x);
                    int yDiff = (int) Math.abs(event.getY() - start.y);
                    if (xDiff < 8 && yDiff < 8)
                        performClick();
                    
                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    Log.d(TAG, "mode=NONE");
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == DRAG) 
                        // ...
                        matrix.set(savedMatrix);
                        matrix.postTranslate(event.getX() - start.x, event.getY() - start.y);
                     else if (mode == ZOOM) 
                        float newDist = spacing(event);
                        Log.d(TAG, "newDist=" + newDist);
                        if (newDist > 10f) 
                            matrix.set(savedMatrix);
                            float scale = newDist / oldDist;
                            matrix.postScale(scale, scale, mid.x, mid.y);
                        
                    
                    break;
                

                setImageMatrix(matrix);
                return true; // indicate event was handled
            

        );
    


    public void setImage(Bitmap bm, int displayWidth, int displayHeight)  
        super.setImageBitmap(bm);

        //Fit to screen.
        float scale;
        if ((displayHeight / bm.getHeight()) >= (displayWidth / bm.getWidth()))
            scale =  (float)displayWidth / (float)bm.getWidth();
         else 
            scale = (float)displayHeight / (float)bm.getHeight();
        

        savedMatrix.set(matrix);
        matrix.set(savedMatrix);
        matrix.postScale(scale, scale, mid.x, mid.y);
        setImageMatrix(matrix);


        // Center the image
        float redundantYSpace = (float)displayHeight - (scale * (float)bm.getHeight()) ;
        float redundantXSpace = (float)displayWidth - (scale * (float)bm.getWidth());

        redundantYSpace /= (float)2;
        redundantXSpace /= (float)2;


        savedMatrix.set(matrix);
        matrix.set(savedMatrix);
        matrix.postTranslate(redundantXSpace, redundantYSpace);
        setImageMatrix(matrix);
    


    /** Show an event in the LogCat view, for debugging */
    private void dumpEvent(WrapMotionEvent event) 
        // ...
        String names[] =  "DOWN", "UP", "MOVE", "CANCEL", "OUTSIDE",
            "POINTER_DOWN", "POINTER_UP", "7?", "8?", "9?" ;
        StringBuilder sb = new StringBuilder();
        int action = event.getAction();
        int actionCode = action & MotionEvent.ACTION_MASK;
        sb.append("event ACTION_").append(names[actionCode]);
        if (actionCode == MotionEvent.ACTION_POINTER_DOWN
                || actionCode == MotionEvent.ACTION_POINTER_UP) 
            sb.append("(pid ").append(
                    action >> MotionEvent.ACTION_POINTER_ID_SHIFT);
            sb.append(")");
        
        sb.append("[");
        for (int i = 0; i < event.getPointerCount(); i++) 
            sb.append("#").append(i);
            sb.append("(pid ").append(event.getPointerId(i));
            sb.append(")=").append((int) event.getX(i));
            sb.append(",").append((int) event.getY(i));
            if (i + 1 < event.getPointerCount())
            sb.append(";");
        
        sb.append("]");
        Log.d(TAG, sb.toString());
    

    /** Determine the space between the first two fingers */
    private float spacing(WrapMotionEvent event) 
        // ...
        float x = event.getX(0) - event.getX(1);
        float y = event.getY(0) - event.getY(1);
        return FloatMath.sqrt(x * x + y * y);
    

    /** Calculate the mid point of the first two fingers */
    private void midPoint(PointF point, WrapMotionEvent event) 
        // ...
        float x = event.getX(0) + event.getX(1);
        float y = event.getY(0) + event.getY(1);
        point.set(x / 2, y / 2);
    

WrapMotionEvent.java

import android.view.MotionEvent;

public class WrapMotionEvent 
protected MotionEvent event;




    protected WrapMotionEvent(MotionEvent event) 
        this.event = event;
    

    static public WrapMotionEvent wrap(MotionEvent event) 
            try 
                return new EclairMotionEvent(event);
             catch (VerifyError e) 
                return new WrapMotionEvent(event);
            
    



    public int getAction() 
            return event.getAction();
    

    public float getX() 
            return event.getX();
    

    public float getX(int pointerIndex) 
            verifyPointerIndex(pointerIndex);
            return getX();
    

    public float getY() 
            return event.getY();
    

    public float getY(int pointerIndex) 
            verifyPointerIndex(pointerIndex);
            return getY();
    

    public int getPointerCount() 
            return 1;
    

    public int getPointerId(int pointerIndex) 
            verifyPointerIndex(pointerIndex);
            return 0;
    

    private void verifyPointerIndex(int pointerIndex) 
            if (pointerIndex > 0) 
                throw new IllegalArgumentException(
                    "Invalid pointer index for Donut/Cupcake");
            
    


EclairMotionEvent.java

import android.view.MotionEvent;

public class EclairMotionEvent extends WrapMotionEvent 

    protected EclairMotionEvent(MotionEvent event) 
            super(event);
    

    public float getX(int pointerIndex) 
            return event.getX(pointerIndex);
    

    public float getY(int pointerIndex) 
            return event.getY(pointerIndex);
    

    public int getPointerCount() 
            return event.getPointerCount();
    

    public int getPointerId(int pointerIndex) 
            return event.getPointerId(pointerIndex);
    

【讨论】:

Robert Foss,如果这个添加边界判断,它可以更好地下降。非常感谢你的代码 它有效,但我看不出WrapMotionEventEclairMotionEvent 的意义...无论如何,+1。 支持多点触控的手机。 Android 的常规触摸 很好的例子,它工作正常,但我没有得到什么是 Viewer in if (Viewer.isDebug == true) dumpEvent(event); 这是什么? >> se.robertfoss.ChanImageBrowser.Viewer【参考方案3】:

我使用了一个 WebView 并通过

从内存中加载了图像
webview.loadUrl("file://...")

WebView 处理所有平移缩放和滚动。如果您使用 wrap_content ,则 webview 不会比图像大,并且不会显示白色区域。 WebView 是更好的 ImageView ;)

【讨论】:

我正在使用相同的方法。我有一个大型地铁地图,我希望用户能够缩放和滚动。我注意到,如果你有一个相当大的图像(即 1000 或 3000 像素宽),一旦你放大图像就会变得模糊。看起来 coliris 不能非常清晰地显示一个大的缩放图像。即使原始图像未压缩且非常清晰。因此,我最终将一张大图像切割成更小的切片,并通过 html 将它们再次组合在一起。这样放大时图像保持清晰。(我在 Nexus One 上,之前是 2.1 更新,现在是 2.2) @Mathias Lin:如果通过网络发送大图像,我听说运营商会压缩大图像。这个用例适合你还是你在本地加载图像。 @Sam Quest:在本地加载它 使用 webview 的内置缩放按钮和支持捏放大/缩小比编写一个可能无法在不同手机和未来 Android 平台版本上运行的全新算法要好得多 此解决方案仅适用于您碰巧将图像放在磁盘上,或者图像足够小以至于您可以使用 base 64 编码并将字符串值传递给 loadUrlWithData()。 【参考方案4】:

针对 Janusz 最初的问题,有几种方法可以实现这一目标,所有这些方法的难度级别各不相同,如下所述。使用 web 视图很好,但在外观和可控性方面非常有限。如果您正在从画布上绘制位图,那么最通用的解决方案似乎是 MikeOrtiz、Robert Foss 和/或 Jacob Nordfalk 建议的。 PaulBourke 有一个很好的例子来整合 android-multitouch-controller,并且非常适合拥有多点触控支持和所有类型的自定义视图。

就个人而言,如果您只是将画布绘制到位图,然后在 ImageView 中显示它,并且希望能够使用多点触控放大和移动,我发现 MikeOrtiz 的解决方案是最简单的。但是,出于我的目的,他提供的来自Git 的代码似乎仅在他的 TouchImageView 自定义 ImageView 类是唯一的孩子或提供布局参数为:

android:layout_
android:layout_

不幸的是,由于我的布局设计,“layout_height”需要“wrap_content”。当我将其更改为此图像时,图像在底部被裁剪,我无法滚动或缩放到裁剪区域。 因此,我查看了 ImageView 的 Source,以了解 Android 如何实现“onMeasure”并更改 MikeOrtiz 以适应。

   @Override
protected void onMeasure (int widthMeasureSpec, int heightMeasureSpec)

    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

  //**** ADDED THIS ********/////
      int  w = (int) bmWidth;
      int  h = (int) bmHeight;
     width = resolveSize(w, widthMeasureSpec);  
     height = resolveSize(h, heightMeasureSpec);
  //**** END ********///   

   // width = MeasureSpec.getSize(widthMeasureSpec);   // REMOVED
   // height = MeasureSpec.getSize(heightMeasureSpec); // REMOVED

    //Fit to screen.
    float scale;
    float scaleX =  (float)width / (float)bmWidth;
    float scaleY = (float)height / (float)bmHeight;

    scale = Math.min(scaleX, scaleY);
    matrix.setScale(scale, scale);
    setImageMatrix(matrix);
    saveScale = 1f;

    // Center the image
    redundantYSpace = (float)height - (scale * (float)bmHeight) ;
    redundantXSpace = (float)width - (scale * (float)bmWidth);
    redundantYSpace /= (float)2;
    redundantXSpace /= (float)2;

    matrix.postTranslate(redundantXSpace, redundantYSpace);

    origWidth = width - 2 * redundantXSpace;
    origHeight = height - 2 * redundantYSpace;
   // origHeight = bmHeight;
    right = width * saveScale - width - (2 * redundantXSpace * saveScale);
    bottom = height * saveScale - height - (2 * redundantYSpace * saveScale);

    setImageMatrix(matrix);

这里的 resolveSize(int,int) 是一个“用于协调所需大小与 MeasureSpec 施加的约束的实用程序,其中:

参数:

 - size How big the view wants to be
 - MeasureSpec Constraints imposed by the parent

返回:

 - The size this view should be."

因此,在加载图像时,本质上提供了一种与原始 ImageView 类更相似的行为。可以进行更多更改以支持修改纵横比的更多种类的屏幕。但现在我希望这会有所帮助。感谢 MikeOrtiz 的原始代码,很棒的工作。

【讨论】:

此修复程序是否已合并到 Mike 的 github 存储库中?【参考方案5】:

你也可以试试http://code.google.com/p/android-multitouch-controller/

这个库真的很棒,虽然一开始有点难以掌握。

【讨论】:

【参考方案6】:

我刚刚集成了 Robert Foss 的 TouchImageView:它开箱即用!谢谢!

我只是修改了一些代码,以便能够从我的 layout.xml 中实例化它。

只需添加两个构造函数

public TouchImageView(Context context, AttributeSet attrs) 
    super(context, attrs);
    init(context);


public TouchImageView(Context context) 
    super(context);
    init(context);

并将旧的构造函数转换为 init 方法:

private void init(Context context)
    //...old code ofconstructor of Robert Moss's code

【讨论】:

【参考方案7】:

@Robert Foss、@Mike Ortiz,非常感谢您的工作。我合并了你的工作,并完成了适用于 android > 2.0 的 Robert 课程和 Mike 的额外工作。

由于我的工作,我展示了基于 ViewPager 并使用修改后的 TouchImageView 的 Android Touch Gallery。通过 URL 加载图像,您可以缩放和拖动它们。你可以在这里找到它https://github.com/Dreddik/AndroidTouchGallery

【讨论】:

【参考方案8】:

尝试使用ZoomView 缩放任何其他视图。

http://code.google.com/p/android-zoom-view/ 使用简单、免费且有趣!

【讨论】:

不再维护此存储库。【参考方案9】:

添加到@Mike 的答案。我还需要双击以将图像恢复到第一次查看时的原始尺寸。所以我添加了一大堆“原始...”实例变量,并添加了 SimpleOnGestureListener 来解决问题。

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView 

    Matrix matrix = new Matrix();

    // We can be in one of these 3 states
    static final int NONE = 0;
    static final int DRAG = 1;
    static final int ZOOM = 2;
    int mode = NONE;

    // Remember some things for zooming
    PointF last = new PointF();
    PointF start = new PointF();
    float minScale = 1f;
    float maxScale = 3f;
    float[] m;

    float redundantXSpace, redundantYSpace, origRedundantXSpace, origRedundantYSpace;;

    float width, height;
    static final int CLICK = 3;
    static final float SAVE_SCALE = 1f;
    float saveScale = SAVE_SCALE;

    float right, bottom, origWidth, origHeight, bmWidth, bmHeight, origScale, origBottom,origRight;

    ScaleGestureDetector mScaleDetector;
    GestureDetector mGestureDetector;

    Context context;

    public TouchImageView(Context context) 
        super(context);
        super.setClickable(true);
        this.context = context;
        mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());

        matrix.setTranslate(1f, 1f);
        m = new float[9];
        setImageMatrix(matrix);
        setScaleType(ScaleType.MATRIX);

        setOnTouchListener(new OnTouchListener() 

            @Override
            public boolean onTouch(View v, MotionEvent event) 

                boolean onDoubleTapEvent = mGestureDetector.onTouchEvent(event);
                if (onDoubleTapEvent) 
                    // Reset Image to original scale values
                    mode = NONE;
                    bottom = origBottom;
                    right = origRight;
                    last = new PointF();
                    start = new PointF();
                    m = new float[9];
                    saveScale = SAVE_SCALE;
                    matrix = new Matrix();
                    matrix.setScale(origScale, origScale);
                    matrix.postTranslate(origRedundantXSpace, origRedundantYSpace);
                    setImageMatrix(matrix);
                    invalidate();
                    return true;
                 


                mScaleDetector.onTouchEvent(event);

                matrix.getValues(m);
                float x = m[Matrix.MTRANS_X];
                float y = m[Matrix.MTRANS_Y];
                PointF curr = new PointF(event.getX(), event.getY());

                switch (event.getAction()) 
                case MotionEvent.ACTION_DOWN:
                    last.set(event.getX(), event.getY());
                    start.set(last);
                    mode = DRAG;
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == DRAG) 
                        float deltaX = curr.x - last.x;
                        float deltaY = curr.y - last.y;
                        float scaleWidth = Math.round(origWidth * saveScale);
                        float scaleHeight = Math.round(origHeight * saveScale);
                        if (scaleWidth < width) 
                            deltaX = 0;
                            if (y + deltaY > 0)
                                deltaY = -y;
                            else if (y + deltaY < -bottom)
                                deltaY = -(y + bottom);
                         else if (scaleHeight < height) 
                            deltaY = 0;
                            if (x + deltaX > 0)
                                deltaX = -x;
                            else if (x + deltaX < -right)
                                deltaX = -(x + right);
                         else 
                            if (x + deltaX > 0)
                                deltaX = -x;
                            else if (x + deltaX < -right)
                                deltaX = -(x + right);

                            if (y + deltaY > 0)
                                deltaY = -y;
                            else if (y + deltaY < -bottom)
                                deltaY = -(y + bottom);
                        
                        matrix.postTranslate(deltaX, deltaY);
                        last.set(curr.x, curr.y);
                    
                    break;

                case MotionEvent.ACTION_UP:
                    mode = NONE;
                    int xDiff = (int) Math.abs(curr.x - start.x);
                    int yDiff = (int) Math.abs(curr.y - start.y);
                    if (xDiff < CLICK && yDiff < CLICK)
                        performClick();
                    break;

                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    break;
                

                setImageMatrix(matrix);
                invalidate();

                return true; // indicate event was handled
            

        );

        mGestureDetector = new GestureDetector(context, new GestureDetector.SimpleOnGestureListener() 
            @Override
            public boolean onDoubleTapEvent(MotionEvent e) 
                return true;
            
        );
    

    @Override
    public void setImageBitmap(Bitmap bm) 
        super.setImageBitmap(bm);
        bmWidth = bm.getWidth();
        bmHeight = bm.getHeight();
    

    public void setMaxZoom(float x) 
        maxScale = x;
    

    private class ScaleListener extends
            ScaleGestureDetector.SimpleOnScaleGestureListener 
        @Override
        public boolean onScaleBegin(ScaleGestureDetector detector) 
            mode = ZOOM;
            return true;
        

        @Override
        public boolean onScale(ScaleGestureDetector detector) 
            float mScaleFactor = (float) Math.min(
                    Math.max(.95f, detector.getScaleFactor()), 1.05);
            float origScale = saveScale;
            saveScale *= mScaleFactor;
            if (saveScale > maxScale) 
                saveScale = maxScale;
                mScaleFactor = maxScale / origScale;
             else if (saveScale < minScale) 
                saveScale = minScale;
                mScaleFactor = minScale / origScale;
            
            right = width * saveScale - width
                    - (2 * redundantXSpace * saveScale);
            bottom = height * saveScale - height
                    - (2 * redundantYSpace * saveScale);
            if (origWidth * saveScale <= width
                    || origHeight * saveScale <= height) 
                matrix.postScale(mScaleFactor, mScaleFactor, width / 2,
                        height / 2);
                if (mScaleFactor < 1) 
                    matrix.getValues(m);
                    float x = m[Matrix.MTRANS_X];
                    float y = m[Matrix.MTRANS_Y];
                    if (mScaleFactor < 1) 
                        if (Math.round(origWidth * saveScale) < width) 
                            if (y < -bottom)
                                matrix.postTranslate(0, -(y + bottom));
                            else if (y > 0)
                                matrix.postTranslate(0, -y);
                         else 
                            if (x < -right)
                                matrix.postTranslate(-(x + right), 0);
                            else if (x > 0)
                                matrix.postTranslate(-x, 0);
                        
                    
                
             else 
                matrix.postScale(mScaleFactor, mScaleFactor,
                        detector.getFocusX(), detector.getFocusY());
                matrix.getValues(m);
                float x = m[Matrix.MTRANS_X];
                float y = m[Matrix.MTRANS_Y];
                if (mScaleFactor < 1) 
                    if (x < -right)
                        matrix.postTranslate(-(x + right), 0);
                    else if (x > 0)
                        matrix.postTranslate(-x, 0);
                    if (y < -bottom)
                        matrix.postTranslate(0, -(y + bottom));
                    else if (y > 0)
                        matrix.postTranslate(0, -y);
                
            
            return true;

        
    

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width = MeasureSpec.getSize(widthMeasureSpec);
        height = MeasureSpec.getSize(heightMeasureSpec);
        // Fit to screen.
        float scale;
        float scaleX = (float) width / (float) bmWidth;
        float scaleY = (float) height / (float) bmHeight;
        scale = Math.min(scaleX, scaleY);
        matrix.setScale(scale, scale);
        setImageMatrix(matrix);
        saveScale = SAVE_SCALE;
        origScale = scale;

        // Center the image
        redundantYSpace = (float) height - (scale * (float) bmHeight);
        redundantXSpace = (float) width - (scale * (float) bmWidth);
        redundantYSpace /= (float) 2;
        redundantXSpace /= (float) 2;

        origRedundantXSpace = redundantXSpace;
        origRedundantYSpace = redundantYSpace;

        matrix.postTranslate(redundantXSpace, redundantYSpace);

        origWidth = width - 2 * redundantXSpace;
        origHeight = height - 2 * redundantYSpace;
        right = width * saveScale - width - (2 * redundantXSpace * saveScale);
        bottom = height * saveScale - height
                - (2 * redundantYSpace * saveScale);
        origRight = right;
        origBottom = bottom;
        setImageMatrix(matrix);
    


【讨论】:

【参考方案10】:

这是对该线程的一个非常晚的添加,但我一直在研究支持缩放和平移的图像视图,并且具有一些我在其他地方没有找到的功能。这开始是一种显示非常大的图像而不会导致OutOfMemoryErrors 的方式,通过在缩小时对图像进行二次采样并在放大时加载更高分辨率的图块。它现在支持在ViewPager 中使用、手动旋转或使用 EXIF 信息(90° 停止),使用 OnClickListener 或您自己的 GestureDetectorOnTouchListener 覆盖选定的触摸事件,子类化以添加叠加层、缩放时平移和释放动量。

它不打算作为ImageView 的通用替代品,因此不扩展它,也不支持显示来自资源的图像,仅支持资产和外部文件。它需要 SDK 10。

源代码在 GitHub 上,有一个示例说明了在 ViewPager 中的使用。

https://github.com/davemorrissey/subsampling-scale-image-view

【讨论】:

【参考方案11】:

您可以尝试为此使用 LayoutParams

public void zoom(boolean flag)
    if(flag)
        int width=40;
        int height=40;
    
    else
        int width=20;
        int height=20;
    
    RelativeLayout.LayoutParams param=new RelativeLayout.LayoutParams(width,height); //use the parent layout of the ImageView;
    imageView.setLayoutParams(param); //imageView is the view which needs zooming.

放大=缩放(真); ZoomOut = zoom(false);

【讨论】:

【参考方案12】:
@Override
public void onCreate(Bundle savedInstanceState) 
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    imageDetail = (ImageView) findViewById(R.id.imageView1);
    imageDetail.setOnTouchListener(new View.OnTouchListener() 

        @Override
        public boolean onTouch(View v, MotionEvent event) 
            ImageView view = (ImageView) v;
            System.out.println("matrix=" + savedMatrix.toString());
            switch (event.getAction() & MotionEvent.ACTION_MASK) 
                case MotionEvent.ACTION_DOWN:
                    savedMatrix.set(matrix);
                    startPoint.set(event.getX(), event.getY());
                    mode = DRAG;
                    break;
                case MotionEvent.ACTION_POINTER_DOWN:
                    oldDist = spacing(event);
                    if (oldDist > 10f) 
                        savedMatrix.set(matrix);
                        midPoint(midPoint, event);
                        mode = ZOOM;
                    
                    break;
                case MotionEvent.ACTION_UP:
                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == DRAG) 
                        matrix.set(savedMatrix);
                        matrix.postTranslate(event.getX() - startPoint.x, event.getY() - startPoint.y);
                     else if (mode == ZOOM) 
                        float newDist = spacing(event);
                        if (newDist > 10f) 
                            matrix.set(savedMatrix);
                            float scale = newDist / oldDist;
                            matrix.postScale(scale, scale, midPoint.x, midPoint.y);
                        
                    
                    break;
            
            view.setImageMatrix(matrix);
            return true;

        

        @SuppressLint("FloatMath")
        private float spacing(MotionEvent event) 
            float x = event.getX(0) - event.getX(1);
            float y = event.getY(0) - event.getY(1);
            return FloatMath.sqrt(x * x + y * y);
        

        private void midPoint(PointF point, MotionEvent event) 
            float x = event.getX(0) + event.getX(1);
            float y = event.getY(0) + event.getY(1);
            point.set(x / 2, y / 2);
        
    );

并且drawable文件夹应该有bticn图像文件。 完美的工作:)

【讨论】:

【参考方案13】:

类似下面的东西可以做到。

@Override public boolean onTouch(View v,MotionEvent e)


    tap=tap2=drag=pinch=none;
    int mask=e.getActionMasked();
    posx=e.getX();posy=e.getY();

    float midx= img.getWidth()/2f;
    float midy=img.getHeight()/2f;
    int fingers=e.getPointerCount();

    switch(mask)
    
        case MotionEvent.ACTION_POINTER_UP:
            tap2=1;break;

        case MotionEvent.ACTION_UP:
            tap=1;break;

        case MotionEvent.ACTION_MOVE:
            drag=1;
    
    if(fingers==2)nowsp=Math.abs(e.getX(0)-e.getX(1));
    if((fingers==2)&&(drag==0)) tap2=1;tap=0;drag=0;
    if((fingers==2)&&(drag==1)) tap2=0;tap=0;drag=0;pinch=1;

    if(pinch==1)

    
        if(nowsp>oldsp)scale+=0.1;
        if(nowsp<oldsp)scale-=0.1;
        tap2=tap=drag=0;    
    
    if(tap2==1)
        
            scale-=0.1;
            tap=0;drag=0;
        
    if(tap==1)
        
            tap2=0;drag=0;
            scale+=0.1;
        
    if(drag==1)
        
            movx=posx-oldx;
            movy=posy-oldy;
            x+=movx;
            y+=movy;
            tap=0;tap2=0;
        
    m.setTranslate(x,y);
    m.postScale(scale,scale,midx,midy);
    img.setImageMatrix(m);img.invalidate();
    tap=tap2=drag=none;
    oldx=posx;oldy=posy;
    oldsp=nowsp;
    return true;



public void onCreate(Bundle b)

        super.onCreate(b);

    img=new ImageView(this);
    img.setScaleType(ImageView.ScaleType.MATRIX);
    img.setOnTouchListener(this);

    path=Environment.getExternalStorageDirectory().getPath();   
    path=path+"/DCIM"+"/behala.jpg";
    byte[] bytes;
    bytes=null;
    try
        FileInputStream fis;
        fis=new FileInputStream(path);
        BufferedInputStream bis;
        bis=new BufferedInputStream(fis);
        bytes=new byte[bis.available()];
        bis.read(bytes);
        if(bis!=null)bis.close();
        if(fis!=null)fis.close();

     
    catch(Exception e)
        
        ret="Nothing";
        
    Bitmap bmp=BitmapFactory.decodeByteArray(bytes,0,bytes.length);

    img.setImageBitmap(bmp);

    setContentView(img);

观看完整节目请看这里:Program to zoom image in android

【讨论】:

以上是关于如何获得图像的缩放功能?的主要内容,如果未能解决你的问题,请参考以下文章

图像缩放在功能区中看起来很糟糕

带有缩放图像悬停功能的 Wordpress 图像插件

Android:谷歌照片,如具有缩放功能的网格视图

MFC 显示位图 缩放与拖动的矛盾

如何获得与 Medium.com 的功能标题相似的图像? (裁剪图像)

当图像重新缩放以适合画布时,织物 js 上的裁剪功能无法正常工作