一个简单的练习,手写签名后,可以清空,保存,然后再相册进行查看
有5个知识点,需要注意:
- 在
SignatureView
的onTouchEvent()
方法中,利用mPath.quadTo()
方法,使绘制路径变得圆滑 - 在
SignatureView
的save()
方法中,将View
中的内容保存到一个Bitmap
中 - 在
SignatureView
的closeStream()
方法中,所有的读写流都实现了Closeable
接口,可以用来关闭流 - 在
SignatureView
的clear()
方法中,利用PorterDuff.Mode.CLEAR
将Canvas
中绘制的内容清空 - 在
MainActivity
中,图片保存到本地后,需要向系统发送一个广播,通知相册更新
1. SignatureView 控件
先通过mCanvas
利用mPaint
将绘制的路径保存进了mBitmap
中,再将mBitmap
在canvas
绘制出来
public class SignatureView extends View {
private Paint mPaint;
private Path mPath;
private Canvas mCanvas;
private Bitmap mBitmap;
private float mLastX, mLastY;//上次的坐标
public SignatureView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
/***
* 初始化
*/
private void init() {
//关闭硬件加速
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
//画笔
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);
mPaint.setStrokeWidth(5f);
mPaint.setColor(Color.parseColor("#FF4081"));
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);//使画笔更加圆润
mPaint.setStrokeCap(Paint.Cap.ROUND);//同上
//路径
mPath = new Path();
//保存签名的画布
post(new Runnable() {//拿到控件的宽和高
@Override
public void run() {
mBitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
});
}
/**
* 绘制
*/
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (mBitmap != null) {
canvas.drawColor(Color.WHITE);//绘制背景白色
drawSignaturePath(); //将路径绘制在mBitmap上
canvas.drawBitmap(mBitmap, 0, 0, null);//将mBitmap绘制在canvas上
}
}
/**
* 清空绘制内容
*/
public void clear() {
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
mCanvas.drawPaint(mPaint);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
mPath.reset();
invalidate();
}
/**
* 保存到指定的文件夹中
*/
public boolean save(String filePath) {
if (mBitmap != null && mLastY != 0f) {//没有绘制,就不保存
//从View中得到Bitmap
setDrawingCacheEnabled(true);
buildDrawingCache(true);
Bitmap bitmap = getDrawingCache(true);
//保存图片
File file = new File(filePath);
FileOutputStream fileOutputStream = null;
try {
fileOutputStream = new FileOutputStream(file);
if (bitmap.compress(Bitmap.CompressFormat.PNG, 100, fileOutputStream)) {
fileOutputStream.flush();
return true;
}
} catch (java.io.IOException e) {
e.printStackTrace();
} finally {
closeStream(fileOutputStream);
}
}
return false;
}
/**
* 关闭流
*/
private void closeStream(Closeable closeable) {
if (closeable != null) {
try {
closeable.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
/**
* 绘制签名
*/
private void drawSignaturePath() {
mCanvas.drawPath(mPath, mPaint);
}
/**
* 触摸事件 触摸绘制
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getAction();
float x = event.getX();
float y = event.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:
mLastX = x;
mLastY = y;
mPath.moveTo(mLastX, mLastY);
break;
case MotionEvent.ACTION_MOVE:
float dx = Math.abs(x - mLastX);
float dy = Math.abs(y - mLastY);
if (dx >= 3 || dy >= 3) {//绘制的最小距离 3px
//利用二阶贝塞尔曲线,使绘制路径更加圆滑
mPath.quadTo(mLastX, mLastY, (mLastX + x) / 2, (mLastY + y) / 2);
}
mLastX = x;
mLastY = y;
break;
case MotionEvent.ACTION_UP:
mPath.reset();
break;
}
invalidate();
return true;
}
/**
* 测量
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int wSpecMode = MeasureSpec.getMode(widthMeasureSpec);
int wSpecSize = MeasureSpec.getSize(widthMeasureSpec);
int hSpecMode = MeasureSpec.getMode(heightMeasureSpec);
int hSpecSize = MeasureSpec.getSize(heightMeasureSpec);
if (wSpecMode == MeasureSpec.EXACTLY && hSpecMode == MeasureSpec.EXACTLY) {
setMeasuredDimension(widthMeasureSpec, heightMeasureSpec);
} else if (wSpecMode == MeasureSpec.AT_MOST) {
setMeasuredDimension(200, hSpecSize);
} else if (hSpecMode == MeasureSpec.AT_MOST) {
setMeasuredDimension(wSpecSize, 200);
}
}
}
关键的地方都有注释
2.Activity 代码
在图片保存成功后,将图片的路径信息利用用广播发送给系统,通知相册更新
public class MainActivity extends AppCompatActivity {
private Button bt_clear,bt_save;
private SignatureView sv;
private final String APP_DIR = "com.signature.view";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
}
/**
* 初始化
*/
private void init() {
final String dir = Environment.getExternalStorageDirectory().getAbsolutePath()+ File.separator+APP_DIR+File.separator;
final File fileDir = new File(dir);
if (!fileDir.exists()){
fileDir.mkdirs();
}
bt_clear = (Button) findViewById(R.id.bt_clear_main_activity);
sv = (SignatureView) findViewById(R.id.sv_main_activity);
bt_clear.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
sv.clear();
}
});
bt_save = (Button) findViewById(R.id.bt_save_main_activity);
bt_save.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
save(fileDir);
}
});
}
/**
* 保存图片
*/
private void save(File fileDir) {
final String filePath = getFilePath(fileDir);
if (sv.save(filePath)){//保存成功
//发送广播 通知系统相册更新
Intent intent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
Uri uri = Uri.fromFile(new File(filePath));
intent.setData(uri);
sendBroadcast(intent);
Toast.makeText(MainActivity.this, "保存成功!!!", Toast.LENGTH_SHORT).show();
}
}
/**
* 得到图片的路径 以及图片的名字
*/
private String getFilePath(File fileDir) {
SimpleDateFormat simpleDateFormat = (SimpleDateFormat) DateFormat.getDateTimeInstance();
final String fileName = simpleDateFormat.format(new Date())+".png";
Log.e("filename","---"+fileName);
File file = new File(fileDir,fileName);
return file.getAbsolutePath();
}
}
DateFormat.getDateTimeInstance()
这个方法很方便的拿到手机设置的时间显示格式
布局文件:
布局很简陋
3. 最后
主要是练习一下,复习最近一段学习到的一些知识
有一个非常牛的签名板,可以学习一下张明云大神的Android手写优化-更为平滑的签名效果实现
共勉 : )