Unable to pan and zoom an image in canvas

Question

I am trying to display an image with canvas that allows zoom and panning but will stop the user from panning the image off screen. I have been able to stop the panning but when the picture is zoomed it stops before the edge of the image. I need to be able to pan to the edge of the image even zoomed in. Any help would be appreciated.

My code that displays image, stops the panning offscreen and zoom:

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.save();

        if (mPosX < displayWidth - mIcon.getIntrinsicWidth()){
            mPosX = displayWidth - mIcon.getIntrinsicWidth();}
        if (mPosX > 0){
            mPosX = 0; }
        if (mPosY < displayHeight - mIcon.getIntrinsicHeight()){
            mPosY = displayHeight - mIcon.getIntrinsicHeight();}
        if (mPosY > 0){
            mPosY = 0; }

        canvas.translate(mPosX, mPosY);
        canvas.scale(mScaleFactor, mScaleFactor);
        mIcon.draw(canvas);
        canvas.restore();
    }

    private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
        @Override
        public boolean onScale(ScaleGestureDetector detector) {
            mScaleFactor *= detector.getScaleFactor();

            // Don't let the object get too small or too large.
            mScaleFactor = Math.max(0.42f, Math.min(mScaleFactor, 5.0f));

            invalidate();
            return true;
        }
    }

Are you reworking code from Google Blog http://android-developers.blogspot.com/2010/06/making-sense-of-multitouch.html ? And, what does clipping mPosX/Y to be <= 0 do? — Walter K, Oct 04 '11 at 20:42
Yes, I am mainly reworking that code. The mPosX/Y > 0 has the image stay in the screen on the top and left image borders. The other mPosX/Y section tries to keep the image in the screen along the right and bottom borders of the image but fails to when zoomed in. — Abel8658, Oct 05 '11 at 12:42

score 0 · Accepted Answer · edited May 23 '17 at 12:12

0

Very similar to this: Zooming in android - keep image in view

edited May 23 '17 at 12:12

Community

1
1

answered Oct 04 '11 at 21:31

Pointer Null

39,597
13
90
111

It is similar. I've tried using Rect, worked great when I panned images, but I was unable to get the image to zoom within it, even using Matrix. Any advice? – Abel8658 Oct 05 '11 at 13:36
2

Matrix.postScale is your friend. To learn the math is now up on you. – Pointer Null Oct 05 '11 at 15:16

Unable to pan and zoom an image in canvas

1 Answers1