返回 导航

Swift

hangge.com

Swift - 捕获用户签名（用户在屏幕上手写签名，并生成图片）

作者：hangge | 2016-01-11 09:08
（本文代码已升级至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
评论

全部评论（10）

回到顶部