Swift 圆形渐变进度条 支持事件 支持XIB和StoryBoard

最近项目用到了 一个经验条 要求颜色渐变 中间是用户头像 还要接受事件 然后自己写了个下面这个控件

//
//  XProgressView.swift
//  XProgressView
//
//  Created by eduo_xiaoP on 15/4/11.
//  Copyright (c) 2015年 eduo. All rights reserved.
//

import Foundation
import UIKit

@objc protocol XCirleProgressViewDelegate: NSObjectProtocol {
    optional func progressTapped(progressView: XCirleProgressView!)
}

@IBDesignable class XCirleProgressView: UIView {
    
    struct Constant {
        static let lineWidth: CGFloat = 10
        static let trackColor = UIColor(red: 245/255.0,green: 245/255.0,blue: 245/255.0,alpha: 1)
        static let endColor = UIColor.redColor().colorWithAlphaComponent(0.8)
        static let startColor = UIColor.greenColor().colorWithAlphaComponent(0.2)
    }
    
    let gradientLayer = CAGradientLayer()
    let trackLayer = CAShapeLayer()
    let progressLayer = CAShapeLayer()
    let path = UIBezierPath()
    
    @IBInspectable var progress: Int = 0
    
    @IBInspectable var image: UIImage? {
        didSet{
            setNeedsDisplay()
        }
    }
    
    weak var delegate: XCirleProgressViewDelegate?
    
    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        
        initialization()
    }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        initialization()
    }
    
    override func layoutSubviews() {
        path.moveToPoint(CGPointMake(CGRectGetMidX(bounds) + Constant.lineWidth/2.0,Constant.lineWidth))
        path
        path.addArcWithCenter(CGPointMake(CGRectGetMidX(bounds),CGRectGetMidY(bounds)),radius: bounds.size.width/2 - Constant.lineWidth,startAngle: angleToRadian(-90),endAngle: angleToRadian(270),clockwise: true)
        
        trackLayer.frame = bounds
        trackLayer.path = path.CGPath
        
        progressLayer.frame = bounds
        progressLayer.path = path.CGPath
        
        gradientLayer.frame = bounds
    }
    
    func initialization() {
        trackLayer.fillColor = UIColor.clearColor().CGColor
        trackLayer.strokeColor = Constant.trackColor.CGColor
        trackLayer.lineWidth = Constant.lineWidth
        trackLayer.lineCap = kCALineCapRound
        layer.addSublayer(trackLayer)
        
        progressLayer.fillColor = UIColor.clearColor().CGColor
        progressLayer.strokeColor = UIColor.orangeColor().CGColor
        progressLayer.lineWidth = Constant.lineWidth
        progressLayer.lineCap = kCALineCapSquare
        progressLayer.strokeEnd = 0
        
        gradientLayer.colors = [Constant.startColor.CGColor,Constant.endColor.CGColor]
        layer.addSublayer(gradientLayer)
    }
    
    override func drawRect(rect: CGRect) {
        progressLayer.strokeEnd = CGFloat(progress)/200.0//好像是由于layoutsubviews调用2此导致的画出来长度是2倍  待解决
        gradientLayer.mask = progressLayer
        
        path.addClip()
        image?.drawInRect(bounds)
    }
    
    func setProgress(pro: Int,animated anim: Bool) {
        setProgress(pro,animated: anim,withDuration: 0.55)
    }
    
    func setProgress(pro: Int,animated anim: Bool,withDuration duration: Double) {
        progress = pro
        CATransaction.begin()
        CATransaction.setDisableActions(!anim)
        CATransaction.setAnimationTimingFunction(CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaSEOut))
        CATransaction.setAnimationDuration(duration)
        progressLayer.strokeEnd = CGFloat(progress)/200.0//好像是由于layoutsubviews调用2此导致的画出来长度是2倍  待解决
        CATransaction.commit()
    }
    
    private func angleToRadian(angle: Double)->CGFloat {
        return CGFloat(angle/Double(180.0) * M_PI)
    }
    
    override func touchesBegan(touches: Set<NSObject>,withEvent event: UIEvent) {
        
        if let dele = delegate where dele.respondsToSelector("progressTapped:") {
            dele.progressTapped!(self)
        }
    }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!