Add zoom to an imageview in Android

Question

I want to add zoom in my Android app. I have tried this code, but it just zooms in and out in the middle of the image and I want to apply the zoom on the whole image.

In the same image, can I put a button in some areas in the image?

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.Drawable;
import android.view.KeyEvent;
import android.view.View;

public class Zoom extends View {
    private Drawable image;
    private int zoomControler=20;
    public Zoom(Context context)
    {
        super(context);
        image=context.getResources().getDrawable(R.drawable.icon);
        setFocusable(true);
    }

    @Override
    protected void onDraw(Canvas canvas) {

        // TODO Auto-generated method stub
        super.onDraw(canvas);

        //Here you can control the width and height of the images........ this line is very important
        image.setBounds((getWidth()/2)-zoomControler, (getHeight()/2)-zoomControler, (getWidth()/2)+zoomControler, (getHeight()/2)+zoomControler);
        image.draw(canvas);
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if(keyCode==KeyEvent.KEYCODE_DPAD_UP)// zoom in
            zoomControler+=10;
        if(keyCode==KeyEvent.KEYCODE_DPAD_DOWN) // zoom out
            zoomControler-=10;
        if(zoomControler<10)
            zoomControler=10;

        invalidate();
        return true;
    }
}

And this code

import android.app.Activity;
import android.os.Bundle;

public class zooming extends Activity {

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle icicle) {
        super.onCreate(icicle);
        setContentView(new Zoom(this));
    }
}

How do I fix this problem?

Answer 1

Try the following code. I think it will work out.

import android.app.Activity;
import android.os.Bundle;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Rect;
import android.view.Display;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;

public class ZoomHelloActivity extends Activity {

    // Physical display width and height.
    private static int displayWidth = 0;
    private static int displayHeight = 0;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Display display = ((WindowManager)
                          getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
        displayWidth = display.getWidth();
        displayHeight = display.getHeight();
        setContentView(new SampleView(this));
    }

    private static class SampleView extends View {
        private static Bitmap bmLargeImage; //bitmap large enough to be scrolled
        private static Rect displayRect = null; //rect we display to
        private Rect scrollRect = null; //rect we scroll over our bitmap with
        private int scrollRectX = 0; //current left location of scroll rect
        private int scrollRectY = 0; //current top location of scroll rect
        private float scrollByX = 0; //x amount to scroll by
        private float scrollByY = 0; //y amount to scroll by
        private float startX = 0; //track x from one ACTION_MOVE to the next
        private float startY = 0; //track y from one ACTION_MOVE to the next

        public SampleView(Context context) {
            super(context);

            // Destination rect for our main canvas draw. It never changes.
            displayRect = new Rect(0, 0, displayWidth, displayHeight);
            // Scroll rect: this will be used to 'scroll around' over the
            // bitmap in memory. Initialize as above.
            scrollRect = new Rect(0, 0, displayWidth, displayHeight);

            // Load a large bitmap into an offscreen area of memory.
            bmLargeImage = BitmapFactory.decodeResource(getResources(),
                    R.drawable.icon);
        }

        @Override
        public boolean onTouchEvent(MotionEvent event) {
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    // Remember our initial down event location.
                    startX = event.getRawX();
                    startY = event.getRawY();
                    break;

                case MotionEvent.ACTION_MOVE:
                    float x = event.getRawX();
                    float y = event.getRawY();
                    // Calculate move update. This will happen many times
                    // during the course of a single movement gesture.
                    scrollByX = x - startX; //move update x increment
                    scrollByY = y - startY; //move update y increment
                    startX = x; //reset initial values to latest
                    startY = y;
                    invalidate(); //force a redraw
                    break;
            }
            return true; //done with this event so consume it
        }

        @Override
        protected void onDraw(Canvas canvas) {
            int newScrollRectX = scrollRectX - (int)scrollByX;
            int newScrollRectY = scrollRectY - (int)scrollByY;

            // Don't scroll off the left or right edges of the bitmap.
            if (newScrollRectX < 0)
                newScrollRectX = 0;
            else if (newScrollRectX > (bmLargeImage.getWidth() - displayWidth))
                newScrollRectX = (bmLargeImage.getWidth() - displayWidth);

            // Don't scroll off the top or bottom edges of the bitmap.
            if (newScrollRectY < 0)
                newScrollRectY = 0;
            else if (newScrollRectY > (bmLargeImage.getHeight() - displayHeight))
                newScrollRectY = (bmLargeImage.getHeight() - displayHeight);

            // We have our updated scroll rect coordinates, set them and draw.
            scrollRect.set(newScrollRectX, newScrollRectY,
                newScrollRectX + displayWidth, newScrollRectY + displayHeight);
            Paint paint = new Paint();
            canvas.drawBitmap(bmLargeImage, scrollRect, displayRect, paint);

            // Reset current scroll coordinates to reflect the latest updates,
            // so we can repeat this update process.
            scrollRectX = newScrollRectX;
            scrollRectY = newScrollRectY;
        }
    }