viewAndroid

Android白板签名

2022-06-15  本文已影响0人  Poison丶Carson

在开发的动作当中,有时候会遇到一些问题,尤其是电商或者银行类型的项目,会经常性的要求用户进行一个签名并进行上传,有的时候会要求签名并保存到本地。这个就涉及到了一个自定义view的过程了,其中我们要注意的是用户手势的问题,在按下、移动和放开的时候做不同的动作

public boolean onTouchEvent(MotionEvent event) {
    if (touch != null) touch.OnTouch(true);
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            touchDown(event);
            break;
        case MotionEvent.ACTION_MOVE:
            isTouched = true;
            if (touch != null) touch.OnTouch(false);
            touchMove(event);
            break;
        case MotionEvent.ACTION_UP:
            //将路径画到bitmap中,即一次笔画完成才去更新bitmap,而手势轨迹是实时显示在画板上的。
            cacheCanvas.drawPath(mPath, mGesturePaint);
            mPath.reset();
            break;
    }
    // 更新绘制
    invalidate();
    return true;
}

touchDown --- 手指点下屏幕时调用

private void touchDown(MotionEvent event) {
    // 重置绘制路线
    mPath.reset();
    float x = event.getX();
    float y = event.getY();
    mX = x;
    mY = y;
    // mPath绘制的绘制起点
    mPath.moveTo(x, y);
}

touchMove --- 手指在屏幕上滑动时调用

private void touchMove(MotionEvent event) {
    final float x = event.getX();
    final float y = event.getY();
    final float previousX = mX;
    final float previousY = mY;
    final float dx = Math.abs(x - previousX);
    final float dy = Math.abs(y - previousY);
    // 两点之间的距离大于等于3时,生成贝塞尔绘制曲线
    if (dx >= 3 || dy >= 3) {
        // 设置贝塞尔曲线的操作点为起点和终点的一半
        float cX = (x + previousX) / 2;
        float cY = (y + previousY) / 2;
        // 二次贝塞尔,实现平滑曲线;previousX, previousY为操作点,cX, cY为终点
        mPath.quadTo(previousX, previousY, cX, cY);
        // 第二次执行时,第一次结束调用的坐标值将作为第二次调用的初始坐标值
        mX = x;
        mY = y;
    }
}

清除画板

public void clear() {
    if (cacheCanvas != null) {
        isTouched = false;
        //更新画板信息
        mGesturePaint.setColor(mPenColor);
        cacheCanvas.drawColor(mBackColor, PorterDuff.Mode.CLEAR);
        mGesturePaint.setColor(mPenColor);
        invalidate();
    }
}

自定义完成后其实在布局当中就是比较简单的了,直接引用就可以了

<com.carson.undergo.utils.view.LinePathView
    android:id="@+id/line_name"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="@color/colorWhite" />
画板展示

当一切就绪后就只是在我们需要使用的地方进行调用就可以了,当然最好是对画板进行一个初始化并将画板清空,这里就相当于是点击下面的清空按钮,对画板进行了清空的操作

binding.lineName.setBackColor(Color.WHITE)
binding.lineName.setPaintWidth(20)
binding.lineName.setPenColor(Color.BLACK)
binding.lineName.clear()

在后面的操作当中,我们可能需要将画板总的图片进行上传到服务器或者保存下来,在这之前就需要就需要获取到画板当中的bitMap了,这里直接贴上方法

/**
 * 获取view生成bitmap
 */
private fun createBitMapForView(view: View): Bitmap? {
    view.measure(
        View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED),
        View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED)
    )
    val width = view.width
    val height = view.height
    view.layout(0, 0, width, height)
    val bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.RGB_565)
    val canvas = Canvas(bitmap)
    view.draw(canvas)
    canvas.save()
    return bitmap
}

最后一定不要忘记了添加存储权限,毕竟我们的图片最终是保存到本地的嘛~

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission
    android:name="android.permission.WRITE_EXTERNAL_STORAGE"
    tools:ignore="ScopedStorage" />

虽然在manifest里面添加了读写权限,但是在Android的高版本上可能还是会保存失败,这个时候我们就需要进行动态的权限申请了,动态申请的方法有很多,可以自行发挥,嘿嘿


申请权限

最后在获取到权限之后再进行保存就完成了~

XXPermissions.with(mContext)
    .permission(Permission.READ_EXTERNAL_STORAGE, Permission.WRITE_EXTERNAL_STORAGE)
    .request(object : OnPermissionCallback {
        override fun onGranted(permissions: MutableList<String>?, all: Boolean) {
            if (all) {
                ImageUtils.saveImageToGallery(mContext, bitmap)
                binding.lineName.destroyDrawingCache()
            } else {
                ToastUtils.showMessage(mContext, "没有读写权限无法保存图片哦~")
            }
        }
        override fun onDenied(permissions: MutableList<String>?, never: Boolean) {
            if (never) {
                ToastUtils.showMessage(mContext, "被永久拒绝授权,请手动授予读写权限");
                XXPermissions.startPermissionActivity(
                    this@ElectronSignUI,
                    permissions
                )
            } else {
                ToastUtils.showMessage(mContext, "获取读写权限失败")
            }
        }
    })
系统相册查看结果

代码传送门

上一篇下一篇

猜你喜欢

热点阅读