I have a custom view that extends SurfaceView. I am drawing an image on the canvas. When the user touches a point on the canvas, i want to show a magnified view of the area around the touched co-ordinates. And preferably, as the finger moves around, i would like to update the magnified view's content accordingly.
I was wondering if the android platform supports such a functionality natively. If not, can one of you point me to a good example that can get me started or share ideas on how to implement it. I don't do much 2D or 3D graphics of this sort and am still trying to understand the Canvas and Matrix Classes to see what i can be use.
I searched the forum for a similar question but could not find any. So, pls don't flag me for asking a question that already exists.
And no - i am not using OpenGL-ES or any such 3rd party library (yet).
Thanks All.
To zoom the image you're drawing on the canvas:
Create a BitmapShader (using the bitmap of the image you're drawing), a Matrix and a Paint:
shader = new BitmapShader(bmp, TileMode.CLAMP, TileMode.CLAMP);
matrix = new Matrix();
shaderPaint = new Paint();
shaderPaint.setShader(shader);
On a touch event record the touch position (e.g. in a PointF):
zoomPos.x = event.getX();
zoomPos.y = event.getY();
...and set up the shader's matrix (I do this on each touch, there's probably a better way):
matrix.reset();
matrix.postScale(2f, 2f);
matrix.postTranslate(-zoomPos.x, -zoomPos.y);
shader.setLocalMatrix(matrix);
Then in the drawing code, draw a circle using the shader Paint.
canvas.drawCircle(zoomPos.x, zoomPos.y, size_of_the_circle, shaderPaint);
Edit
The two lines:
matrix.postScale(2f, 2f);
matrix.postTranslate(-zoomPos.x, -zoomPos.y);
Can be replaced with one:
matrix.postScale(2f, 2f, zoomPos.x, zoomPos.y);
This allows the scale factor to be changed without breaking the offset.