Android Study Notes 09: simple application of paint and canvas

In Android, you need to use the graphics class to display 2D images.

Graphics includes canvas, paint, color, bitmap, and other common classes. Graphics supports drawing points, lines, colors, 2D ry, and image processing.

1. Color

There are three commonly used Color Representation Methods in Android:

(1) int color = color. blue;

(2) int color = color. argb (150,200, 0,100 );

(3) define the color in the XML file;

In practical application, we usually use the following colors: their color constants and their colors are as follows:

Color. Black black color. Green

Color. Blue blue color. ltgray light gray

Color. Cyan green color. Magenta red and purple

Color. dkgray gray black color. Red

Color. Yellow yellow color. Transparent transparent

Color. gray color. White white

2. Paint (paint brush) Class

To draw a graph, you must first adjust the paint brush and set the attributes of the paint brush according to your development needs. You can set pain attributes as follows:

Setantialias (); // you can call this operation to set the watermark effect.

Setcolor (); // set the paint brush color

Setargb (); // set the, R, G, and B values of the paint brush.

Setalpha (); // set the Alpha value of the paint brush.

Settextsize (); // set the font size

Setstyle (); // set the paint brush style (hollow or solid)

Setstrokewidth (); // set the width of the hollow border

Getcolor (); // obtain the paint brush color.

3. Canvas class

After setting the paint brush property, you also need to draw the image to the canvas. The canvas class can be used to draw various images, such as straight lines, rectangles, and circles. You can use canvas to draw common images as follows:

Draw a straight line:Canvas. drawline (float startx, float starty, float stopx, float stopy, paint );

Draw a rectangle: canvas. drawrect (float left, float top, float right, float bottom, paint );

Draw a circle: canvas. drawcircle (float CX, float cy, float radius, paint );

Draw characters: canvas. drawtext (string text, float X, float y, paint );

Drawing: canvas. drawbirmap (Bitmap bitmap, float left, float top, paint );

4. Basic Implementation of custom View

First, we need to customize a class, such as myview, which inherits from the View class. Then, rewrite the ondraw () function of the View class. Finally, use the paint and canvas objects in the ondraw () function to draw the image we need.

5. hands-on practice

Here, I have used some of the methods mentioned above to draw a simple Beijing Olympic publicity picture, including the Olympic rings, the "Beijing Welcomes You" publicity slogans, and Fuwa. The result 1 is shown. 

Figure 1 android_olympus logo

The custom myview class is used. In the myview class, the ondraw () function is rewritten and several different brushes are defined, it is used to draw the Olympic rings of various colors and draw the string "Beijing Welcomes You. Specific myview. JavaSource codeAs follows.

Myview. Java source code of android_olympus logo

 1   Package  Com. example. android_olympus mpiclogo;  2   3   Import  Android. View. view;  4  Import  Android. content. context;  5   Import  Android. Graphics. bitmapfactory;  6   Import  Android. Graphics. Canvas;  7   Import  Android. Graphics. color;  8   Import  Android. Graphics. paint;  9   Import Android. Graphics. Paint. style;  10   11   Public   Class Myview Extends  View {  12   13       Public  Myview (context ){  14           Super  (Context );  15   } 16       17       Public   Void  Ondraw (canvas ){  18           19 Paint paint_blue = New Paint (); //  Draw a blue ring  20   Paint_blue.setcolor (color. Blue );  21   Paint_blue.setstyle (style. Stroke );  22 Paint_blue.setstrokewidth (10 );  23 Canvas. drawcircle (110,150, 60 , Paint_blue );  24           25 Paint paint_yellow = New Paint (); //  Draw a yellow ring  26   Paint_yellow.setcolor (color. Yellow );  27   Paint_yellow.setstyle (style. Stroke );  28 Paint_yellow.setstrokewidth (10 );  29 Canvas. drawcircle (( Float ) 175.5, 210, 60 , Paint_yellow );  30           31 Paint paint_black = New Paint (); //  Draw a black ring  32   Paint_black.setcolor (color. Black );  33  Paint_black.setstyle (style. Stroke );  34 Paint_black.setstrokewidth (10 );  35 Canvas. drawcircle (245,150, 60 , Paint_black );  36           37 Paint paint_green = New Paint (); //  Draw a green Ring  38   Paint_green.setcolor (color. Green );  39  Paint_green.setstyle (style. Stroke );  40 Paint_green.setstrokewidth (10 );  41 Canvas. drawcircle (311,210, 60 , Paint_green );  42           43 Paint paint_red = New Paint (); //  Draw a red ring  44   Paint_red.setcolor (color. Red );  45  Paint_red.setstyle (style. Stroke );  46 Paint_red.setstrokewidth (10 );  47 Canvas. drawcircle (380,150, 60 , Paint_red );  48           49 Paint paint_string = New Paint (); //  Draw string  50   Paint_string.setcolor (color. Blue );  51 Paint_string.settextsize (20 );  52 Canvas. Fig ("Welcome to Beijing", 245,310 , Paint_string );  53           54 Paint paint_line = New Paint (); //  Draw a straight line  55   Paint_line.setcolor (color. Blue );  56 Canvas. drawline (240,310,425,310 , Paint_line ); 57           58 Paint paint_text = New Paint (); //  Draw string  59   Paint_text.setcolor (color. Blue );  60 Paint_text.settextsize (20 );  61 Canvas. drawtext ("Beijing Welcomes You", 275,330 , Paint_text );  62           63           // Drawing pictures of Fuwa  64 Canvas. drawbitmap (bitmapfactory. decoderesource (getresources (), R. drawable. Fuwa), 35,340 , Paint_line );  65   }  66 }

In addition, you need to display the custom myview to the mobile phone screen. Therefore, you need to load the myview in mainacitivity. java. You can use the setcontentview () method, the specific mainacitivity. Java sourceCodeAs follows.

Mainactivity. Java source code of android_olympus logo

 1   Package  Com. example. android_olympus mpiclogo; 2   3   Import  Android. OS. Bundle;  4   Import  Android. App. activity;  5   Import  Android. View. Menu;  6   Import  Android. View. menuitem;  7   Import  Android. Support. v4.app. navutils; 8   9   Public   Class Mainactivity Extends  Activity {  10   11   @ Override  12       Public   Void  Oncreate (bundle savedinstancestate ){  13           Super  . Oncreate (savedinstancestate ); 14   //  Setcontentview (R. layout. activity_main );  15 Setcontentview ( New Myview ( This )); //  Load myview  16   }  17   18   @ Override  19       Public  Boolean  Oncreateoptionsmenu (menu ){  20   Getmenuinflater (). Inflate (R. Menu. activity_main, menu );  21           Return   True  ;  22   }  23       24 }

Of course, you also need to put the pictures of Fuwa in the drawable-hdpi directory under Res. In this way, you can use bitmapfactory. decoderesource (getresources (), R. drawable. Fuwa) to load the image.