这个画板可以实现简单的绘图功能,可以设置画笔的颜色,可以设置画刷,演示效果如下图所示

java 设计实现画板类 制作一个简单的画板java_java 设计实现画板类


点击保存按钮后可以将画好的图片保存在本地,并且在本相册中可以看到保存在本地的图片

java 设计实现画板类 制作一个简单的画板java_android_02


实现方式:

第一步:使用Android Studio创建一个android工程,并且在drawable文件夹中放一张图片作为画画板的背景

java 设计实现画板类 制作一个简单的画板java_触摸事件_03


第二步:修改activity_main.xml文件


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <ImageView
        android:id="@+id/iv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/bg" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="红色"
            android:onClick="red" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="绿色"
            android:onClick="green" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="刷子"
            android:onClick="brush" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="保存"
            android:onClick="save" />

    </LinearLayout>

</RelativeLayout>



第三步:修改MainActivity.java文件


package com.fyt.drawingboard;

import java.io.File;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;

import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.os.Environment;
import android.app.Activity;
import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.Bitmap.CompressFormat;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;

public class MainActivity extends Activity {

    private ImageView iv;

    //用于记录触摸点的坐标
    int startX;
    int startY;

    //用于创建画板
    private Canvas canvas;

    //用于创建画笔
    private Paint paint;

    //用于创建图片副本
    private Bitmap bmCopy;

    private File file;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        //加载布局文件
        setContentView(R.layout.activity_main);

        //加载画板的背景图
        Bitmap bmSrc = BitmapFactory.decodeResource(getResources(), R.drawable.bg);

        //创建图片副本,实际上是创建一张白纸
        bmCopy = Bitmap.createBitmap(bmSrc.getWidth(), bmSrc.getHeight(), bmSrc.getConfig());

        //创建画笔
        paint = new Paint();

        //创建一个画板,并且将白纸铺在画板上
        canvas = new Canvas(bmCopy);

        //绘制
        canvas.drawBitmap(bmSrc, new Matrix(), paint);

        //获得布局文件上的ImageView控件
        iv = (ImageView) findViewById(R.id.iv);

        //将图片副本放到ImageView控件中
        //实际上将白纸放到ImageView控件中
        iv.setImageBitmap(bmCopy);

        //设置触摸侦听
        iv.setOnTouchListener(new OnTouchListener() {

            //触摸屏幕时,触摸事件产生时,此方法调用
            @Override
            public boolean onTouch(View v, MotionEvent event) {

                //获得手指触摸屏幕时的动作
                int action = event.getAction();

                switch (action) {

                    //用户的手指刚触摸到屏幕
                    case MotionEvent.ACTION_DOWN:

                        //获得触摸点的坐标
                        startX = (int) event.getX();
                        startY = (int) event.getY();
                        break;

                    //用户的手指在屏幕上滑动
                    case MotionEvent.ACTION_MOVE:

                        //获得触摸点的位置
                        int x = (int) event.getX();
                        int y = (int) event.getY();

                        //绘制直线
                        canvas.drawLine(startX, startY, x, y, paint);

                        //每次绘制完毕之后,本次绘制的结束坐标变成下一次绘制的初始坐标
                        startX = x;
                        startY = y;

                        iv.setImageBitmap(bmCopy);
                        break;

                    //用户手指离开屏幕
                    case MotionEvent.ACTION_UP:
                        break;

                }

                //true:告诉系统,这个触摸事件由我来处理
                //false:告诉系统,这个触摸事件我不处理,这时系统会把触摸事件传递给imageview的父节点
                return true;
            }
        });


    }

    //红色按钮响应函数
    public void red(View v) {

        //设置画笔的颜色为红色
        paint.setColor(Color.RED);
    }

    //绿色按钮响应函数
    public void green(View v) {

        //设置画笔的颜色为绿色
        paint.setColor(Color.GREEN);
    }

    //画刷按钮响应函数
    public void brush(View v) {

        //将画笔变成画刷
        paint.setStrokeWidth(7);
    }

    //保存按钮响应函数
    public void save(View v) {

        //创建File对象,并且将文件的保存路径设置为sdcard/dazuo.png
        file = new File("sdcard/dazuo.png");

        //定义变量用于创建文件输出流对象
        FileOutputStream fos = null;

        try {

            //创建文件输出流对象
            fos = new FileOutputStream(file);
        } catch (FileNotFoundException e) {

            e.printStackTrace();
        }

        //压缩图片
        bmCopy.compress(CompressFormat.PNG, 100, fos);

        //如果Android的版本是4.4或者以上的版本
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
        {
            //扫描SD卡下的图片
            Intent mediaScanIntent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
            Uri contentUri = Uri.fromFile(file);
            mediaScanIntent.setData(contentUri);
            this.sendBroadcast(mediaScanIntent);
        }
        //Android版本在4.4以下
        else
        {
            //发送sd卡就绪广播,用来扫描SD卡下的图片
            Intent intent = new Intent();
            intent.setAction(Intent.ACTION_MEDIA_MOUNTED);
            intent.setData(Uri.fromFile(Environment.getExternalStorageDirectory()));
            sendBroadcast(intent);
        }
    }
}



最后一步:在配置文件中添加几条权限


<!--对SD卡的写权限-->
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

    <!--对SD卡的读取权限-->
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>