Merge pull request #6 from kaandedeoglu/feature/IBInspectable_IBDesignable

Added IBInspectable / IBDesignable support. Added another progress fr…

KDCircularProgress/KDCircularProgress.swift

@@ -12,6 +12,7 @@ public enum KDCircularProgressGlowMode {
     case Forward, Reverse, Constant, NoGlow
 }
 
+@IBDesignable
 public class KDCircularProgress: UIView {
     
     private struct ConversionFunctions {
@@ -61,7 +62,7 @@ public class KDCircularProgress: UIView {
         }
     }
     
-    public var angle: Int! {
+    @IBInspectable public var angle: Int = 0 {
         didSet {
             if self.isAnimating() {
                 self.pauseAnimation()
@@ -70,66 +71,66 @@ public class KDCircularProgress: UIView {
         }
     }
     
-    public var startAngle: Int! {
+    @IBInspectable public var startAngle: Int = 0 {
         didSet {
             progressLayer.startAngle = UtilityFunctions.Mod(startAngle, range: 360, minMax: (0,360))
             progressLayer.setNeedsDisplay()
         }
     }
     
-    public var clockwise: Bool! {
+    @IBInspectable public var clockwise: Bool = true {
         didSet {
             progressLayer.clockwise = clockwise
             progressLayer.setNeedsDisplay()
         }
     }
     
-    public var roundedCorners: Bool! {
+    @IBInspectable public var roundedCorners: Bool = true {
         didSet {
             progressLayer.roundedCorners = roundedCorners
         }
     }
     
-    public var gradientRotateSpeed: CGFloat! {
+    @IBInspectable public var gradientRotateSpeed: CGFloat = 0 {
         didSet {
             progressLayer.gradientRotateSpeed = gradientRotateSpeed
         }
     }
     
-    public var glowAmount: CGFloat! {//Between 0 and 1
+    @IBInspectable public var glowAmount: CGFloat = 1.0 {//Between 0 and 1
         didSet {
             progressLayer.glowAmount = UtilityFunctions.Clamp(glowAmount, minMax: (0, 1))
         }
     }
     
-    public var glowMode: KDCircularProgressGlowMode! {
+    @IBInspectable public var glowMode: KDCircularProgressGlowMode = .Forward {
         didSet {
             progressLayer.glowMode = glowMode
         }
     }
     
-    public var progressThickness: CGFloat! {//Between 0 and 1
+    @IBInspectable public var progressThickness: CGFloat = 0.4 {//Between 0 and 1
         didSet {
             progressThickness = UtilityFunctions.Clamp(progressThickness, minMax: (0, 1))
             progressLayer.progressThickness = progressThickness/2
         }
     }
     
-    public var trackThickness: CGFloat! {//Between 0 and 1
+    @IBInspectable public var trackThickness: CGFloat = 0.5 {//Between 0 and 1
         didSet {
             trackThickness = UtilityFunctions.Clamp(trackThickness, minMax: (0, 1))
             progressLayer.trackThickness = trackThickness/2
         }
     }
     
-    public var trackColor: UIColor! {
+    @IBInspectable public var trackColor: UIColor = UIColor.blackColor() {
         didSet {
             progressLayer.trackColor = trackColor
             progressLayer.setNeedsDisplay()
         }
     }
     
-    public var progressColors: [UIColor]! {
+    @IBInspectable public var progressColors: [UIColor]! {
         get {
             return progressLayer.colorsArray
         }
@@ -139,13 +140,21 @@ public class KDCircularProgress: UIView {
         }
     }
     
+    //These are used only from the Interface-Builder. Changing these from code will have no effect.
+    //Also IB colors are limited to 3, whereas programatically we can have an arbitrary number of them.
+    @IBInspectable public var IBColor1: UIColor?
+    @IBInspectable public var IBColor2: UIColor?
+    @IBInspectable public var IBColor3: UIColor?
+    
+    
     private var animationCompletionBlock: ((Bool) -> Void)?
     
     override public init(frame: CGRect) {
         super.init(frame: frame)
-        backgroundColor = UIColor.clearColor()
         userInteractionEnabled = false
         setInitialValues()
+        refreshValues()
+        checkAndSetIBColors()
     }
     
     convenience public init(frame:CGRect, colors: UIColor...) {
@@ -154,13 +163,47 @@ public class KDCircularProgress: UIView {
     }
 
     required public init(coder aDecoder: NSCoder) {
-        fatalError("init(coder:) has not been implemented")
-    }
+		super.init(coder: aDecoder)
+		setTranslatesAutoresizingMaskIntoConstraints(false)
+		userInteractionEnabled = false
+		setInitialValues()
+        refreshValues()
+	}
     
+    public override func awakeFromNib() {
+        checkAndSetIBColors()
+    }
+	
     override public class func layerClass() -> AnyClass {
         return KDCircularProgressViewLayer.self
     }
     
+    private func setInitialValues() {
+        radius = (frame.size.width/2.0) * 0.8 //We always apply a 20% padding, stopping glows from being clipped
+        backgroundColor = .clearColor()
+        setColors(UIColor.whiteColor(), UIColor.redColor())
+    }
+    
+    private func refreshValues() {
+        progressLayer.angle = angle
+        progressLayer.startAngle = UtilityFunctions.Mod(startAngle, range: 360, minMax: (0,360))
+        progressLayer.clockwise = clockwise
+        progressLayer.roundedCorners = roundedCorners
+        progressLayer.gradientRotateSpeed = gradientRotateSpeed
+        progressLayer.glowAmount = UtilityFunctions.Clamp(glowAmount, minMax: (0, 1))
+        progressLayer.glowMode = glowMode
+        progressLayer.progressThickness = progressThickness/2
+        progressLayer.trackColor = trackColor
+        progressLayer.trackThickness = trackThickness/2
+    }
+    
+    private func checkAndSetIBColors() {
+        let nonNilColors = [IBColor1, IBColor2, IBColor3].filter { $0 != nil}.map { $0! }
+        if nonNilColors.count > 0 {
+            setColors(nonNilColors)
+        }
+    }
+    
     public func setColors(colors: UIColor...) {
         setColors(colors)
     }
@@ -170,21 +213,6 @@ public class KDCircularProgress: UIView {
         progressLayer.setNeedsDisplay()
     }
     
-    private func setInitialValues() { // We have this because didSet effects are not triggered when invoked directly from init method
-        radius = (frame.size.width/2.0) * 0.8 //We always apply a 20% padding, stopping glows from being clipped
-        angle = 0
-        startAngle = 0
-        clockwise = true
-        roundedCorners = false
-        gradientRotateSpeed = 0
-        glowAmount = 1
-        glowMode = .Forward
-        progressThickness = 0.4
-        trackThickness = 0.5
-        trackColor = UIColor.blackColor()
-        setColors(UIColor.whiteColor(), UIColor.redColor())
-    }
-    
     public func animateFromAngle(fromAngle: Int, toAngle: Int, duration: NSTimeInterval, completion: ((Bool) -> Void)?) {
         if isAnimating() {
             pauseAnimation()
@@ -216,6 +244,12 @@ public class KDCircularProgress: UIView {
         angle = currentValue
     }
     
+    public func stopAnimation() {
+        let presentationLayer = progressLayer.presentationLayer() as! KDCircularProgressViewLayer
+        progressLayer.removeAllAnimations()
+        angle = 0
+    }
+    
     public func isAnimating() -> Bool {
         return progressLayer.animationForKey("angle") != nil
     }
@@ -228,7 +262,9 @@ public class KDCircularProgress: UIView {
     }
     
     public override func didMoveToWindow() {
-        progressLayer.contentsScale = window!.screen.scale
+        if let window = window {
+            progressLayer.contentsScale = window.screen.scale
+        }
     }
     
     public override func willMoveToSuperview(newSuperview: UIView?) {
@@ -237,6 +273,13 @@ public class KDCircularProgress: UIView {
         }
     }
     
+    public override func prepareForInterfaceBuilder() {
+        setInitialValues()
+        refreshValues()
+        checkAndSetIBColors()
+        progressLayer.setNeedsDisplay()
+    }
+    
     private class KDCircularProgressViewLayer: CALayer {
         @NSManaged var angle: Int
         var radius: CGFloat!

KDCircularProgressExample/KDCircularProgressExample/Base.lproj/Main.storyboard

@@ -1,7 +1,8 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="6254" systemVersion="14C109" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" initialViewController="vXZ-lx-hvc">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="7706" systemVersion="14D136" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" initialViewController="vXZ-lx-hvc">
     <dependencies>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6247"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7703"/>
+        <capability name="Aspect ratio constraints" minToolsVersion="5.1"/>
     </dependencies>
     <scenes>
         <!--View Controller-->
@@ -39,19 +40,60 @@
                                     <action selector="animateButtonTapped:" destination="vXZ-lx-hvc" eventType="touchUpInside" id="b0F-cY-phl"/>
                                 </connections>
                             </button>
+                            <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="wev-Tz-pfW" customClass="KDCircularProgress" customModule="KDCircularProgressExample" customModuleProvider="target">
+                                <rect key="frame" x="60" y="20" width="200" height="200"/>
+                                <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
+                                <constraints>
+                                    <constraint firstAttribute="width" constant="200" id="191-H5-EIc"/>
+                                    <constraint firstAttribute="width" secondItem="wev-Tz-pfW" secondAttribute="height" multiplier="1:1" id="Fsf-y4-1ta"/>
+                                </constraints>
+                                <userDefinedRuntimeAttributes>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="angle">
+                                        <integer key="value" value="320"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="color" keyPath="IBColor1">
+                                        <color key="value" red="0.97441762909999996" green="1" blue="0.31255436479999998" alpha="1" colorSpace="calibratedRGB"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="color" keyPath="IBColor2">
+                                        <color key="value" red="1" green="1" blue="1" alpha="1" colorSpace="calibratedRGB"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="color" keyPath="IBColor3">
+                                        <color key="value" red="0.085719833812801863" green="0.98039215690000003" blue="0.39604470297983985" alpha="1" colorSpace="calibratedRGB"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="startAngle">
+                                        <integer key="value" value="-90"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="boolean" keyPath="roundedCorners" value="YES"/>
+                                    <userDefinedRuntimeAttribute type="boolean" keyPath="clockwise" value="YES"/>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="glowAmount">
+                                        <real key="value" value="2"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="progressThickness">
+                                        <real key="value" value="0.20000000000000001"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="trackThickness">
+                                        <real key="value" value="1"/>
+                                    </userDefinedRuntimeAttribute>
+                                    <userDefinedRuntimeAttribute type="number" keyPath="gradientRotateSpeed">
+                                        <real key="value" value="2"/>
+                                    </userDefinedRuntimeAttribute>
+                                </userDefinedRuntimeAttributes>
+                            </view>
                         </subviews>
-                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
+                        <color key="backgroundColor" red="0.4736600907821229" green="0.4736600907821229" blue="0.4736600907821229" alpha="1" colorSpace="calibratedRGB"/>
                         <constraints>
                             <constraint firstAttribute="centerX" secondItem="BHN-x6-Zsx" secondAttribute="centerX" id="Arq-5P-YRp"/>
+                            <constraint firstItem="wev-Tz-pfW" firstAttribute="top" secondItem="ghF-CJ-0yv" secondAttribute="bottom" id="EcI-a0-AkN"/>
                             <constraint firstItem="5M2-Yi-RuL" firstAttribute="top" secondItem="BHN-x6-Zsx" secondAttribute="bottom" constant="15" id="GMQ-0i-VMb"/>
                             <constraint firstAttribute="centerX" secondItem="5M2-Yi-RuL" secondAttribute="centerX" id="IEH-Lm-rgx"/>
+                            <constraint firstAttribute="centerX" secondItem="wev-Tz-pfW" secondAttribute="centerX" id="jKJ-82-cfb"/>
                             <constraint firstItem="o67-py-2aK" firstAttribute="top" secondItem="5M2-Yi-RuL" secondAttribute="bottom" constant="15" id="zhX-dr-Rnn"/>
                         </constraints>
                     </view>
                 </viewController>
                 <placeholder placeholderIdentifier="IBFirstResponder" id="x5A-6p-PRh" sceneMemberID="firstResponder"/>
             </objects>
-            <point key="canvasLocation" x="218" y="319"/>
+            <point key="canvasLocation" x="410" y="396"/>
         </scene>
     </scenes>
     <simulatedMetricsContainer key="defaultSimulatedMetrics">

KDCircularProgressExample/KDCircularProgressExample/ViewController.swift

@@ -18,16 +18,15 @@ class ViewController: UIViewController {
         
         progress = KDCircularProgress(frame: CGRect(x: 0, y: 0, width: 300, height: 300))
         progress.startAngle = -90
-        progress.progressThickness = 0.05
-        progress.trackThickness = 0.4
+        progress.progressThickness = 0.2
+        progress.trackThickness = 0.6
         progress.clockwise = true
-        progress.center = view.center
         progress.gradientRotateSpeed = 2
         progress.roundedCorners = false
         progress.glowMode = .Forward
-        progress.glowAmount = 0.0
-//        progress.setColors(UIColor.cyanColor() ,UIColor.whiteColor(), UIColor.magentaColor())
-        progress.setColors(UIColor.whiteColor())
+        progress.glowAmount = 0.9
+        progress.setColors(UIColor.cyanColor() ,UIColor.whiteColor(), UIColor.magentaColor(), UIColor.whiteColor(), UIColor.orangeColor())
+        progress.center = CGPoint(x: view.center.x, y: view.center.y + 25)
         view.addSubview(progress)
     }