前语
在复习自定义View时,想着将手指划动的轨道与实际功用需求结合起来做一个程序,在思考后感觉日子中比较贴合这个功用的可能是写字板或许画板了。其中写字板相对简略只需记录手指轨道并显示即可,写字板另一个可能是,将写好的字保存为图片上传。至此功用大体确定,下面是程序的运行图:
功用分析
写字板功用可简略总结为三点
1.制作划动轨道
2.清空写字板
3.写字板内容保存为图片
代码完成
写字板全体功用不太杂乱,功用根本在一个自定义View里面,后面会给出View的完好代码
制作划动轨道
制作手指轨道是重写了onTouchEvent函数,在该函数内对手指按下和移动分别做处理,在手指按下时运用moveTo(),在手指移动时运用lineTo(),并在函数结尾运用postInvalidate()办法,来触发onDraw()办法。
清空写字板
清空写字板是点击清空面板按钮,会调用自定义办法的clearTablet()办法,在该办法内,重置途径,对保存图片的bitmap重新赋值。
/** 清空面板 */
public void clearTablet(){
mPath.reset();
mBitmap = Bitmap.createBitmap(viewWidth,viewHeight,Bitmap.Config.ARGB_8888);
mBitmapCanvas = new Canvas(mBitmap);
postInvalidate();
}
写字板内容保存为图片
将写字板内容保存为图片则需要声明mBitmap和mBitmapCanvas这两个变量,之后在onSizeChanged()函数内对这个两个变量初始化,onSizeChanged()函数是View大小改动时触发这个办法,初始化代码如下:
mBitmap = Bitmap.createBitmap(viewWidth,viewHeight,Bitmap.Config.ARGB_8888);
mBitmapCanvas = new Canvas(mBitmap);
mBitmapCanvas基于mBitmap生成的画布,这样mBitmapCanvas画布上的操作就作用到mBitmap上,在mBitmapCanvas上制作途径,之后根据mBitmap生成图片文件就完成了保存写字板内容。 完好的View代码如下:
public class TabletView extends View {
private Paint mPaint;
private Path mPath;
private Bitmap mBitmap;
private Canvas mBitmapCanvas;
private int viewWidth,viewHeight;
public TabletView(Context context) {
super(context);
init();
}
public TabletView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public TabletView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
mPaint = new Paint();
mPaint.setColor(Color.BLACK);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeWidth(5);
mPath = new Path();
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
//获取View宽高
viewWidth = w;
viewHeight = h;
mBitmap = Bitmap.createBitmap(viewWidth,viewHeight,Bitmap.Config.ARGB_8888);
mBitmapCanvas = new Canvas(mBitmap);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawPath(mPath, mPaint);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
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:
mBitmapCanvas.drawPath(mPath,mPaint);
break;
}
postInvalidate();
return true;
}
/** 清空面板 */
public void clearTablet(){
mPath.reset();
mBitmap = Bitmap.createBitmap(viewWidth,viewHeight,Bitmap.Config.ARGB_8888);
mBitmapCanvas = new Canvas(mBitmap);
postInvalidate();
}
public void saveToFile(String filePath){
FileOutputStream fos = null;
try {
fos = new FileOutputStream(filePath);
mBitmap.compress(Bitmap.CompressFormat.PNG,100,fos);
fos.flush();
}catch (Exception e){
e.printStackTrace();
}finally {
if (fos!=null){
try {
fos.close();
}catch (IOException e){
e.printStackTrace();
}
}
}
}
}
如果在AndroidStudio的Device File Explarer能够看到图片保存的位置,如果有上传图片需求可根据文件途径获取文件,文件地址截图如下:
总结
写字板全体功用不太杂乱,目前想不到扩展功用,大佬们有什么主意能够留言告诉我,我看看能不能完成。
项目地址: GitHub