Android画板功能 Android编程实现画板功能的方法总结【附源码下载】
Dennis-Android 人气:0本文实例讲述了Android编程实现画板功能的方法。分享给大家供大家参考,具体如下:
Android实现画板主要有2种方式,一种是用自定义View实现,另一种是通过Canvas类实现。当然自定义View内部也是用的Canvas。第一种方式的思路是,创建一个自定义View(推荐SurfaceView),在自定义View里通过Path对象记录手指滑动的路径调用lineTo()
绘制;第二种方式的思路是,先用Canvas绘制一张空的Bitmap,通过ImageView的setImageBitmap()
方法加载这个Bitmap,然后该ImageView实现onTouch()
监听事件,跟踪用户手指的移动调用drawLine()
绘制线条。
我们先来看第一种的实现的方式吧。这里就用SurfaceView来实现,在这里介绍一下关于SurfaceView的知识。SurfaceView继承自View,两者都可以实现绘图功能,那么他们有什么不同呢。先说下Android绘制视图的原理,View通过刷新来绘制视图,Android系统则通过发出VSYNC信号进行屏幕绘制,玩游戏的朋友都应该知道"垂直同步",VSYNC就是垂直同步,谷歌是在4.1之后引入VSYNC的,VSYNC是为了不让画面掉帧。为了不掉帧,View的绘制需要在16ms之内完成。如果执行耗时太长或者需要频繁刷新,那么View就不合适了,影响用户体验和性能。用 SurfaceView就好办了,它内部是在子线程进行页面刷新,使用了双缓冲机制。现在我们来使用它吧。
通常用法是创建一个View继承自SurfaceView,并实现Callback和Runnable接口。
public class MySurfaceView extends SurfaceView implements SurfaceHolder.Callback, Runnable { // SurfaceHolder实例 private SurfaceHolder mSurfaceHolder; // Canvas对象 private Canvas mCanvas; // 控制子线程是否运行 private boolean startDraw; // Path实例 private Path mPath = new Path(); // Paint实例 private Paint mpaint = new Paint(); public MySurfaceView(Context context, AttributeSet attrs) { super(context, attrs); initView(); // 初始化 } private void initView() { mSurfaceHolder = getHolder(); mSurfaceHolder.addCallback(this); // 设置可获得焦点 setFocusable(true); setFocusableInTouchMode(true); // 设置常亮 this.setKeepScreenOn(true); } @Override public void run() { // 如果不停止就一直绘制 while (startDraw) { // 绘制 draw(); } } /* * 创建 */ @Override public void surfaceCreated(SurfaceHolder holder) { startDraw = true; new Thread(this).start(); } /* * 改变 */ @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } /* * 销毁 */ @Override public void surfaceDestroyed(SurfaceHolder holder) { startDraw = false; } private void draw() { try { mCanvas = mSurfaceHolder.lockCanvas(); mCanvas.drawColor(Color.WHITE); mpaint.setStyle(Paint.Style.STROKE); mpaint.setStrokeWidth(DensityUtil.px2dip(getContext(), 30)); mpaint.setColor(Color.BLACK); mCanvas.drawPath(mPath, mpaint); } catch (Exception e) { } finally { // 对画布内容进行提交 if (mCanvas != null) { mSurfaceHolder.unlockCanvasAndPost(mCanvas); } } } @Override public boolean onTouchEvent(MotionEvent event) { int x = (int) event.getX(); //获取手指移动的x坐标 int y = (int) event.getY(); //获取手指移动的y坐标 switch (event.getAction()) { case MotionEvent.ACTION_DOWN: mPath.moveTo(x, y); break; case MotionEvent.ACTION_MOVE: mPath.lineTo(x, y); break; case MotionEvent.ACTION_UP: break; } return true; } // 重置画布 public void reset() { mPath.reset(); } }
我们在构造方法里进行初始化,获得SurfaceHolder实例,添加Callback接口实例,及获得焦点等操作。重写了SurfaceView的三个方法surfaceCreated,surfaceChanged,surfaceDestroyed。在surfaceCreated方法里开启子线程,执行draw方法。在surfaceDestroyed方法里关闭线程。在draw方法里,通过mSurfaceHolder.lockCanvas()
获取Canvas对象,设置样式,颜色等,然后重写onTouchEvent方法,监听用户手指移动,调用mPath.lineTo(x, y)
绘制线条,最后调用mSurfaceHolder.unlockCanvasAndPost(mCanvas)
提交画布内容.这样就完成了画板的绘制。
我在代码里添加了reset()方法,可以重置画布,只需要在MainActivity获取SurfaceView对象,调用SurfaceView.reset()
就可以了。
private Button reset_btn; private MySurfaceView mview; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); context = this; mview = (MySurfaceView) findViewById(R.id.MySurfaceView); reset_btn = (Button) findViewById(R.id.reset_btn); reset_btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { //清除 mview.reset(); } });
现在我们看下第二种方式吧,其实原理和第一种差不太多,我就不赘述了。直接贴上代码吧。
public class SecondActivity extends Activity { private ImageView img; private Bitmap mBitmap; private Canvas canvas; private Paint paint; // 重置按钮 private Button reset_btn; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_second); img = (ImageView) findViewById(R.id.img); reset_btn = (Button) findViewById(R.id.reset_btn); reset_btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { img.setImageBitmap(null); showImage(); } }); // 绘图 showImage(); } private void showImage() { // 创建一张空白图片 mBitmap = Bitmap.createBitmap(720, 1280, Bitmap.Config.ARGB_8888); // 创建一张画布 canvas = new Canvas(mBitmap); // 画布背景为白色 canvas.drawColor(Color.WHITE); // 创建画笔 paint = new Paint(); // 画笔颜色为蓝色 paint.setColor(Color.BLUE); // 宽度5个像素 paint.setStrokeWidth(5); // 先将白色背景画上 canvas.drawBitmap(mBitmap, new Matrix(), paint); img.setImageBitmap(mBitmap); img.setOnTouchListener(new OnTouchListener() { int startX; int startY; @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN: // 获取手按下时的坐标 startX = (int) event.getX(); startY = (int) event.getY(); break; case MotionEvent.ACTION_MOVE: // 获取手移动后的坐标 int endX = (int) event.getX(); int endY = (int) event.getY(); // 在开始和结束坐标间画一条线 canvas.drawLine(startX, startY, endX, endY, paint); // 刷新开始坐标 startX = (int) event.getX(); startY = (int) event.getY(); img.setImageBitmap(mBitmap); break; } return true; } }); } }
有人肯定要问,能不能把绘制的内容保存下来,这当然可以。
加上如下代码就行。
File file = new File(Environment.getExternalStorageDirectory(), System.currentTimeMillis() + ".jpg"); OutputStream stream; try { stream = new FileOutputStream(file); mBitmap.compress(CompressFormat.JPEG, 200, stream); stream.close(); } catch (IOException e) { e.printStackTrace(); }
附:完整实例代码点击此处本站下载。
希望本文所述对大家Android程序设计有所帮助。
加载全部内容