Add IBDesignable support

Author: tbxark

Example/Podfile.lock

@@ -1,5 +1,5 @@
 PODS:
-  - TKSwitcherCollection (1.4.0)
+  - TKSwitcherCollection (1.4.1)
 
 DEPENDENCIES:
   - TKSwitcherCollection (from `../`)
@@ -9,7 +9,7 @@ EXTERNAL SOURCES:
     :path: ../
 
 SPEC CHECKSUMS:
-  TKSwitcherCollection: 4992ce6e9f5752777e1efb6ef8f778aae21001fc
+  TKSwitcherCollection: 22ffd357b16193be738e646e9256ba1a26942e17
 
 PODFILE CHECKSUM: 22d4901429738fec3b90d800b97955912bfd129c
 

Example/Pods/Local Podspecs/TKSwitcherCollection.podspec.json

@@ -69,6 +69,9 @@
                                                         <constraints>
                                                             <constraint firstAttribute="width" constant="90" id="3SK-WF-eCF"/>
                                                         </constraints>
+                                                        <userDefinedRuntimeAttributes>
+                                                            <userDefinedRuntimeAttribute type="boolean" keyPath="rotateWhenValueChange" value="YES"/>
+                                                        </userDefinedRuntimeAttributes>
                                                     </view>
                                                 </subviews>
                                                 <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>

Example/Pods/Manifest.lock

@@ -11,18 +11,26 @@ import UIKit
 public typealias TKSwitchValueChangeHook  = (_ value: Bool) -> Void
 
 // 自定义 Switch 基类
+@IBDesignable
 open class TKBaseSwitch: UIControl {
 
     // MARK: - Property
     open var valueChange : TKSwitchValueChangeHook?
-    open var animateDuration : Double = 0.4
-    open var isOn : Bool { return on }
+    @IBInspectable open var animateDuration : Double = 0.4
+    @IBInspectable open var isOn : Bool {
+        set {
+            on = newValue
+        }
+        get {
+            return on
+        }
+    }
+
     internal var on : Bool = true
     internal var sizeScale: CGFloat {
         return min(self.bounds.width, self.bounds.height)/100.0
     }
 
-    
     open override var frame: CGRect {
         didSet {
             guard frame.size != oldValue.size else { return }

Example/Pods/Pods.xcodeproj/project.xcworkspace/contents.xcworkspacedata

@@ -10,22 +10,33 @@ import UIKit
 // Dedign by Oleg Frolov
 //https://dribbble.com/shots/2238916-Switcher-VI
 
+@IBDesignable
 open class TKExchangeSwitch:  TKBaseSwitch {
 
     // MARK: - Property
-    fileprivate var swichControl : TKExchangeCircleView?
-    fileprivate var backgroundLayer = CAShapeLayer()
-    
-    open var color = (background: UIColor(white: 0.95, alpha: 1),
-                 on: UIColor(red:0.698,  green:1,  blue:0.353, alpha:1),
-                off: UIColor(red:0.812,  green:0.847,  blue:0.863, alpha:1)) {
-                    didSet {
-                    setUpView()
-                    }
+    private var swichControl : TKExchangeCircleView?
+    private var backgroundLayer = CAShapeLayer()
+    
+    @IBInspectable open var lineColor = UIColor(white: 0.95, alpha: 1) {
+        didSet {
+            setUpView()
+        }
+    }
+    
+    @IBInspectable open var onColor = UIColor(red:0.698,  green:1,  blue:0.353, alpha:1) {
+        didSet {
+            setUpView()
+        }
+    }
+    
+    @IBInspectable open var offColor = UIColor(red:0.812,  green:0.847,  blue:0.863, alpha:1) {
+        didSet {
+            setUpView()
+        }
     }
 
 
-    open var lineSize : Double = 20 {
+    @IBInspectable open var lineSize : Double = 20 {
         didSet {
             setUpView()
         }
@@ -50,17 +61,17 @@ open class TKExchangeSwitch:  TKBaseSwitch {
         backLayerPath.addLine(to: CGPoint(x: bounds.width - 4 * lineWidth, y: 0))
 
         backgroundLayer.position = position
-        backgroundLayer.fillColor = color.background.cgColor
-        backgroundLayer.strokeColor = color.background.cgColor
+        backgroundLayer.fillColor = lineColor.cgColor
+        backgroundLayer.strokeColor = lineColor.cgColor
         backgroundLayer.lineWidth = self.bounds.height
         backgroundLayer.lineCap = kCALineCapRound
         backgroundLayer.path = backLayerPath.cgPath
         layer.addSublayer(backgroundLayer)
 
         let swichRadius = bounds.height - lineWidth
         let swichControl = TKExchangeCircleView(frame: CGRect(x: lineWidth/2, y: lineWidth/2, width: swichRadius, height: swichRadius))
-        swichControl.onLayer.fillColor = color.on.cgColor
-        swichControl.offLayer.fillColor = color.off.cgColor
+        swichControl.onLayer.fillColor = onColor.cgColor
+        swichControl.offLayer.fillColor = offColor.cgColor
         addSubview(swichControl)
         self.swichControl = swichControl
     }

Example/Pods/Target Support Files/TKSwitcherCollection/Info.plist

@@ -11,13 +11,19 @@ import UIKit
 // Dedign by Oleg Frolov
 //https://dribbble.com/shots/2028065-Switcher-lll
 
+@IBDesignable
 open class TKLiquidSwitch: TKBaseSwitch {
 
 
-    fileprivate var bubbleLayer = CAShapeLayer()
-    fileprivate var lineLayer   = CAShapeLayer()
-    fileprivate var color = (on: UIColor(red:0.373,  green:0.843,  blue:0.596, alpha:1),
-                            off: UIColor(red:0.871,  green:0.871,  blue:0.871, alpha:1)) {
+    private var bubbleLayer = CAShapeLayer()
+    private var lineLayer   = CAShapeLayer()
+    @IBInspectable open var onColor = UIColor(red:0.373,  green:0.843,  blue:0.596, alpha:1){
+        didSet {
+            setUpView()
+        }
+    }
+    
+    @IBInspectable open var offColor = UIColor(red:0.871,  green:0.871,  blue:0.871, alpha:1) {
         didSet {
             setUpView()
         }
@@ -125,10 +131,10 @@ extension TKLiquidSwitch{
 
     func switchColor(_ isOn: Bool)-> UIColor {
         if isOn{
-            return color.on
+            return onColor
         }
         else{
-            return color.off
+            return offColor
         }
     }
 

Example/TKSwitcherCollection/Base.lproj/Main.storyboard

@@ -14,47 +14,44 @@ import UIKit
 
 
 
-public struct TKSimpleSwitchConfig {
-    public var onColor : UIColor
-    public var offColor : UIColor
-    public var lineColor : UIColor
-    public var circleColor : UIColor
-    public var lineSize: Double
-    
-    
-    
-    public init(onColor     : UIColor = UIColor(red:0.341,  green:0.914,  blue:0.506, alpha:1),
-                offColor    : UIColor = UIColor(white: 0.9, alpha: 1),
-                lineColor   : UIColor = UIColor(white: 0.8, alpha: 1),
-                circleColor : UIColor = UIColor.white,
-                lineSize : Double = 10) {
-        self.onColor = onColor
-        self.offColor = offColor
-        self.lineColor = lineColor
-        self.circleColor = circleColor
-        self.lineSize = lineSize
-        
-        
-    }
-
-}
 
+@IBDesignable
 open class TKSimpleSwitch:  TKBaseSwitch {
 
     fileprivate var swichControl = CAShapeLayer()
     fileprivate var backgroundLayer = CAShapeLayer()
 
     // 是否加旋转特效
-    open var rotateWhenValueChange = false
+    @IBInspectable open var rotateWhenValueChange: Bool = false
 
-    open var config = TKSimpleSwitchConfig() {
+    @IBInspectable open  var onColor : UIColor = UIColor(red:0.341,  green:0.914,  blue:0.506, alpha:1) {
+        didSet {
+            setUpView()
+        }
+    }
+    @IBInspectable open  var offColor : UIColor = UIColor(white: 0.9, alpha: 1) {
+        didSet {
+            setUpView()
+        }
+    }
+    @IBInspectable open  var lineColor : UIColor = UIColor(white: 0.8, alpha: 1) {
+        didSet {
+            setUpView()
+        }
+    }
+    @IBInspectable open  var circleColor : UIColor = UIColor.white {
+        didSet {
+            setUpView()
+        }
+    }
+    @IBInspectable open  var lineSize: Double = 10 {
         didSet {
             setUpView()
         }
     }
 
-    open var lineWidth : CGFloat {
-        return CGFloat(config.lineSize) * sizeScale
+    private var lineWidth : CGFloat {
+        return CGFloat(lineSize) * sizeScale
     }
 
 
@@ -66,7 +63,7 @@ open class TKSimpleSwitch:  TKBaseSwitch {
         let radius = bounds.height/2 - lineWidth
         let roundedRectPath = UIBezierPath(roundedRect:frame.insetBy(dx: lineWidth, dy: lineWidth) , cornerRadius:radius)
         backgroundLayer.fillColor = stateToFillColor(true)
-        backgroundLayer.strokeColor = config.lineColor.cgColor
+        backgroundLayer.strokeColor = lineColor.cgColor
         backgroundLayer.lineWidth = lineWidth
         backgroundLayer.path = roundedRectPath.cgPath
         layer.addSublayer(backgroundLayer)
@@ -82,7 +79,7 @@ open class TKSimpleSwitch:  TKBaseSwitch {
         swichControl.path = swichControlPath.cgPath
         swichControl.lineCap     = kCALineCapRound
         swichControl.fillColor   = nil
-        swichControl.strokeColor = config.circleColor.cgColor
+        swichControl.strokeColor = circleColor.cgColor
         swichControl.lineWidth   = innerLineWidth
         swichControl.strokeEnd = 0.0001
         layer.addSublayer(swichControl)
@@ -152,7 +149,7 @@ open class TKSimpleSwitch:  TKBaseSwitch {
     }
 
     fileprivate func stateToFillColor(_ isOn:Bool) -> CGColor {
-        return isOn ?  config.onColor.cgColor : config.offColor.cgColor
+        return isOn ?  onColor.cgColor : offColor.cgColor
     }
 
 }