, Canvas.restore;, Camera.restore

Android graphics package contains and classes, both of which allow you to manipulate the “Modelview” transformation matrix, with the latter manipulating your drawing in “3D”.

Basically the ability to manipulate complex, hierarchical transformation is achieved by an(?) internal matrix stack with the top matrix being the current one in effect and the one that you are manipulating. All the transformations you are making on the current matrix are cumulative; so if you were just to manipulate the current matrix, it’s going to be a big pain to draw something like a car or a human figure which conceptually is assembled by different parts. is to push a matrix into the stack; the result is the transformation you’ve made is saved into the stack.  Canvas.restore()/Camera.restore() is to discard the current transformation and go back to the last saved one and continue on it. So if you want to continue with some transformation you made a while ago, you should first save/push it into the stack first so that you can go back to it by restoring/popping it out from the stack. See the following pseudo code for how we go about drawing a drag race car with huge wheels:

//setup/clean up stuff; // remember where we are since we’d like to go back to this original transformation later;
// move the front wheel to front left
// make it twice as big as the normal wheel
// draw front-left wheel in normal size
canvas.restore(); // go back to the identity matrix;
// move the front wheel to front right
// make it twice as big as the normal wheel
// draw front-right wheel in normal size
//… draw body
//… and other wheels…

The pattern is

  • If you want to go back to the current state in terms of transformation, you should remember where you are by calling or;
  • Transform the matrix (via Canvas or Camera methods such as Canvas.translate() and Camera.rotateY();
  • Do drawing;
  • Go back to the transformation state you remember in step 1 by calling Canvas.restore()/Camera.restore() if you want to continue from the transformation you left in step 1;
  • In theory, if you only have one matrix transformation saved in the stack, you can simply push it out by calling Canvas.restore()/Camera.restore() again and again. But in the real world (at least applying for cupcake and donut),  I’ve found I have to keep “saving” before each new transformation and “restoring” after it, even if I was “saving”/”restoring” an identity matrix. So this means you would normally call each time before a new transformation;
  • Transform the matrix;
  • Do drawing;
  • Canvas.restore()/Camera.restore();

To summarize (applying to as well), you repeatedly do the following cycles:

  2. transform matrix;
  3. draw;
  4. canvas.restore();

Note that in android, #2 transformation should be coded before #3 drawing to make the drawing stick to the transformation. If you reverse 2/3, your drawing won’t be affected by the transformations that come after it. This is kinda “counter-intuitive” at least for me since you have always need to set your canvas in position before you paint but not the other way around.

Check out the “Red book” for “Manipulating the Matrix Stacks” to get a better understanding. And here is a sample code showing you how I draw the awesome Batmobile (Spiderman’s car) crawling on a skyscraper (use your imagination for the wall and other details as I am still polishing my drawing skill. Please hold on for the next episode!):


import android.content.Context;
import android.os.Bundle;
import android.view.View;

public class HelloAndroidAgain extends Activity {
/** Called when the activity is first created. */
public void onCreate(Bundle savedInstanceState) {
setContentView(new MyTestView(this));

private static class MyTestView extends View {

public MyTestView(Context context) {
//camera = new Camera();
private Camera camera = new Camera();
protected void onDraw(Canvas canvas){

Paint paint = new Paint();

//front left wheel;
canvas.translate(50f, 50f);//xCtr, yCtr
canvas.drawCircle(0, 0, 30, paint);
canvas.drawText(“FL”, -10, 10, paint);//string

//front right wheel;
canvas.translate(150f, 50f);
canvas.drawCircle(0, 0, 30, paint);
canvas.drawText(“FR”, -10, 10, paint);

//rear left wheel;
canvas.translate(50f, 150f);
canvas.drawCircle(0, 0, 30, paint);
canvas.drawText(“BL”, -10, 10, paint);

//rear right wheel;
canvas.translate(150f, 150f);
canvas.drawCircle(0, 0, 30, paint);
canvas.drawText(“BR”, -10, 10, paint);

canvas.translate(100f, 100f);
canvas.drawRect(-50, -50, 50, 50, paint);

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension(getSuggestedMinimumWidth(), getSuggestedMinimumHeight());



8 Responses to “, Canvas.restore;, Camera.restore”

  1. iuliux Says:

    BatMobile is Batman’s car, not Spiderman’s 🙂

  2. A Bouncing Car! : Android Programming | Have a Cup of Coffee? Says:

    […] functions in Android SDK. I found a relavant page.Canvas class has these functions, so that “canvas.translate()”, […]

  3. Sony Says:

    Thanks for nice post….

  4. NhatNguyen Says:


  5., Canvas.restore;, Camera.restore » 3d Says:

    […], Canvas.restore;, Camera.restore […]

  6. Aditi Says:


  7. Aditi Says:

    I want to show lines on camera, which will help where to place eyes of person while capturing his image. Please help me if anyone having idea..

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: