Painting in andriod ---- use of canvas

Reprinted please indicate the source: http://blog.csdn.net/qinjuning

 

 

Because the usage of canvas on the network is more abstract than that of canvas, maybe my logical thinking is not very good, and I always feel that it is more difficult to understand than canvas,

Especially for the use of the SAVE () and restore () methods. The content of this article is to summarize the use of canvas, including its two different uses.

The plot and some of its methods are described.

1BitmapCan be created from resources, files, or programs. The actual function is equivalent to the storage space of images;

2Canvas, Closely connected with bitmap. If bitmap is compared to the content, canvas is a platform that provides many methods to operate bitamp;

3PaintClosely related to canvas. It is a paint tool on the "canvas" and is also used to set the style on the View control;

4DrawableAssume that the first three are drawing in the memory (virtual), drawable is the interface (real) that shows the drawing results of the first three ).

Drawable has multiple child classes, such as bitmapdrawable, shapedrawable, and layerdrawable.

The above is taken from hellogv's "android entry 14th plotting".

 

Let's make a simple example:

Paint is the paint brush.

Bitmap is the canvas.

Canvas is a painter.

 

As a result, painters can draw on the canvas with a paint brush.

 

Two Use Cases of canvas:

 

1. Customize the view and surfaceview to obtain the canvas object.

Because the User-Defined view and surfaceview have obtained the display area in the display interface, the canvas object only performs the interface layout in the display (Painting) area.

After the operation is completed, the canvas operation result is displayed.

 

You can use the following method to draw a custom View:

// The canvas object exists, that is, the default display area @ overridepublic void draw (canvas) exists {// canvas drawing}

Surfaceview's drawing method is as follows:

Surfaceview = new mysurfaceview (); // create a surface object surfaceholder = surfaceview. getholder (); // obtain the surfaceholder object canvas = surfaceholder. lockcanvas (); // obtain the canvas object // draw surfaceholder. unlockcanvasandpost (canvas); // release the canvas lock and display the view

 

2. In other cases, we need to create a canvas object through code and convert the drawing area to a drawable image after the painting is successful.

Or it can be displayed through setbitmap (Bitmap. The general steps are as follows:

// Create a bitmap object Bitmap bitmap = bitmap. createbitmap (200,100, config. argb_8888); // create a canvas object and draw canvas = new canvas (Bitmap); imageview imgview = new imageview (this ); // or other view controls that can set background images // set images for imageview // convert bitmap objects to drawable images; drawable = new bitmapdrawable (Bitmap); imgview. setbackgrounddrawable (drawable); or simply: imgview. setimagebitmap (Bitmap );

Both methods can display our drawing.
 

Canvas method analysis:

 

Clipxxx () method family

Note: crop (CLIP) A new drawing area in the current drawing area, which is the current drawing area of the canvas object.

For example: cliprect (New rect (), the rectangle area is the current drawing area of the canvas.

Public intSave()

Note: The operations between the SAVE () and restore () methods that have been painted by canvas are incorrect, such as roate.

The operations on the canvas (roate and translate) are temporary and do not exist after restore.

Public voidRestore()

Note: Restore the east and west resources saved before the Sava () method.

Drawxxx () method family

Note: The current drawing area is drawn with a certain coordinate value.

Note: The layers will be superimposed, that is, the layers that follow the painting will overwrite the layers of the previous painting.

 

Note the following methods:

Public voidDrawrect(Float left, float top, float right, float bottom, paint)

Note: Draw a rectangle. It must be noted that the number of records for drawing a rectangle is different from the method in Java.

The histogram diagram of this method is as follows:

 

Attention: the X and Y axes in the figure are incorrectly marked. I am too lazy to correct it again.

 

So,Height of the rectangle = bottom-Right

Width and width of the rectangle = right-left

 

PS: if the number of records in the drawrect is incorrect, for example, right <left, Android will not check us or prompt the corresponding error message,

But it will draw a rectangle with a height or a very small width, which may not be what you want.

Public voidTranslate(Float dx, float Dy)

Note: Translation (x, y) pixel units on the current Coordinate

If dx is <0, it is moved up along the X axis; DX> 0 is moved down along the X axis.

If dy is <0, it is moved up along the Y axis. Dy> 0 is moved down along the Y axis.

Public voidRotate(Float degrees)

Note: rotate the image to a certain angle.

PS: from the above, the image is indeed rotated, but I cannot find the rotation center.

 

The demo is provided below. You can change the number of shards and then observe the effect.

 

 

1. layout file main. xkl:Worker uses two imageviews to display bitmap drawing objects. Later, the worker uses a custom View Drawing.

 

<? XML version = "1.0" encoding = "UTF-8"?> <Linearlayout xmlns: Android = "http://schemas.android.com/apk/res/android" Android: Orientation = "vertical" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"> <view Android: layout_width = "fill_parent" Android: layout_height = "2dip" Android: Background = "#800080" Android: layout_margintop = "2dip"> </View> <textview Android: layout_width = "fill_parent" Android: layout_height = "wrap_content" Android: text ="Show the canvas area and use of the clip method"/> <Imageview Android: Id = "@ + ID/imgclip" Android: layout_width = "fill_parent" Android: layout_height = "wrap_content" Android: layout_margintop = "10dip"/> <view Android: layout_width = "fill_parent" Android: layout_height = "2dip" Android: Background = "#800080" Android: layout_margintop = "2dip"> </View> <textview Android: layout_width = "fill_parent" Android: layout_height = "wrap_content" Android: text ="Use of the SAVE and restore methods"/> <Imageview Android: Id = "@ + ID/imgsave" Android: layout_width = "fill_parent" Android: layout_height = "wrap_content" Android: layout_margintop = "10dip"/> <view Android: layout_width = "fill_parent" Android: layout_height = "2dip" Android: Background = "#800080" Android: layout_margintop = "2dip"> </View> <textview Android: layout_width = "fill_parent" Android: layout_height = "wrap_content" Android: text ="Define the view and obtain a canvas object and a drawing area."/> <COM. qin. canvas. myview Android: Id = "@ + ID/myview" Android: layout_width = "fill_parent" Android: layout_height = "200px"/> </linearlayout>

2. define your own view, myview. Java,

Import android. content. context; import android. graphics. bitmap; import android. graphics. bitmapfactory; import android. graphics. canvas; import android. graphics. color; import android. graphics. paint; import android. graphics. typeface; import android. graphics. bitmap. config; import android. util. attributeset; import android. view. view; public class myview extends view {private paint = new paint (); Public myview (Context) {super (context); // todo auto-generated constructor stub} public myview (context, attributeset attrs) {super (context, attrs );} // The canvas object exists, that is, the default display area @ overridepublic void draw (canvas) {// todo auto-generated method stubsuper. draw (canvas); // bold paint. settypeface (typeface. defaultfromstyle (typeface. bold); paint. setcolor (color. blue); canvas. drawtext ("Custom view, canvas object already exists. ", 30, 40, paint); canvas. drawrect (10, 10, 30, 30, paint); // converts an icon image to a bitmap object bitmap iconbit = bitmapfactory. decoderesource (getresources (), R. drawable. icon); canvas. drawbitmap (iconbit, 40, 40, paint );}}

3. Main project file mainactivity. Java

 

Public class mainactivity extends activity {// paint brush object paintprivate paint = new paint (); // remember to set the color for paint; otherwise, private imageview imgclip will not be displayed; // drawing area and clip method private imageview imgsave; // save method and restore/** called when the activity is first created. * // @ override public void oncreate (bundle savedinstancestate) {super. oncreate (savedinstancestate); setcontentview (R. layout. main); imgclip = (imagev Iew) findviewbyid (R. id. imgclip); imgsave = (imageview) findviewbyid (R. id. imgsave); clip_drawcanvas (); // specifies the drawing area and the clip method save_drawcanvas (); // The save method and restore} // in this case, you must create a canvas object, after the bitmap operation is completed on the object, the following two operations are performed on the bitmap object. // 1. Bitmap needs to be converted to drawable object drawable = new bitmapdrawable (Bitmap); // 2. Direct setimagebitmap (Bitmap) Private void clip_drawcanvas () {// convert the icon image to the bitmap object bitmap iconbit = bitmapfactory. decoderesource (getresources (), R. drawable. icon); // create a bitmap object Bitmap bitmap = bitmap. createbitmap (200,150, config. argb_8888); canvas = new canvas (Bitmap); // set the color to display the canvas in the drawing area. drawcolor (color. red); paint. setcolor (color. black); canvas. drawtext ("original drawing area-red part", 60, 50, paint); // draw a bitmap object canvas. drawbitmap (iconbit, 20, 20, paint); // crops an area. The current operation object is rect cropped area rect = new rect (180,120 ); // The current drawing area is the area cropped by rect, instead of the bitmap canvas that we previously assigned. cliprect (rect); canvas. drawcolor (color. yellow); // set the color to display the painting area. setcolor (color. black); canvas. drawtext ("Crop clip-yellow part", 10,100, paint); // converts a bitmap object to a drawable image resource // drawable = new bitmapdrawable (Bitmap ); // IMG. setbackgrounddrawable (drawable); // display, same as imgclip. setimagebitmap (Bitmap);} private void save_drawcanvas () {// convert the icon image to bitmap object bitmap iconbit = bitmapfactory. decoderesource (getresources (), R. drawable. icon); // create a bitmap object Bitmap bitmap = bitmap. createbitmap (200,100, config. argb_8888); canvas = new canvas (Bitmap); paint. setcolor (color. green); paint. settextsize (16); // set the font size canvas. drawrect (10, 10, 50, 8, paint); canvas. drawtext ("I have not rotated", 50, 10, paint); // Save the operations before the canvas, in Sava () operations between and restore do not affect canvas operations before canvas. save (); // rotate the canvas 30 degrees clockwise. rotate (30); canvas. drawcolor (color. red); canvas. drawbitmap (iconbit, 20, 20, paint); canvas. drawrect (50, 10, 80, 50, paint); // canvas. translate (20, 20); canvas. drawtext ("I'm rotating", 115,20, paint); // restore the attributes before save (), and convert the roate (), translate () after the SAVE () method () and the clipxxx () method to clear the canvas. restore (); // translation (20, 20) pixels // canvas. translate (20, 20); canvas. drawrect (80, 10,110, 30, paint); canvas. drawtext ("I have not rotated", 115,20, paint); // converts a bitmap object to a drawable image asset // sets an image for the imageview // imgsave. setimagebitmap (Bitmap); drawable = new bitmapdrawable (Bitmap); imgsave. setbackgrounddrawable (drawable );}}

In general, canvas is more difficult to understand than coding. In particular, it is a headache for you to write the corresponding code.

Understanding thoroughly makes some real gains.

 

Painting in andriod ---- use of canvas