Android中通过自定义签名控件实现手写签名

小咪咪 2023-10-01 15:34 7阅读 0赞

## 场景 ##

实现手写签名并获取签名照片

![1e5b00084c2149eea476d4e527072ae9.gif][]

注：

博客：  
[BADAO\_LIUMANG\_QIZHI的博客\_霸道流氓气质\_CSDN博客-C\#,SpringBoot,架构之路领域博主][BADAO_LIUMANG_QIZHI_CSDN_-C_SpringBoot]  
关注公众号  
霸道的程序猿  
获取编程相关电子书、教程推送与免费下载。

## 实现 ##

1、新建空白项目，修改其页面布局

![watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA6Zy46YGT5rWB5rCT5rCU6LSo_size_20_color_FFFFFF_t_70_g_se_x_16][]

2、布局文件activity\_main.xml代码

<?xml version="1.0"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
    
        <ImageView
            android:id="@+id/iv_sign"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_marginBottom="3dp"
            android:layout_weight="1"
            android:background="#FFFFFF" />
    
        <FrameLayout
            android:id="@+id/fl_view"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/teal_200" />
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:drawable/bottom_bar"
            android:paddingTop="3dp"
            >
            <Button
                android:id="@+id/btn_ok"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="确定"
                />
            <Button
                android:id="@+id/btn_clear"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="清除"
                />
        </LinearLayout>
    </LinearLayout>

3、修改MainActivity代码

package com.badao.handwrittensignature;
    
    import androidx.appcompat.app.AppCompatActivity;
    import android.content.Context;
    import android.graphics.Bitmap;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.Paint;
    import android.graphics.Path;
    import android.os.Bundle;
    import android.view.MotionEvent;
    import android.view.View;
    import android.widget.Button;
    import android.widget.FrameLayout;
    import android.widget.ImageView;
    import android.widget.Toast;
    
    
    public class MainActivity extends AppCompatActivity {
    
        private ImageView imageSign;
        private SignatureView mView;
    
        @Override public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            imageSign = findViewById(R.id.iv_sign);
            FrameLayout frameLayout = findViewById(R.id.fl_view);
    
            mView = new SignatureView(this);
            frameLayout.addView(mView);
            mView.requestFocus();
    
            Button btnClear = findViewById(R.id.btn_clear);
            btnClear.setOnClickListener((v) -> {
                mView.clear();
            });
    
            Button btnOk = findViewById(R.id.btn_ok);
            btnOk.setOnClickListener((v) -> {
                Bitmap imageBitmap = mView.getCachebBitmap();
                imageSign.setImageBitmap(imageBitmap);
            });
        }
    
        /**
         * 自定义签名控件
         */
        class SignatureView extends View {
    
            //画笔
            private Paint paint;
    
            //画布
            private Canvas cacheCanvas;
    
            //位图
            private Bitmap cachebBitmap;
    
            //图片保存路径
            private Path path;
    
            public Path getPath() {
                return path;
            }
    
            //位图缓存
            public Bitmap getCachebBitmap() {
                return cachebBitmap;
            }
    
            public SignatureView(Context context) {
                super(context);
                init();
            }
    
            /**
             * 初始化
             */
            private void init() {
                //设置画笔
                paint = new Paint();
                paint.setAntiAlias(true);
                paint.setStrokeWidth(3);
                paint.setStyle(Paint.Style.STROKE);
                paint.setColor(Color.BLACK);
                path = new Path();
    
                //创建位图
                cachebBitmap = Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_8888);
    
                //用自定义位图构建画布
                cacheCanvas = new Canvas(cachebBitmap);
                //设置画布为白色
                cacheCanvas.drawColor(Color.WHITE);
            }
    
            /**
             * 清除画板，重置画笔
             */
            public void clear() {
                if (cacheCanvas != null) {
                    paint.setColor(Color.WHITE);
                    cacheCanvas.drawPaint(paint);
                    paint.setColor(Color.BLACK);
                    cacheCanvas.drawColor(Color.BLUE);
                    invalidate();
                }
            }
    
            @Override protected void onDraw(Canvas canvas) {
                canvas.drawBitmap(cachebBitmap, 0, 0, null);
                canvas.drawPath(path, paint);
            }
    
            @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    
                int curW = cachebBitmap != null ? cachebBitmap.getWidth() : 0;
                int curH = cachebBitmap != null ? cachebBitmap.getHeight() : 0;
                if (curW >= w && curH >= h) {
                    return;
                }
    
                if (curW < w) curW = w;
                if (curH < h) curH = h;
                Bitmap newBitmap = Bitmap.createBitmap(curW, curH, Bitmap.Config.ARGB_8888);
                Canvas newCanvas = new Canvas();
                newCanvas.setBitmap(newBitmap);
                if (cachebBitmap != null) {
                    newCanvas.drawBitmap(cachebBitmap, 0, 0, null);
                }
                cachebBitmap = newBitmap;
                cacheCanvas = newCanvas;
            }
            private float cur_x, cur_y;
            @Override public boolean onTouchEvent(MotionEvent event) {
                float x = event.getX();
                float y = event.getY();
                switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN: {
                        cur_x = x;
                        cur_y = y;
                        path.moveTo(cur_x, cur_y);
                        break;
                    }
                    case MotionEvent.ACTION_MOVE: {
                        path.quadTo(cur_x, cur_y, x, y);
                        cur_x = x;
                        cur_y = y;
                        break;
                    }
                    case MotionEvent.ACTION_UP: {
                        cacheCanvas.drawPath(path, paint);
                        path.reset();
                        break;
                    }
                }
                invalidate();
                return true;
            }
        }
    }

[1e5b00084c2149eea476d4e527072ae9.gif]: https://img-blog.csdnimg.cn/1e5b00084c2149eea476d4e527072ae9.gif
[BADAO_LIUMANG_QIZHI_CSDN_-C_SpringBoot]: https://blog.csdn.net/badao_liumang_qizhi
[watermark_type_d3F5LXplbmhlaQ_shadow_50_text_Q1NETiBA6Zy46YGT5rWB5rCT5rCU6LSo_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/4edc17108f0440db86e13f0a09e27974.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6Zy46YGT5rWB5rCT5rCU6LSo,size_20,color_FFFFFF,t_70,g_se,x_16