安卓画板

最新推荐文章于 2025-09-05 16:34:31 发布

最新推荐文章于 2025-09-05 16:34:31 发布 · 209 阅读

文章标签：

#移动开发 #java

学习交流专栏收录该内容

9 篇文章

订阅专栏

安卓的话，目前也是刚刚入门，做了一个简单的画图板。画图板有两种写法，第一种是用imageView来实现画板，但是有一个弊端就是画图的位置有偏移，第二种是自定义一个组件，有点会是位置准确。在学JAVA的时候，我们也做过画图板，安卓的开发并没有多大区别。当然，我们首先要提到的是Bitmap,Canvas,Paint这三个类。
Bitmap:我们可以把它看作是一个画布
Canvas：相当于就是铅笔
Paint ：铅笔头
从它们的关系可以看出，我们想要画出一个图案，在这个过程中，画笔用于决定图案的颜色，然后再在画布上画出来，但仅仅是画出来还不够，我们需要一块屏幕来把图案展现出来
下面重点来介绍一下自定义组件的方法：
1、我们首先需要做的是定义一个自定义组件DrawView，让它继承自View，然后让它来实现View的public DrawView(Context context) { }；public DrawView(Context context, AttributeSet attrs) {}；public DrawView(Context context, AttributeSet attrs, int defStyle) { }这三个构造方法，最后加到布局上去
2、重写onDraw方法，实例化bitmap和canvas
3、在string.xml中可以添加上需要用到的string
4、添加目录，在menu.xml中可以很简便的实现
3、实现onTouchEvent方法，当做出不同动作时会触发不同的反应

package com.exam.fidraw;

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Color;
import android.view.Menu;
import android.view.MenuItem;

public class MainActivity extends Activity {
	public DrawView dv;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		dv = (DrawView) this.findViewById(R.id.drawView1);
		dv.paint.setColor(Color.GREEN);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	public boolean onMenuItemSelected(int featureId, MenuItem item) {
		// super.onMenuItemSelected(featureId, item);
		int id = item.getItemId();
		System.out.println("<<<<<<<<<<<<<<<<<<<<<<<<");
		switch (id) {
		case R.id.color_red:
			dv.paint.setColor(Color.RED);

			System.out.println("<<<<<<<<REDREDREDRED<<<<<<<<<<<<<");
			break;
		case R.id.color_green:
			dv.paint.setColor(Color.GREEN);
			break;
		case R.id.color_blue:
			dv.paint.setColor(Color.BLUE);
			break;
		case R.id.width_1:
			dv.paint.setStrokeWidth(1);
			break;
		case R.id.width_3:
			dv.paint.setStrokeWidth(3);
			break;
		case R.id.width_5:
			dv.paint.setStrokeWidth(5);
			break;
		case R.id.width_7:
			dv.paint.setStrokeWidth(7);
			break;
		case R.id.shape_line:
			dv.shape = "直线";
			break;
		case R.id.shape_oval:
			dv.shape = "椭圆";
			break;
		case R.id.shape_rect:
			dv.shape = "矩形";
			break;
		case R.id.shape_pencil:
			dv.shape = "铅笔";
			break;
		}
		System.out.println("<<<<<<<<<<switchswitch<<<<<<<<<<<<<<");
		return super.onMenuItemSelected(featureId, item);
	}
}

package com.exam.fidraw;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Bitmap.Config;
import android.graphics.Paint.Style;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

public class DrawView extends View {
	private Bitmap bitmap;
	private Canvas canvas;
	public Paint paint;
	public String shape = "直线";
	private float x1, x2, y1, y2;

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

	public DrawView(Context context, AttributeSet attrs) {
		super(context, attrs);
		paint = new Paint();
	}

	public DrawView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	public void onDraw(Canvas canvas) {
		super.onDraw(canvas);

		canvas.drawColor(Color.BLUE);
		// 判断bitmap是否为null
		if (bitmap == null) {
			bitmap = Bitmap.createBitmap(this.getWidth(), this.getHeight(),
					Config.ARGB_8888);
			this.canvas = new Canvas(bitmap);
		}
		// 把图形画在屏幕上
		canvas.drawBitmap(bitmap, 0, 0, paint);
	}

	public boolean onTouchEvent(MotionEvent event) {

		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			x1 = event.getX();
			y1 = event.getY();
			break;
		case MotionEvent.ACTION_UP:
			x2 = event.getX();
			y2 = event.getY();
			if (shape.equals("直线")) {
				canvas.drawLine(x1, y1, x2, y2, paint);
			} else if (shape.equals("椭圆")) {
				canvas.drawOval(new RectF(x1, y1, x2, y2), paint);
			} else if (shape.equals("矩形")) {
				canvas.drawRect(Math.min(x1, x2), Math.min(y1, y2),
						Math.max(x1, x2), Math.max(y1, y2), paint);
			}
			break;
		case MotionEvent.ACTION_MOVE:
			x2 = event.getX();
			y2 = event.getY();
			if (shape.equals("铅笔")) {
				canvas.drawLine(x1, y1, x2, y2, paint);
				x1 = x2;
				y1 = y2;
			}
			break;
		}
		this.invalidate();
		return true;
	}
}

<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" >

    <com.exam.fidraw.DrawView
        android:id="@+id/drawView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">FiDraw</string>
    <string name="action_settings">Settings</string>
    <string name="hello_world">Hello world!</string>
    <string name="color">颜色</string>
    <string name="color_red">红色</string>
    <string name="color_green">绿色</string>
    <string name="color_blue">蓝色</string>
    <string name="shape">形状</string>
    <string name="shape_line">直线</string>
    <string name="shape_pencil">铅笔</string>
    <string name="shape_rect">矩形</string>
    <string name="shape_oval">椭圆</string>
    <string name="width">宽度</string>
    <string name="width_1">加细</string>
    <string name="width_3">细</string>
    <string name="width_5">粗</string>
    <string name="width_7">加粗</string>

</resources>

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:id="@+id/color"
        android:enabled="true"
        android:title="@string/color">
        <menu>
            <group
                android:checkableBehavior="single"
                android:enabled="true"
                android:visible="true" >
                <item
                    android:id="@+id/color_red"
                    android:title="@string/color_red"/>
                <item
                    android:id="@+id/color_green"
                    android:title="@string/color_green"/>
                <item
                    android:id="@+id/color_blue"
                    android:title="@string/color_blue"/>
            </group>
        </menu>
    </item>
    <item
        android:id="@+id/width"
        android:title="@string/width">
        <menu>
            <group
                android:checkableBehavior="single"
                android:enabled="true" >
                <item
                    android:id="@+id/width_1"
                    android:title="@string/width_1"/>
                <item
                    android:id="@+id/width_3"
                    android:title="@string/width_3"/>
                <item
                    android:id="@+id/width_5"
                    android:title="@string/width_5"/>
                <item
                    android:id="@+id/width_7"
                    android:title="@string/width_7"/>
            </group>
        </menu>
    </item>
    <item
        android:id="@+id/shape"
        android:title="@string/shape">
        <menu>
            <group
                android:checkableBehavior="single"
                android:enabled="true" >
                <item
                    android:id="@+id/shape_line"
                    android:title="@string/shape_line"/>
                <item
                    android:id="@+id/shape_pencil"
                    android:title="@string/shape_pencil"/>
                <item
                    android:id="@+id/shape_oval"
                    android:title="@string/shape_oval"/>
                <item
                    android:id="@+id/shape_rect"
                    android:title="@string/shape_rect"/>
            </group>
        </menu>
    </item>
 </menu>