Android 自定義View手寫簽名並保存圖片

    GIF壓縮有問題，運行很順滑！！！

 

 1.自定義View——支持設置畫筆顏色，畫筆寬度，畫板顏色，清除畫板，檢查是否有簽名，保存畫板圖片（復制粘貼可直接使用）

/**
 * Created by YyyyQ on 2020/3/5.
 * 電子簽名
 */
public class SignatureView extends View {

    private Context context;
    //X軸起點
    private float x;
    //Y軸起點
    private float y;
    //畫筆
    private final Paint paint = new Paint();
    //路徑
    private final Path path = new Path();
    //畫布
    private Canvas canvas;
    //生成的圖片
    private Bitmap bitmap;
    //畫筆的寬度
    private int paintWidth = 10;
    //簽名顏色
    private int paintColor = Color.BLACK;
    //背景顏色
    private int backgroundColor = Color.WHITE;
    //是否已經簽名
    private boolean isTouched = false;

    //簽名開始與結束
    public interface Touch {
        void OnTouch(boolean isTouch);
    }

    private Touch touch;


    public SignatureView(Context context) {
        super(context);
        init(context);
    }

    public SignatureView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public SignatureView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    private void init(Context context) {
        this.context = context;
        //抗鋸齒
        paint.setAntiAlias(true);
        //樣式
        paint.setStyle(Paint.Style.STROKE);
        //畫筆顏色
        paint.setColor(paintColor);
        //畫筆寬度
        paint.setStrokeWidth(paintWidth);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        //創建於view大小一致的bitmap
        bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
        canvas = new Canvas(bitmap);
        canvas.drawColor(backgroundColor);
        isTouched = false;
    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (touch != null) touch.OnTouch(true);
        switch (event.getAction()) {
            //手指按下
            case MotionEvent.ACTION_DOWN:
                touchDwon(event);
                break;
            //手指移動
            case MotionEvent.ACTION_MOVE:
                isTouched = true;
                if (touch != null) touch.OnTouch(false);
                touchMove(event);
                break;
            //手指抬起
            case MotionEvent.ACTION_UP:
                canvas.drawPath(path, paint);
                path.reset();
                break;
        }
        // 更新繪制
        invalidate();
        return true;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //畫此次筆畫之前的簽名
        canvas.drawBitmap(bitmap, 0, 0, paint);
        // 通過畫布繪制多點形成的圖形
        canvas.drawPath(path, paint);
    }


    //手指按下的方法
    private void touchDwon(MotionEvent event) {
        //重置繪制路徑
        path.reset();
        float downX = event.getX();
        float downY = event.getY();
        x = downX;
        y = downY;
        //繪制起點
        path.moveTo(downX, downY);
    }

    //手指滑動的方法
    private void touchMove(MotionEvent event) {
        //當前的x,y坐標點
        final float moveX = event.getX();
        final float moveY = event.getY();
        //之前的x,y坐標點
        final float previousX = x;
        final float previousY = y;
        //獲取絕對值
        final float dx = Math.abs(moveX - previousX);
        final float dy = Math.abs(moveY - previousY);
        if (dx >= 3 || dy >= 3) {
            float cX = (moveX + previousX) / 2;
            float cY = (moveY + previousY) / 2;
            path.quadTo(previousX, previousY, cX, cY);
            x = moveX;
            y = moveY;
        }
    }

    /**
     * 設置畫筆顏色
     *
     * @param paintColor
     */
    public void setPaintColor(int paintColor) {
        this.paintColor = paintColor;
        paint.setColor(paintColor);
    }

    /**
     * 設置畫筆寬度
     *
     * @param paintWidth
     */
    public void setPaintWidth(int paintWidth) {
        this.paintWidth = paintWidth;
        paint.setStrokeWidth(paintWidth);
    }

    /**
     * 設置畫板顏色
     *
     * @param canvasColor
     */
    public void setCanvasColor(int canvasColor) {
        this.backgroundColor = canvasColor;
    }


    /**
     * 清除畫板
     */
    public void clear() {
        if (canvas != null) {
            isTouched = false;
            //更新畫板
            paint.setColor(paintColor);
            paint.setStrokeWidth(paintWidth);
            canvas.drawColor(backgroundColor, PorterDuff.Mode.CLEAR);
            invalidate();
        }
    }

    /**
     * 獲取畫板的Bitmap
     *
     * @return
     */
    public Bitmap getBitmap() {
        setDrawingCacheEnabled(true);
        buildDrawingCache();
        Bitmap bitmap = getDrawingCache();
        setDrawingCacheEnabled(false);
        return bitmap;
    }

    /**
     * 是否有簽名
     *
     * @return
     */
    public Boolean getSigstatus() {
        return isTouched;
    }

    /**
     * 保存畫板
     *
     * @param path 保存到路徑
     */
    @SuppressLint("WrongThread")
    public Boolean save(String path) throws IOException {
        Bitmap bitmap = this.bitmap;
        ByteArrayOutputStream bos = new ByteArrayOutputStream();
        bitmap.compress(Bitmap.CompressFormat.PNG, 100, bos);
        byte[] buffer = bos.toByteArray();
        if (buffer != null) {
            File file = new File(path);
            if (file.exists()) {
                file.delete();
            }
            OutputStream outputStream = new FileOutputStream(file);
            outputStream.write(buffer);
            outputStream.close();
            return true;
        } else {
            return false;
        }
    }


}

 2.xml布局引用自定義View（注意包名）

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!--自定義view的絕對路徑-->
    <com.example.customviewdemo.view.SignatureView
        android:id="@+id/signature"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#fff" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_margin="20dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/clear"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:text="清除" />

        <Button
            android:id="@+id/isSignature"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="10dp"
            android:layout_weight="1"
            android:gravity="center"
            android:text="是否簽名" />

        <Button
            android:id="@+id/save"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="10dp"
            android:layout_weight="1"
            android:gravity="center"
            android:text="保存" />

    </LinearLayout>

</LinearLayout>

 

3.Activity調用

/**
 * Created by YyyyQ on 2020/3/9.
 */
public class SignatureActivity extends AppCompatActivity {


    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_signature);
        SignatureView signatureView = findViewById(R.id.signature);
        //設置畫筆顏色(可以不設置--默認畫筆寬度10,畫筆顏色黑,背景顏色白)
        signatureView.setPaintColor(Color.BLACK);
        signatureView.setPaintWidth(20);
        signatureView.setCanvasColor(Color.WHITE);
        //清除
        Button clear = findViewById(R.id.clear);
        clear.setOnClickListener(view -> {
            signatureView.clear();
            //設置畫筆顏色(可以不設置--默認畫筆寬度10,畫筆顏色黑,背景顏色白)
            signatureView.setPaintColor(Color.BLACK);
            signatureView.setPaintWidth(20);
            signatureView.setCanvasColor(Color.WHITE);
        });
        //是否含有簽名
        Button isSignature = findViewById(R.id.isSignature);
        isSignature.setOnClickListener(view -> {
            if (signatureView.getSigstatus()) {
                Toast.makeText(SignatureActivity.this, "有簽名", Toast.LENGTH_SHORT).show();
            } else {
                Toast.makeText(SignatureActivity.this, "無簽名", Toast.LENGTH_SHORT).show();
            }
        });
        //保存
        Button save = findViewById(R.id.save);
        save.setOnClickListener(view -> {
            try {
                if (signatureView.save("/sdcard/YyyyQ.png")) {
                    Toast.makeText(SignatureActivity.this, "保存成功", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(SignatureActivity.this, "保存失敗", Toast.LENGTH_SHORT).show();
                }

            } catch (IOException e) {
                e.printStackTrace();
            }

        });

    }
}