评论

如何使用canvas绘制签名板?

如何实现电子签名板效果

场景分析

在小程序业务中如需用户进行手写签名的场景如:寄快递,签约合同时需要在小程序中进行手写签名。

处理方法


实现原理

运用 canvas 监听用户 touch 事件,然后在 canvas 上画出与 touch 事件相近的线模仿手写签名效果。

实现方法参考如下代码片段:

https://developers.weixin.qq.com/s/MYDTQAmR7EIa



最后一次编辑于  2024-09-09  
点赞 6
收藏
评论

4 个评论

  • 鸳泠
    鸳泠
    02-21

    非常好,但是调试的时候,画多了之后笔画会有延迟,这个有办法解决吗

    02-21
    赞同
    回复 3
    • CodeDreamer
      CodeDreamer
      02-21
      真机测试的么?还是ide
      02-21
      回复
    • 鸳泠
      鸳泠
      02-22回复CodeDreamer
      ide中
      02-22
      回复
    • CodeDreamer
      CodeDreamer
      02-24回复鸳泠
      真机测试是否正常。
      02-24
      回复
  • 逛吃逛吃
    逛吃逛吃
    2024-12-24

    有没有最新的Canvas-2d的案例啊? 这个方法好多报错,比较老


    2024-12-24
    赞同
    回复 1
    • CodeDreamer
      CodeDreamer
      2024-12-24
      没看到有报错哇。
      2024-12-24
      回复
  • sRect
    sRect
    2024-08-22

    很棒

    2024-08-22
    赞同
    回复
  • Lıu
    Lıu
    2023-06-02

    你这不已经画出来了,


    2023-06-02
    赞同
    回复 2
    • 不知谓
      不知谓
      2023-06-19
      哈哈  这是大佬的分享不是提问
      2023-06-19
      回复
    • 成哥
      成哥
      发表于移动端
      2023-07-23回复不知谓
      %
      2023-07-23
      回复
登录 后发表内容