Android实现的写字板（绘画板）
16lz
2021-12-04
Android实现的写字板（绘画板）
前言： 通过Android实现绘画板的功能，能够在应用中进行绘画（写字）操作，完成绘画（写字）后，可以将我们自己绘制的图画（字体）进行保存，同时也能清空画板上的内容，重新开始新的绘制。
效果图如下：
1. 第一步
编写布局文件activity_main.xml
<?xml version="1.0" encoding="utf-8"?><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" tools:context=".MainActivity"> <ImageView android:id="@+id/iv" android:layout_width="1200px" android:layout_height="1500px" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_alignParentStart="true" /> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_gravity="center_horizontal" android:orientation="horizontal" android:id="@+id/linearLayout4"> LinearLayout> <Button android:id="@+id/btn_resume" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_resume" android:layout_alignParentBottom="true" android:layout_alignParentEnd="true" android:layout_marginEnd="79dp"/> <Button android:id="@+id/btn_save" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/btn_save" android:layout_alignBottom="@+id/linearLayout4" android:layout_toEndOf="@+id/linearLayout4" android:layout_marginStart="91dp"/>RelativeLayout>2. 第二步
编写MainActivity.java文件
public class MainActivity extends AppCompatActivity { private ImageView iv; private Bitmap baseBitmap; private Button btn_resume; private Button btn_save; private Canvas canvas; private Paint paint; float radio; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main);// setContentView(new CustomView1(this));// setContentView(new CustomView2(this)); radio = 5; iv = (ImageView) findViewById(R.id.iv); // 初始化一个画笔，笔触宽度为5，颜色为红色 paint = new Paint(); paint.setStrokeWidth(radio); paint.setColor(Color.RED); iv = (ImageView) findViewById(R.id.iv); btn_resume = (Button) findViewById(R.id.btn_resume); btn_save = (Button) findViewById(R.id.btn_save); btn_resume.setOnClickListener(click); btn_save.setOnClickListener(click); iv.setOnTouchListener(touch); } private View.OnTouchListener touch = new View.OnTouchListener() { // 定义手指开始触摸的坐标 float startX; float startY; @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { // 用户按下动作 case MotionEvent.ACTION_DOWN: // 第一次绘图初始化内存图片，指定背景为白色 if (baseBitmap == null) { baseBitmap = Bitmap.createBitmap(iv.getWidth(), iv.getHeight(), Bitmap.Config.ARGB_8888); canvas = new Canvas(baseBitmap); canvas.drawColor(Color.WHITE); } // 记录开始触摸的点的坐标 startX = event.getX(); startY = event.getY(); break; // 用户手指在屏幕上移动的动作 case MotionEvent.ACTION_MOVE: // 记录移动位置的点的坐标 float stopX = event.getX(); float stopY = event.getY(); Thread t =new Thread(new Runnable() { @Override public void run() { radio+=0.1; try { Thread.sleep(1000); } catch (InterruptedException e) { e.printStackTrace(); } } }); t.start(); paint.setStrokeWidth(radio); //根据两点坐标，绘制连线 canvas.drawLine(startX, startY, stopX, stopY, paint); // 更新开始点的位置 startX = event.getX(); startY = event.getY(); // 把图片展示到ImageView中 iv.setImageBitmap(baseBitmap); break; case MotionEvent.ACTION_UP: radio = 5; break; default: break; } return true; } }; private View.OnClickListener click = new View.OnClickListener() { @Override public void onClick(View v) { switch (v.getId()) { case R.id.btn_save: saveBitmap(); break; case R.id.btn_resume: resumeCanvas(); break; default: break; } } }; /** * 保存图片到SD卡上 */ protected void saveBitmap() { try { // 保存图片到SD卡上 String fileName = "/sdcard/"+System.currentTimeMillis() + ".png"; File file = new File(fileName); FileOutputStream stream = new FileOutputStream(file); baseBitmap.compress(Bitmap.CompressFormat.PNG, 100, stream); Toast.makeText(MainActivity.this, "保存图片成功", 1000).show();// // Android设备Gallery应用只会在启动的时候扫描系统文件夹// // 这里模拟一个媒体装载的广播，用于使保存的图片可以在Gallery中查看 Intent intent = new Intent(); intent.setAction(Intent.ACTION_MEDIA_MOUNTED); intent.setData(Uri.fromFile(Environment .getExternalStorageDirectory())); sendBroadcast(intent); } catch (Exception e) { Toast.makeText(MainActivity.this, "保存图片失败", 1000).show(); e.printStackTrace(); } } // 手动清除画板的绘图，重新创建一个画板 protected void resumeCanvas() { if (baseBitmap != null) { baseBitmap = Bitmap.createBitmap(iv.getWidth(), iv.getHeight(), Bitmap.Config.ARGB_8888); canvas = new Canvas(baseBitmap); canvas.drawColor(Color.WHITE); iv.setImageBitmap(baseBitmap); Toast.makeText(MainActivity.this, "清除画板成功，可以重新开始绘图", 1000).show(); } }} /** * 使用内部类 自定义一个简单的View * @author Administrator * */ class CustomView1 extends View { Paint paint; public CustomView1(Context context) { super(context); paint = new Paint(); //设置一个笔刷大小是3的黄色的画笔 paint.setColor(Color.YELLOW);//颜色 paint.setStrokeJoin(Paint.Join.ROUND); paint.setStrokeCap(Paint.Cap.ROUND); paint.setStrokeWidth(3);//画笔大小 } @Override protected void onDraw(Canvas canvas) { //直接将View显示区域用某个颜色填充满 //canvas.drawColor(Color.BLUE); //绘圆 canvas.drawCircle(100, 100, 90, paint); //绘线 paint.setColor(Color.GREEN); paint.setStrokeWidth(10); canvas.drawLine(300,300,400,500,paint); RectF rect = new RectF(100, 100, 300, 300); //绘制弧线区域 paint.setColor(Color.RED); canvas.drawArc(rect, //弧线所使用的矩形区域大小 0, //开始角度 120, //扫过的角度 true, //是否使用中心 paint); //矩形区域内切椭圆 rect = new RectF(500,500,600,700); canvas.drawOval(rect, paint); //绘矩形 paint.setColor(Color.BLUE); rect = new RectF(800,800,1000,1000); canvas.drawRect(rect,paint); //绘圆角矩形 paint.setColor(Color.YELLOW); canvas.drawRoundRect(rect, 50, //x轴的半径 50, //y轴的半径 paint); Path path = new Path(); //定义一条路径 path.moveTo(100, 500); //移动到 坐标10,10 path.lineTo(300, 600); path.lineTo(200,500); path.lineTo(100, 500); canvas.drawPath(path, paint); } } }- 第三步
因为需要把我们绘制的图画保存到本地，所以需要声明一些权限。AndroidManifest.xml文件：
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.newdegree.draw"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity" android:screenOrientation="sensor"> <intent-filter> <action android:name="android.intent.action.MAIN"/> <category android:name="android.intent.category.LAUNCHER"/> intent-filter> activity> application> <uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS"/> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>manifest>总结：这样我们实现了写字板（绘画板）的功能，在我们自己写的程序中，我们可以尽情的绘制图形，练习写字，完成绘制后，可以点击保存，将我们的杰作保存下来。
更多相关文章
- Android(安卓)绘制太极图实例详解
- android 画文字 自动换行
- Android(安卓)OpenGL与3D应用开发之3D图形绘制
- SharedPreferences 数据存储
- Android(安卓)Sharepreferrence 保存数据到手机内存
- Android文件读写，保存数据
- android studio 取消自动保存功能（已解决）
- android中Json数据保存方式
- android练习一之保存用户名