首页 > 代码库 > 刮刮乐实现效果

刮刮乐实现效果

当我们调整好画笔之后,现在需要绘制到画布上,这就得用Canvas类了。在Android中既然把Canvas当做画布,那么就可以在画布上绘制我们想要的任何东西。除了在画布上绘制之外,还需要设置一些关于画布的属性,比如,画布的颜色、尺寸等。下面来分析Android中Canvas有哪些功能,Canvas提供了如下一些方法:

   Canvas(): 创建一个空的画布,可以使用setBitmap()方法来设置绘制具体的画布。
       Canvas(Bitmap bitmap): 以bitmap对象创建一个画布,则将内容都绘制在bitmap上,因此bitmap不得为null。
       Canvas(GL gl): 在绘制3D效果时使用,与OpenGL相关。
       drawColor: 设置Canvas的背景颜色。
       setBitmap:  设置具体画布。
       clipRect: 设置显示区域,即设置裁剪区。
       isOpaque:检测是否支持透明。
       rotate:  旋转画布
       setViewport:  设置画布中显示窗口。
       skew:  设置偏移量。

一、xml文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

   <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="100dp"
        >
        
        <TextView
            android:id="@+id/textView1"
            android:layout_width="300dp"
            android:layout_height="150dp"
            android:textSize="40dp"
            android:gravity="center_vertical|center_horizontal"
            android:text="谢谢惠顾"
            android:background="@android:color/holo_red_dark"
            />
        
        <com.example.guale.EraseView
        android:id="@+id/eraseView1"
        android:layout_width="300dp"
        android:layout_height="150dp"/>

    </RelativeLayout>
</LinearLayout>
二、EraseView.java

package com.example.guale;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

public class EraseView extends View {
	
	private boolean isMove = false;
	private Bitmap bitmap = null;
	private Bitmap frontBitmap = null;
	private Path path;
	private Canvas mCanvas;
	private Paint paint;
	
	
	public EraseView(Context context, AttributeSet attrs) {
		super(context, attrs);
	}
	@Override
	protected void onDraw(Canvas canvas) {
		
	    if (mCanvas == null) {
		    EraseBitmp();
	    } 
		canvas.drawBitmap(bitmap, 0, 0, null);	
		mCanvas.drawPath(path,paint);//绘制一个路径
		super.onDraw(canvas);
	}
	
	public void EraseBitmp() {
		
		bitmap = Bitmap.createBitmap(getWidth(),getHeight(), Bitmap.Config.ARGB_4444);
		
		frontBitmap = CreateBitmap(Color.GRAY,getWidth(),getHeight());//生产灰色图片

	//设置画笔的样式
		paint = new Paint();
		paint.setStyle(Paint.Style.STROKE);//设置画笔的风格:空心
		paint.setXfermode(new PorterDuffXfermode(Mode.CLEAR));//设置图片交叉时的显示模式
		paint.setAntiAlias(true);//防据齿
		paint.setDither(true);//防抖动
		paint.setStrokeJoin(Paint.Join.ROUND);//设置结合处的样子,ROUND为圆弧
		paint.setStrokeCap(Paint.Cap.ROUND);
		paint.setStrokeWidth(20);//设置描边宽度
		
		path = new Path();

		mCanvas = new Canvas(bitmap);//设置一个带图片的画布
		mCanvas.drawBitmap(frontBitmap, 0, 0,null);
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		
		float ax = event.getX();
		float ay = event.getY();
		
		if (event.getAction() == MotionEvent.ACTION_DOWN) {
			isMove = false;
			path.reset();
			path.moveTo(ax, ay);
			invalidate();
			return true;
		} else if (event.getAction() == MotionEvent.ACTION_MOVE) {
			isMove = true;
			path.lineTo(ax,ay);
			invalidate();
			return true;
		}
		return super.onTouchEvent(event);
	}
	
	public  Bitmap CreateBitmap(int color,int width, int height) {
		int[] rgb = new int [width * height];
		
		for (int i=0;i<rgb.length;i++) {
			rgb[i] = color;
		}
		return Bitmap.createBitmap(rgb, width, height,Config.ARGB_8888);
	}
	
}

三、效果图