微信小程序 手写签名_微信小程序实现手写签字

无纸化办公,这是老板对我的要求,然而有人现场执法文件全部电子化,只有签字部分让一个搞web的人有点儿头疼,不能为了这个找个人来开发app吧于是想到了小程序,对于一个新接触小程序的人来说还是有挑战性的,因为我第一次写小程序。还好有文档。所以思路来了,触碰屏幕记录开始画的位置

手指在屏幕上滑动就是画咯,画完了记录最后的离开屏幕的位置

下一个笔画开始还是先触碰屏幕

手指滑动

最后点击一个完成签字就行了

小程序的canvas 还是挺好的。下面放代码

首先是 index.wxml

被检查单位签字

完成签字

重新签字

很简单啊 就是一个布局里面有个画布 有两个按钮

然后是index.wxss.paper{border:1px solid #dedede; margin: 10px; height:160px }

.image{border:1px solid #dedede; margin: 10px; height:160px }

.signBtn{display: flex; margin-top:20px;}

.signTitle{ text-align: center; font-size:1.2em;margin:10px auto;}

.handWriting{width:100%}

.image image{width:100%; height:160px }

没啥好说的 就是布局div+css

最后是index.jsPage({

data: {

context1: null,

has

你可能感兴趣的:(微信小程序,手写签名)