How to zoom whole activity on multi touch?

Question

Problem:

It\'s easy to zoom images and web views. But I want to zoom a whole activity. How can I do this?

Here, I provide wire-frame:

Answer 1

You can simulate zooming in and out by scaling the root activity view. Here's some starter code:

View v = findViewById(android.R.id.content); // get reference to root activity view
v.setOnClickListener(new OnClickListener() {
    float zoomFactor = 1.5f;
    boolean zoomedOut = false;

    @Override
    public void onClick(View v) {
        if(zoomedOut) { 
            // now zoom in
            v.setScaleX(1);
            v.setScaleY(1);
            zoomedOut = false;
        }
        else {
            v.setScaleX(zoomFactor);
            v.setScaleY(zoomFactor);
            zoomedOut = true;
        }
    }
});

Note, the activity will zoom on single clicks as opposed to zooming upon double tap. Also, you probably want to animate the zooming. Look up Property Animation for details how to accomplish this.

[EDIT] For older API levels, you can use ScaleAnimation. You can also set the duration of the animation. However, a major caveat is that it only modifies the look of the view, but the actual view doesn't change.

if(zoomedOut) { // zoom in
    ScaleAnimation anim = new ScaleAnimation(1f, 1.5f, 1f, 1.5f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    anim.setDuration(500);
    anim.setFillAfter(true);
    v.startAnimation(anim);
    zoomedOut = false;
}
else {
    ScaleAnimation anim = new ScaleAnimation(1.5f, 1f, 1.5f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    anim.setDuration(500);
    anim.setFillAfter(true);
    v.startAnimation(anim);
    zoomedOut = true;

Answer 2

You can use setScaleX and setScaleY to zoom the complete activity view.

Then you need to set the pivot point with setPivotX and setPivotY.

The good examples with details for the whole activity zoom with multitouch:

1) MultiTouch for whole activity.

2) Zooming view completely.