android pinch zoom

Question

My layout contains buttons, textviews, etc. Is it possible to implement pinch zoom in my layout?

score 44 · Accepted Answer · edited Aug 12 '20 at 16:42

44

Updated Answer

Code can be found here : official-doc

Answer Outdated

Check out the following links which may help you

Best examples are provided in the below links, which you can refactor to meet your requirements.

edited Aug 12 '20 at 16:42

Maifee Ul Asad

1,912
2
14
40

answered Mar 21 '11 at 10:04

Vinayak Bevinakatti

38,839
25
103
135

17

This answer will be worthless, once the links go down. At least quote the relevant parts. – Lukas Knuth Dec 10 '15 at 08:29
4

FYI, this answer is out-of-date. [ScaleGestureDetector](https://developer.android.com/reference/android/view/ScaleGestureDetector.html) is Android's answer for pinch-zoom, since API 8. See [Emanuel's answer](http://stackoverflow.com/a/11722858/199364). – ToolmakerSteve Oct 20 '16 at 17:08

score 38 · Answer 2 · answered Jul 30 '12 at 13:45

For android 2.2+ (api level8), you can use ScaleGestureDetector.

you need a member:

private ScaleGestureDetector mScaleDetector;

in your constructor (or onCreate()) you add:

mScaleDetector = new ScaleGestureDetector(context, new OnScaleGestureListener() {
    @Override
    public void onScaleEnd(ScaleGestureDetector detector) {
    }
    @Override
    public boolean onScaleBegin(ScaleGestureDetector detector) {
        return true;
    }
    @Override
    public boolean onScale(ScaleGestureDetector detector) {
        Log.d(LOG_KEY, "zoom ongoing, scale: " + detector.getScaleFactor());
        return false;
    }
});

You override onTouchEvent:

@Override
public boolean onTouchEvent(MotionEvent event) {
    mScaleDetector.onTouchEvent(event);
    return true;
}

If you draw your View by hand, in the onScale() you probably do store the scale factor in a member, then call invalidate() and use the scale factor when drawing in your onDraw(). Otherwise you can directly modify font sizes or things like that in the onScale().

Additional information in [Android docs - Dragging and Scaling](https://developer.android.com/training/gestures/scale.html) Especially note example code showing how to combine panning (scrolling) with scaling (pinch zoom). — ToolmakerSteve, Oct 20 '16 at 17:12

score 16 · Answer 3 · edited Apr 03 '13 at 19:31

I implemented a pinch zoom for my TextView, using this tutorial. The resulting code is this:

private GestureDetector gestureDetector;
private View.OnTouchListener gestureListener;

and in onCreate():

    // Zoom handlers
    gestureDetector = new GestureDetector(new MyGestureDetector());
    gestureListener = new View.OnTouchListener() {

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

        static final int MIN_FONT_SIZE = 10;
        static final int MAX_FONT_SIZE = 50;

        float oldDist = 1f;

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            TextView textView = (TextView) findViewById(R.id.text);

            switch (event.getAction() & MotionEvent.ACTION_MASK) {
                case MotionEvent.ACTION_POINTER_DOWN:
                    oldDist = spacing(event);
                    Log.d(TAG, "oldDist=" + oldDist);
                    if (oldDist > 10f) {
                       mode = ZOOM;
                       Log.d(TAG, "mode=ZOOM" );
                    }
                    break;
                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == ZOOM) {
                        float newDist = spacing(event);
                        // If you want to tweak font scaling, this is the place to go.
                        if (newDist > 10f) {
                            float scale = newDist / oldDist;

                            if (scale > 1) {
                                scale = 1.1f;
                            } else if (scale < 1) {
                                scale = 0.95f;
                            }

                            float currentSize = textView.getTextSize() * scale;
                            if ((currentSize < MAX_FONT_SIZE && currentSize > MIN_FONT_SIZE)
                                    ||(currentSize >= MAX_FONT_SIZE && scale < 1)
                                    || (currentSize <= MIN_FONT_SIZE && scale > 1)) {
                                textView.setTextSize(TypedValue.COMPLEX_UNIT_PX, currentSize);
                            }
                        }
                    }
                    break;
                }
            return false;
        }

Magic constants 1.1 and 0.95 were chosen empirically (using scale variable for this purpose made my TextView behave kind of weird).

@Renanlf That was more than a year ago. Sorry, I don't even code for android anymore. Nor do I have those sources anywhere. — folone, Aug 28 '12 at 14:09
`MyGestureDetector()` is not relevant here; because of the declaration `GestureDetector(GestureDetector.OnGestureListener listener)` we conclude that it's a misnomer child of `GestureDetector.OnGestureListener`. And the events detected by that class are irrelevant for pinch zooming. — 18446744073709551615, Dec 12 '12 at 13:25
switch (event.getAction() & MotionEvent.ACTION_MASK), in this line of the code: ACTION_MASK turns 255 (ff) so what is the point of adding Motion.ACTION_MASK? Will switch (event.getAction()) be enough, if not why? Could you please explain it. — answer88, Mar 24 '14 at 06:34
@folone Could you help me in [this](http://stackoverflow.com/questions/23187772/how-to-pass-pinch-zoom-event-from-a-viewgroup-to-multiple-child-views) question. This question is similar to what I am facing — user3265443, Apr 20 '14 at 21:40
The code does not seeem to work. `MyGestureDetector` is not defined, and so are other things in the code, like `spacing`, `TAG`, ...) — Alex, Dec 16 '16 at 10:33

score 5 · Answer 4 · answered Feb 25 '13 at 15:52

5

There is also this project that does the job and worked perfectly for me: https://github.com/chrisbanes/PhotoView

answered Feb 25 '13 at 15:52

BoD

10,222
6
60
57

score 4 · Answer 5 · answered Mar 24 '11 at 10:20

4

In honeycomb, API level 11, it is possible, We can use setScalaX and setScaleY with pivot point
I have explained it here
Zooming a view completely
Pinch Zoom to view completely

answered Mar 24 '11 at 10:20

Labeeb Panampullan

32,561
26
89
111

score 1 · Answer 6 · answered Mar 10 '12 at 01:59

1

I have created a project for basic pinch-zoom that supports Android 2.1+

Available here

answered Mar 10 '12 at 01:59

Jason Polites

4,967
2
21
22

score 0 · Answer 7 · answered Apr 24 '18 at 12:40

I have an open source library that does this very well. It's a four gesture library that comes with an out-of-the-box pan zoom setting. You can find it here: https://bitbucket.org/warwick/hacergestov3 Or you can download the demo app here: https://play.google.com/store/apps/details?id=com.WarwickWestonWright.HacerGestoV3Demo This is a pure canvas library so it can be used in pretty any scenario. Hope this helps.

android pinch zoom

7 Answers7

Linked