Android学习笔记：Paint及Canvas的简单应用_H5之家 - 中国HTML5教程资源分享第一站

Android 学习笔记：Paint 及 Canvas 的简单应用在 Android 中需要通过 graphics 类来显示 2D 图形。 graphics 中包括了 Canvas（画布）、Paint（画笔）、Color（颜色）、 Bitmap（图像）等常用的类。graphics 具有绘制点、线、颜色、2D 几何图形、图像处理等功能。 1.Color（颜色）类 Android

系统中颜色的常用表示方法有以下 3 种：（1）int color = Color.BLUE; （2）int color = Color.argb(150,200,0,100); （3）在 xml 文件中定义颜色；在实际应用当中，我们常用的颜色有以下一些，其颜色常量及其表示的颜色如下所示： Color.BLACK Color.BLUE Color.CYAN Color.DKGRAY Color.YELLOW Color.GRAY 黑色蓝色青绿色灰黑色黄色灰色 Color.GREEN Color.LTGRAY Color.MAGENTA Color.RED 绿色浅灰色红紫色红色透明白色

Color.TRANSPARENT Color.WHITE

2.Paint（画笔）类要绘制图形，首先得调整画笔，按照自己的开发需要设置画笔的相关属性。 Pain 类的常用属性设置方法如下： setAntiAlias(); setColor(); setARGB(); setAlpha(); setTextSize(); setStyle(); setStrokeWidth(); getColor(); //设置画笔的锯齿效果 //设置画笔的颜色 //设置画笔的 A、R、G、B 值 //设置画笔的 Alpha 值 //设置字体的尺寸 //设置画笔的风格（空心或实心） //设置空心边框的宽度 //获取画笔的颜色

3.Canvas（画布）类画笔属性设置好之后，还需要将图像绘制到画布上。Canvas 类可以用来实现各种图形的绘制工作，如绘制直线、矩形、圆等等。Canvas 绘制常用图形的方法如下：绘制直线：canvas.drawLine(float startX, float startY, float stopX, float stopY, Paint paint); 绘制矩形：canvas.drawRect(float left, float top, float right, float bottom, Paint paint); 绘制圆形：canvas.drawCircle(float cx, float cy, float radius, Paint paint); 绘制字符：canvas.drawText(String text, float x, float y, Paint paint); 绘制图形：canvas.drawBirmap(Bitmap bitmap, float left, float top, Paint paint); 4.自定义 View 的基本实现方法首先，我们需要自定义一个类，比如 MyView，继承于 View 类。然后，复写 View 类的 onDraw()函数。最后，在 onDraw()函数中使用 Paint 和 Canvas 对象绘制我们需要的图形。 5.动手实践在这里，我使用上面提到的一些方法，绘制了一幅简单的北京奥运宣传画，包括奥运五环， “北京欢迎您”的宣传标语以及福娃。做成后的效果图如图 1 所示。

图 1 Android_OlympicLogo 效果图其中，使用了自定义的 MyView 类，在 MyView 类中，重写了 onDraw() 函数，并定义几种不同的画笔，分别用来绘制各种颜色的奥运五环以及绘制字符串“北京欢迎您”等。具体的 MyView.java 源代码如下。 1 2 3 4 5 6 package com.example.android_olympiclogo; import import import import android.view.View; android.content.Context; android.graphics.BitmapFactory; 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 context) { 14 super(context); 15 } 16 17 public void onDraw(Canvas canvas) { 18 19 Paint paint_blue = new Paint(); //绘制蓝色的环 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(); //绘制黄色的环 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(); //绘制黑色的环 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(); //绘制绿色的环 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(); //绘制红色的环 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(); //绘制字符串 50 paint_string.setColor(Color.BLUE); 51 paint_string.setTextSize(20); 52 canvas.drawText("Welcome to Beijing", 245, 310, paint_string); 53 54 Paint paint_line = new Paint(); //绘制直线 55 paint_line.setColor(Color.BLUE); 56 canvas.drawLine(240, 310, 425, 310, paint_line); 57 58 Paint paint_text = new Paint(); //绘制字符串 59 paint_text.setColor(Color.BLUE); 60 paint_text.setTextSize(20); 61 canvas.drawText("北京欢迎您", 275, 330, paint_text); 62 63 //绘制福娃图片 64 canvas.drawBitmap(BitmapFactory.decodeResource(getResources(),R.drawa ble.fuwa), 35, 340, paint_line); 65 } 66 } 此外，还需要将自定义的 MyView 视图显示到手机屏幕上，所以需要在 MainAcitivity.java 中加载 MyView 视图，可以使用 setContentView()方法，具体的 MainAcitivity.java 源代码如下。 1 package com.example.android_olympiclogo; 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)); //加载 MyView 16 } 17 18 @Override 19 public boolean onCreateOptionsMenu(Menu menu) { 20 getMenuInflater().inflate(R.menu.activity_main, menu); 21 return true; 22 } 23 24 } 当然了，还需要将福娃的图片放在 res 下的 drawable-hdpi 目录下。这样才可以 Bitmap Factory. Decode Resource (getResources () , R. drawable. fuwa) 方法加载该图片。