Swift - 捕获用户签名(用户在屏幕上手写签名,并生成图片)
(本文代码已升级至Swift3)
本文介绍如何使用Swift语言,在iOS设备上捕捉用户的签名(其实这个本质就是一个简单的画图板程序)。
实现功能如下:
1,页面上方提供一个签名区域(UIView),用户可以在这个区域手写签字。
2,点击“预览签名”,会获取用户签名生成UIImage,在下方的imageView中显示。
3,点击“保存签名”,会将用户签名保存到设备相册中。
效果图如下:
代码如下:
--- DrawSignatureView.swift (签名视图组件) ---
import UIKit open class DrawSignatureView: UIView { // 公共属性 open var lineWidth: CGFloat = 2.0 { didSet { self.path.lineWidth = lineWidth } } open var strokeColor: UIColor = UIColor.black open var signatureBackgroundColor: UIColor = UIColor.white // 私有属性 fileprivate var path = UIBezierPath() fileprivate var pts = [CGPoint](repeating: CGPoint(), count: 5) fileprivate var ctr = 0 // Init override init(frame: CGRect) { super.init(frame: frame) self.backgroundColor = self.signatureBackgroundColor self.path.lineWidth = self.lineWidth } // Init required public init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) self.backgroundColor = self.signatureBackgroundColor self.path.lineWidth = self.lineWidth } // Draw override open func draw(_ rect: CGRect) { self.strokeColor.setStroke() self.path.stroke() } // 触摸签名相关方法 override open func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) { if let firstTouch = touches.first{ let touchPoint = firstTouch.location(in: self) self.ctr = 0 self.pts[0] = touchPoint } } override open func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) { if let firstTouch = touches.first{ let touchPoint = firstTouch.location(in: self) self.ctr += 1 self.pts[self.ctr] = touchPoint if (self.ctr == 4) { self.pts[3] = CGPoint(x: (self.pts[2].x + self.pts[4].x)/2.0, y: (self.pts[2].y + self.pts[4].y)/2.0) self.path.move(to: self.pts[0]) self.path.addCurve(to: self.pts[3], controlPoint1:self.pts[1], controlPoint2:self.pts[2]) self.setNeedsDisplay() self.pts[0] = self.pts[3] self.pts[1] = self.pts[4] self.ctr = 1 } self.setNeedsDisplay() } } override open func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) { if self.ctr == 0{ let touchPoint = self.pts[0] self.path.move(to: CGPoint(x: touchPoint.x-1.0,y: touchPoint.y)) self.path.addLine(to: CGPoint(x: touchPoint.x+1.0,y: touchPoint.y)) self.setNeedsDisplay() } else { self.ctr = 0 } } // 签名视图清空 open func clearSignature() { self.path.removeAllPoints() self.setNeedsDisplay() } // 将签名保存为UIImage open func getSignature() ->UIImage { UIGraphicsBeginImageContext(CGSize(width: self.bounds.size.width, height: self.bounds.size.height)) self.layer.render(in: UIGraphicsGetCurrentContext()!) let signature: UIImage = UIGraphicsGetImageFromCurrentImageContext()! UIGraphicsEndImageContext() return signature } }
--- ViewController.swift (使用样例) ---
import UIKit class ViewController: UIViewController { //签名预览 @IBOutlet weak var imageView: UIImageView! //签名区域视图 var drawView:DrawSignatureView! override func viewDidLoad() { super.viewDidLoad() //签名区域位置尺寸 var drawViewFrame = self.view.bounds drawViewFrame.size.height = 200 //添加签名区域 drawView = DrawSignatureView(frame: drawViewFrame) self.view.addSubview(drawView) } //预览签名 @IBAction func previewSignature(_ sender: AnyObject) { let signatureImage = self.drawView.getSignature() imageView.image = signatureImage } //保存签名 @IBAction func savaSignature(_ sender: AnyObject) { let signatureImage = self.drawView.getSignature() UIImageWriteToSavedPhotosAlbum(signatureImage, nil, nil, nil) self.drawView.clearSignature() } //清除签名 @IBAction func clearSignature(_ sender: AnyObject) { self.drawView.clearSignature() self.imageView.image = nil } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() } }源码下载:hangge_1013.zip
hangge 有工程么 我可以下载一下么
hangge,DrawSignatureView.swift里面19-33行,两个Init是干嘛用的?能不能解释一下90-96行签名保存UIImage,以及3个触摸签名相关方法,不是能看得很懂,谢谢了
hangge,DrawSignatureView.swift里面第38行self.path.stroke()是什么意思?
hangge,DrawSignatureView.swift里面,16,17行私有属性,pts,ctr定义的是什么?private var pts = [CGPoint](count: 5, repeatedValue: CGPoint()) 这句话是什么意思?
hangge,DrawSignatureView.swift 中,第7行 didSet{}是干嘛用的?
hangge,在ViewController.swift中,第9行,18行,19行,是什么意思
hangge,在ViewController.swift中,第33行,38行,self.drawView.clearSignature()是用来做什么的
嗯,好的谢谢hangge。
嗯,好的,谢谢hangge。我会关注的,不过我要怎么搜到这个文章呢= =。那下周再问问您吧。或者麻烦您发邮件通知一下我= =
hangge怎么获取UIImageWriteToSavedPhotosAlbum保存在相册的地址呢,就是我保存在了相册里,并且我要取出它的地址