2D drawing with Android.

Question

Hi all Im trying to understand how the Android drawings work.

I hoping that someone can explain how the drawing components relate to each other (View, Drawable, Canvas, Bitmap)

It all seems very confusing and the documentation doesnt do a very good job explaining it.

Does the bitmap inside the Canvas object you get injected in your View's via onDraw() represent the whole display, or just the chunk that the view draws?

What does the drawable do, are they just objects that encapsulate a set of commands to a Canvas object?

Im hoping someone can help me get a basic understanding on how it works, i dont have eny java background only Action script and C# (silverlight).

Answer 1

This is a pretty vague question, but I'll give it a shot. This is my first answer on this site and I am by no means an expert but I have found myself doing a lot of tinkering with drawing in Android.

From what I've read and experienced, each view has a bitmap, which is used to draw the View on the screen. Each view also has a canvas. The canvas is what allows the programmer to control what is drawn onto this bitmap.

Every View object has an onDraw(Canvas c) method which is used to draw it. If you want to draw something yourself, you can create a subclass of the View class by extending View and you can override the onDraw(Canvas c) method to draw whatever you want. You draw onto the view using the Canvas object provided as a parameter to the onDraw() method.

A drawable is simply an object that can be drawn. This could be an still image (bmp, png, jpg,etc), icon, animated gif, etc. A drawable is usually created from an existing image you want to draw onto the screen. This is done in two steps: including the image into your project, then drawing the image.

To include an image into your project you can simply drag it into one of the res/drawable folders in your project directory in Eclipse.

Once the image file is included into your project, the R.java file will be automatically updated with a unique id for that image file. To load the image file as a drawable in your code, you would do something like Drawable d = getResources().getDrawable(R.id.imagefile);. To draw it on the canvas, you could set the size and location using the d.setBounds() method and you could use d.draw(canvas) in your onDraw() method to draw it in your view.

The canvas object provided by the onDraw() method has many useful functions for drawing onto the view. Play around with it, that's the best way you can learn about how to use it. Also, don't forget to check out the Android developer site to see a full listing of all methods.

What exactly are you hoping to do with drawing? If you are trying to make something like a game, you should probably look into using the SurfaceView class.

Here's an example of a custom view class:

public class CustomView extends View{
   public void onDraw(Canvas c){
      c.drawColor(Color.RED);
   }
}

This view, when created, should just draw itself filled with the color red.

Answer 2

The View is the GUI object with which the user interacts. It is associated with a Canvas. You get its dimensions in the onSizeChanged() method (which you will need to override in your custom view) and you draw to its Canvas in its onDraw() method (which, again, you need to override)

The Canvas is the object you use for drawing. The Canvas object draws onto a Bitmap object. The Canvas typically represents the entire screen, and all Views probably share the same Canvas. When onDraw() is called, the Canvas will have had a transformation matrix applied to it, and have had its clipping region set so that your rendering calls will use 0,0 as the upper-left corner of the View and your drawing will be constrained to be within the View.

Note: do not use canvas.getWidth/Height() to get your drawable area from within view.onDraw(); this will return the size of the entire screen, and is not what you want. Use view.onSizeChanged() instead.

You also need a Paint object which is passed to most Canvas drawing methods. The Paint object contains color, font, fill style, and other data that is used for rendering.

A Bitmap is something that can be drawn onto. It's the physical screen or memory that is the foundation of the Canvas. I believe there is a one-to-one correspondence between Canvases and Bitmaps. The canvas.setDevice() method can be used to bind a Canvas to a Bitmap, or the binding can be done in the Canvas' constructor. I don't believe there's a way to retrieve the Bitmap from a Canvas.

A Bitmap can also be used as the source and rendered to a Canvas.

A Drawable object is not something which can be drawn onto (destination), but rather something which is rendered to a Canvas (source). Normally Drawables are taken from your application's resources, but may also be downloaded from the network or retrieved from your gallery, etc.