前言
最近项目中遇到了这样一个使用场景,客户端需要根据后台返回的合同数据,生成一个文件,然后填充用户数据后,让用户进行手写签名。
需求分析
后台给我们客户端什么数据?按照PC来说,可能我们会考虑直接把word格式的合同文档发来,用户填好信息后,在想办法生成签名的图片,然后在添加到文档中。这个过程想想就麻烦。于是思考了几天后,初步形成了下面的思路。
- 首先合同以html格式发给客户端,客户端可以在webview中进行预览展示
- 接着要求用户输入一些信息,这些信息待会儿会填充到html中指定的位置
- 接着我们可以将替换了信息的html通过webview展示,并且可以输出为pdf文件
- 再接着我们可以使用webview加载刚才生成好的未签名的pdf,让用户进行签名。
- 用户签名结束后,我们可以再生成签名后的pdf文件
其中前两步比较常规,我们也经常使用,所以不多提了,我们主要从第三部讲起。
生成未签名pdf
如何把webview展示的内容导出为pdf。目前有两种方式,一种是按照常用的视图截图方式,将内容保存为图片,然后再生成pdf,而另一种是直接使用ios提供的方法,直接打印为pdf文件。这里推荐第二种方式,据说比较清晰,而且有封装的比较完善的库,可以直接使用。
比如:BNHtmlPdfKit
Simulator Screen Shot 2016年3月18日 21.58.14.png
进行签名
签名的思路是直接根据用户手指的滑动,生成贝塞尔曲线,模拟用户手写签名。这一步的核心是,我们需要保存下来用户签名的轨迹信息,我们除了要在屏幕上向用户展示签名外,还要根据签名的轨迹信息,来将签名绘制到最终的pdf文件中。关于手写签名也有很多优化手段,读者可以看下面几个不错的库。
Smooth-Line-View
PPSSignatureView
Simulator Screen Shot 2016年3月18日 21.58.41.png
生成签名pdf
前面两步呢,我们拿到了未签名的pdf和用户的手写签名数据,接着我们需要把这二者结合起来,生成签名的pdf。这里的思路就是:根据未签名的pdf,一页一页的复制出来一份新的pdf,同时,在需要签名的页面,将签名信息填充进去。最后我们生成的就是签名的pdf文件了。
Simulator Screen Shot 2016年3月18日 21.59.10.png