Android中Canvas绘图方法的实现

Android中2D图形可以使用Canvas来实现，我们可以通过重写View.onDraw()方法来实现Canvas对象。

常用方法

drawBitmap()	绘制位图
drawCircle()	绘制圆形
drawColor()	绘制填充画布颜色
drawLine()	绘制直线
drawPath()	绘制路径
drawPoint()	绘制点
drawRect()	绘制矩形
drawText()	绘制文字

最终效果

 

创建项目

 

实现代码

MainActivity.java

package com.lujie.canvasdemo;

import android.app.Activity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;

public class MainActivity extends Activity {

private LinearLayout layout;
private Button button_drawLine;
private Button button_drawCircle;
private Button button_drawRect;
private Button button_dark;
private Button button_drawPoint;
private Button button_drawLogo;
private Button button_drawText;
private Button button_autoDraw;

private boolean flag = false;

protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

initUI();
}

private void initUI() {
layout = (LinearLayout) findViewById(R.id.linearLayout_main);
button_drawLine = (Button) findViewById(R.id.button_drawLine);
button_drawCircle = (Button) findViewById(R.id.button_drawCircle);
button_drawRect = (Button) findViewById(R.id.button_drawRect);
button_dark = (Button) findViewById(R.id.button_dark);
button_drawPoint = (Button) findViewById(R.id.button_drawPoint);
button_drawLogo = (Button) findViewById(R.id.button_drawLogo);
button_drawText = (Button) findViewById(R.id.button_drawText);
button_autoDraw = (Button) findViewById(R.id.button_autoDraw);

final MyView view = new MyView(this);
DisplayMetrics display = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(display);
int width = display.widthPixels;

view.setMinimumWidth(width);
view.setMinimumHeight(width);
view.setWidth(width);
layout.addView(view);

button_drawLine.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(1);
view.invalidate();
}
});

button_drawCircle.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(2);
view.invalidate();
}
});

button_drawRect.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(3);
view.invalidate();
}
});

button_dark.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(4);
view.invalidate();
}
});

button_drawPoint.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(5);
view.invalidate();
}
});

button_drawLogo.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(6);
view.invalidate();
}
});

button_drawText.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
view.setDrawType(7);
view.invalidate();
}
});

button_autoDraw.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
if(flag)	view.stopDraw();
else	view.autoDraw();
flag = !flag;
}
});
}
}

 

MyView.java

package com.lujie.canvasdemo;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Rect;
import android.view.View;

public class MyView extends View{

private int width;
private int drawType = -1;
private Thread thread = null;
private boolean flag = false;

public MyView(Context context) {
super(context);
}

public void setWidth(int width) {
this.width = width;
}

public void setDrawType(int drawType) {
this.drawType = drawType;
}

public void autoDraw() {
flag = true;
thread = new Thread() {
public void run() {
for(drawType = 1; flag; drawType++) {
if(drawType > 7) {
drawType = 1;
}
setDrawType(drawType);
postInvalidate();
try {
Thread.sleep(1000);
}catch(InterruptedException e) {
e.printStackTrace();
}
}
}
};
thread.start();
}

public void stopDraw() {
flag = false;
}

protected void onDraw(Canvas canvas) {
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(Color.rgb(255,255,215));
canvas.drawRect(new Rect(0, 0, width, width), paint);

switch(drawType) {
case 1:
paint.setColor(Color.CYAN);
canvas.drawLine(50, 50, 180, 180, paint);
break;
case 2:
paint.setColor(Color.RED);
canvas.drawCircle(width/2, width/2, 50, paint);
break;
case 3:
paint.setColor(Color.rgb(85,99,200));
canvas.drawRect(50, 50, 150, 120, paint);
break;
case 4:
canvas.drawColor(Color.rgb(235,235,195));
break;
case 5:
paint.setColor(Color.rgb(55,55,99));
canvas.drawPoint(50, 50, paint);
canvas.drawPoint(60, 50, paint);
canvas.drawPoint(70, 50, paint);
canvas.drawPoint(80, 50, paint);
canvas.drawPoint(80, 55, paint);
canvas.drawPoint(80, 60, paint);
canvas.drawPoint(80, 65, paint);
canvas.drawPoint(80, 70, paint);
canvas.drawPoint(80, 75, paint);
canvas.drawPoint(90, 50, paint);
canvas.drawPoint(100, 50, paint);
canvas.drawPoint(110, 50, paint);
break;
case 6:
paint.setColor(Color.rgb(208,135,68));
paint.setAntiAlias(true);
float scale = 1.8f;
Path path1 = new Path();
path1.moveTo(120*scale, 30*scale);
path1.lineTo(40*scale, 22*scale);
path1.lineTo(30*scale, 30*scale);
path1.lineTo(40*scale, 38*scale);
path1.close();
canvas.drawPath(path1, paint);
Path path2 = new Path();
path2.moveTo(120*scale, 55*scale);
path2.lineTo(40*scale, 47*scale);
path2.lineTo(30*scale, 55*scale);
path2.lineTo(40*scale, 63*scale);
path2.close();
canvas.drawPath(path2, paint);
Path path3 = new Path();
path3.moveTo(120*scale, 80*scale);
path3.lineTo(40*scale, 72*scale);
path3.lineTo(30*scale, 80*scale);
path3.lineTo(40*scale, 88*scale);
path3.close();
canvas.drawPath(path3, paint);
Path path4 = new Path();
path4.moveTo(35*scale, 20*scale);
path4.lineTo(35*scale, 90*scale);
path4.lineTo(20*scale, 85*scale);
path4.lineTo(20*scale, 25*scale);
path4.close();
canvas.drawPath(path4, paint);
break;
case 7:
paint.setColor(Color.rgb(88, 210, 64));
paint.setTextSize(40);
canvas.drawText("天天开心", 40, width/2, paint);
break;
}
}
}

 

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/linearLayout_main"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.lujie.canvasdemo.MainActivity" >

<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<Button
android:id="@+id/button_drawLine"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#AF6"
android:text="直线" />

<Button
android:id="@+id/button_drawCircle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DFC"
android:text="圆形" />

<Button
android:id="@+id/button_drawRect"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#AF6"
android:text="矩形" />

<Button
android:id="@+id/button_dark"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DFC"
android:text="底色加深" />

</LinearLayout>

<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<Button
android:id="@+id/button_drawPoint"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DFC"
android:text="点" />

<Button
android:id="@+id/button_drawLogo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#AF6"
android:text="图案" />

<Button
android:id="@+id/button_drawText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DFC"
android:text="文字" />

<Button
android:id="@+id/button_autoDraw"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#AF6"
android:text="自动播放" />
</LinearLayout>

</LinearLayout>

 

参考文档

http://www.android-doc.com/reference/android/graphics/Canvas.html