Android 简易签名板

一个简单的练习,手写签名后,可以清空,保存,然后再相册进行查看

Android 简易签名板_第1张图片
简易签名板

有5个知识点,需要注意:

  1. SignatureViewonTouchEvent()方法中,利用mPath.quadTo()方法,使绘制路径变得圆滑
  2. SignatureViewsave()方法中,将View中的内容保存到一个Bitmap
  3. SignatureViewcloseStream()方法中,所有的读写流都实现了Closeable接口,可以用来关闭流
  4. SignatureViewclear()方法中,利用PorterDuff.Mode.CLEARCanvas中绘制的内容清空
  5. MainActivity中,图片保存到本地后,需要向系统发送一个广播,通知相册更新

1. SignatureView 控件

先通过mCanvas利用mPaint将绘制的路径保存进了mBitmap中,再将mBitmapcanvas绘制出来

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手写优化-更为平滑的签名效果实现

共勉 : )

你可能感兴趣的:(Android 简易签名板)