Can anyone help me reset the zoom of the image in ImageView?

Question

I made an app that downloads an image from a url (using Universal Image Loader Library) and display that image in a TouchImageView. I used Touch Image View to implement the pinch zoom functionality. I followed this tutorial to learn how to use TouchImageView.

The problem is that whenever I zoom in an image downloaded by Universal Image Loader and loads another image into the TouchImageView the new image is stretched and distorted. This problem is solved when previous zoomed image is restored to original size by zooming out, and then loading the new image.

So the problem can be solved by zooming out of the loaded image and then loading the new image. But I don't know how to reset the zoom and the library does not provide function for that.

I tried using the latest version of TouchImageView (which includes the reset image function) but the newer version is not compatible with the UIL also it seems that the tutorial is using only a part of code from the original library (tough its working fine).

Does anyone know how to reset the zoom in TouchImageView ?

**strong text**Code :

package com.hpubts50.hpubustracker;

import android.content.Context;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView {

    Matrix 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 = 8f;
    float[] m;

    int viewWidth, viewHeight;
    static final int CLICK = 3;
    float saveScale = 1f;
    protected float origWidth, origHeight;
    int oldMeasuredWidth, oldMeasuredHeight;

    ScaleGestureDetector mScaleDetector;

    Context context;

    public TouchImageView(Context context) {
        super(context);
        sharedConstructing(context);
    }

    public TouchImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        sharedConstructing(context);
    }

    private void sharedConstructing(Context context) {
        super.setClickable(true);
        this.context = context;
        mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
        matrix = new Matrix();
        m = new float[9];
        setImageMatrix(matrix);
        setScaleType(ScaleType.MATRIX);

        setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                mScaleDetector.onTouchEvent(event);
                PointF curr = new PointF(event.getX(), event.getY());

                switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    last.set(curr);
                    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 fixTransX = getFixDragTrans(deltaX, viewWidth, origWidth * saveScale);
                        float fixTransY = getFixDragTrans(deltaY, viewHeight, origHeight * saveScale);
                        matrix.postTranslate(fixTransX, fixTransY);
                        fixTrans();
                        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
            }

        });
    }

    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 = detector.getScaleFactor();
            float origScale = saveScale;
            saveScale *= mScaleFactor;
            if (saveScale > maxScale) {
                saveScale = maxScale;
                mScaleFactor = maxScale / origScale;
            } else if (saveScale < minScale) {
                saveScale = minScale;
                mScaleFactor = minScale / origScale;
            }

            if (origWidth * saveScale <= viewWidth || origHeight * saveScale <= viewHeight)
                matrix.postScale(mScaleFactor, mScaleFactor, viewWidth / 2, viewHeight / 2);
            else
                matrix.postScale(mScaleFactor, mScaleFactor, detector.getFocusX(), detector.getFocusY());

            fixTrans();
            return true;
        }
    }

    void fixTrans() {
        matrix.getValues(m);
        float transX = m[Matrix.MTRANS_X];
        float transY = m[Matrix.MTRANS_Y];

        float fixTransX = getFixTrans(transX, viewWidth, origWidth * saveScale);
        float fixTransY = getFixTrans(transY, viewHeight, origHeight * saveScale);

        if (fixTransX != 0 || fixTransY != 0)
            matrix.postTranslate(fixTransX, fixTransY);
    }

    float getFixTrans(float trans, float viewSize, float contentSize) {
        float minTrans, maxTrans;

        if (contentSize <= viewSize) {
            minTrans = 0;
            maxTrans = viewSize - contentSize;
        } else {
            minTrans = viewSize - contentSize;
            maxTrans = 0;
        }

        if (trans < minTrans)
            return -trans + minTrans;
        if (trans > maxTrans)
            return -trans + maxTrans;
        return 0;
    }

    float getFixDragTrans(float delta, float viewSize, float contentSize) {
        if (contentSize <= viewSize) {
            return 0;
        }
        return delta;
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        viewWidth = MeasureSpec.getSize(widthMeasureSpec);
        viewHeight = MeasureSpec.getSize(heightMeasureSpec);

        //
        // Rescales image on rotation
        //
        if (oldMeasuredHeight == viewWidth && oldMeasuredHeight == viewHeight || viewWidth == 0 || viewHeight == 0)
            return;
        oldMeasuredHeight = viewHeight;
        oldMeasuredWidth = viewWidth;

        if (saveScale == 1) {
            // Fit to screen.
            float scale;

            Drawable drawable = getDrawable();
            if (drawable == null || drawable.getIntrinsicWidth() == 0 || drawable.getIntrinsicHeight() == 0)
                return;
            int bmWidth = drawable.getIntrinsicWidth();
            int bmHeight = drawable.getIntrinsicHeight();

            Log.d("bmSize", "bmWidth: " + bmWidth + " bmHeight : " + bmHeight);

            float scaleX = (float) viewWidth / (float) bmWidth;
            float scaleY = (float) viewHeight / (float) bmHeight;
            scale = Math.min(scaleX, scaleY);
            matrix.setScale(scale, scale);

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

            matrix.postTranslate(redundantXSpace, redundantYSpace);

            origWidth = viewWidth - 2 * redundantXSpace;
            origHeight = viewHeight - 2 * redundantYSpace;
            setImageMatrix(matrix);
        }
        fixTrans();
    }

}

PhotoActivity.java

package com.hpubts50.hpubustracker;

import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.Typeface;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.TextView;
import android.widget.Toast;

import com.nostra13.universalimageloader.core.DisplayImageOptions;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
import com.nostra13.universalimageloader.core.assist.DiscCacheUtil;
import com.nostra13.universalimageloader.core.assist.FailReason;
import com.nostra13.universalimageloader.core.assist.ImageLoadingListener;
import com.nostra13.universalimageloader.core.assist.ImageLoadingProgressListener;

public class PhotoActivity extends ActionBarActivity implements OnClickListener {

    private Button btn_insideView, btn_outsideView, btn_resetZoom;
    private ImageView img_busIcon;
    private TouchImageView img_pictureViewer;
    private TextView tv_busName, tv_busNo, tv_cameraStatus;
    private String BusID = null;
    private String BusName = null;
    private ImageLoaderConfiguration config;
    private ImageLoader imageLoader;
    private DisplayImageOptions options;
    private String url;
    private static String SERVER_PATH = "http://hpubts.hpuiitshimla.org/images/";
    private ProgressBar pb_loading;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_photo);

        // Initialize Views
        initializeViews();

        // Get BusID from Bundle
        Bundle gotPhotoBundle = getIntent().getExtras();
        BusID = gotPhotoBundle.getString("BusID");
        BusName = gotPhotoBundle.getString("BusName");

        // Setting Bus Information
        if (BusName.toLowerCase().equals("airavat")) {
            img_busIcon.setImageResource(R.drawable.airavat);
        } else if (BusName.toLowerCase().equals("alaknanda")) {
            img_busIcon.setImageResource(R.drawable.alaknanda);
        } else if (BusName.toLowerCase().equals("chaitanya")) {
            img_busIcon.setImageResource(R.drawable.chaitanya);
        } else if (BusName.toLowerCase().equals("garud")) {
            img_busIcon.setImageResource(R.drawable.garud);
        } else if (BusName.toLowerCase().equals("nandi")) {
            img_busIcon.setImageResource(R.drawable.nandi);
        } else if (BusName.toLowerCase().equals("neela")) {
            img_busIcon.setImageResource(R.drawable.neela);
        } else if (BusName.toLowerCase().equals("pushpak")) {
            img_busIcon.setImageResource(R.drawable.pushpak);
        }

        tv_busName.setText(BusName);
        tv_busNo.setText(BusID);
        tv_cameraStatus.setText("Back Cam");

        // Photo Loading Initializing
        config = new ImageLoaderConfiguration.Builder(getApplicationContext()).build();
        ImageLoader.getInstance().init(config);
        imageLoader = ImageLoader.getInstance();
        options = new DisplayImageOptions.Builder().resetViewBeforeLoading(true).cacheOnDisc(true).showImageOnFail(R.drawable.ic_action_warning).build();

        // Start Back Photo Download
        pb_loading.setProgress(0);
        pb_loading.setVisibility(View.VISIBLE);
        startPhotoDownload(img_pictureViewer, SERVER_PATH + BusID + "_back.jpg");

    }

    private void initializeViews() {
        btn_insideView = (Button) findViewById(R.id.btn_insideView);
        btn_outsideView = (Button) findViewById(R.id.btn_outsideView);
        btn_resetZoom = (Button) findViewById(R.id.btn_resetZoom);
        tv_busName = (TextView) findViewById(R.id.txt_busname);
        tv_busNo = (TextView) findViewById(R.id.txt_busno);
        tv_cameraStatus = (TextView) findViewById(R.id.txt_camera_status);
        img_pictureViewer = (TouchImageView) findViewById(R.id.img_photoViewer);
        img_busIcon = (ImageView) findViewById(R.id.img_busicon);
        pb_loading = (ProgressBar) findViewById(R.id.pb_loading);

        btn_insideView.setOnClickListener(this);
        btn_outsideView.setOnClickListener(this);
        btn_resetZoom.setOnClickListener(this);

        // Set Font Type
        setTypeface(btn_insideView);
        setTypeface(btn_outsideView);
        setTypeface(btn_resetZoom);
        setTypeface(tv_busName);
        setTypeface(tv_busNo);
        setTypeface(tv_cameraStatus);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {

        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.photo, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.btn_insideView:
            url = SERVER_PATH + BusID + "_front.jpg";
            tv_cameraStatus.setText("Front Cam");
            break;
        case R.id.btn_outsideView:
            url = SERVER_PATH + BusID + "_back.jpg";
            tv_cameraStatus.setText("Back Cam");
            break;
        case R.id.btn_resetZoom:

            break;
        }
        // img_pictureViewer
        pb_loading.setProgress(0);
        pb_loading.setVisibility(View.VISIBLE);
        startPhotoDownload(img_pictureViewer, url);
    }

    private void startPhotoDownload(ImageView img_Viewer, String completeUrl) {
        imageLoader.displayImage(completeUrl, img_Viewer, options, new ImageLoadingListener() {
            @Override
            public void onLoadingStarted(String imageUri, View view) {
                DiscCacheUtil.removeFromCache(imageUri, ImageLoader.getInstance().getDiscCache());
            }

            @Override
            public void onLoadingFailed(String imageUri, View view, FailReason failReason) {
                pb_loading.setVisibility(View.INVISIBLE);
                Toast.makeText(getApplicationContext(), "Image Loading Failed", Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
                pb_loading.setVisibility(View.INVISIBLE);
            }

            @Override
            public void onLoadingCancelled(String imageUri, View view) {

            }
        }, new ImageLoadingProgressListener() {
            @Override
            public void onProgressUpdate(String imageUri, View view, int current, int total) {
                pb_loading.setMax(total);
                pb_loading.setProgress(current);
            }
        });
    }

    // Method to set Font Type to Compact
    private void setTypeface(TextView textView) {
        Typeface custom_font = Typeface.createFromAsset(getAssets(), "fonts/compact.ttf");
        textView.setTypeface(custom_font);
    }

    private void setTypeface(Button button) {
        Typeface custom_font = Typeface.createFromAsset(getAssets(), "fonts/compact.ttf");
        button.setTypeface(custom_font);
    }

}

Answer 1

Add a method called resetZoom(), like this:

public void resetZoom()
{
    matrix = new Matrix();
    setImageMatrix(matrix);
}