Make the icon and placeholder of ICTokenField IBInspectable

Author: bcylin

Example/Example/Main.storyboard

@@ -18,7 +18,7 @@
                             <rect key="frame" x="0.0" y="269.5" width="600" height="88"/>
                             <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                             <fontDescription key="fontDescription" type="system" pointSize="15"/>
-                            <state key="normal" title="Back"/>
+                            <state key="normal" title="Back to Code"/>
                             <connections>
                                 <action selector="dismiss:" destination="0fq-Xw-Z0G" eventType="touchUpInside" id="Ia6-YR-Zzm"/>
                             </connections>
@@ -59,6 +59,22 @@
                                         <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="nCe-ZG-eEP" id="6tu-Im-VHX">
                                             <rect key="frame" x="0.0" y="0.0" width="600" height="43.5"/>
                                             <autoresizingMask key="autoresizingMask"/>
+                                            <subviews>
+                                                <view contentMode="scaleToFill" fixedFrame="YES" translatesAutoresizingMaskIntoConstraints="NO" id="2dP-7v-mWC" customClass="ICTokenField" customModule="ICInputAccessory">
+                                                    <rect key="frame" x="0.0" y="0.0" width="600" height="43.5"/>
+                                                    <color key="backgroundColor" white="0.33333333333333331" alpha="1" colorSpace="calibratedWhite"/>
+                                                    <userDefinedRuntimeAttributes>
+                                                        <userDefinedRuntimeAttribute type="string" keyPath="placeholder" value="ICTokenFIeld"/>
+                                                        <userDefinedRuntimeAttribute type="image" keyPath="icon" value="icook-iphone-input-search"/>
+                                                        <userDefinedRuntimeAttribute type="number" keyPath="cornerRadius">
+                                                            <real key="value" value="5"/>
+                                                        </userDefinedRuntimeAttribute>
+                                                        <userDefinedRuntimeAttribute type="number" keyPath="borderWidth">
+                                                            <real key="value" value="0.0"/>
+                                                        </userDefinedRuntimeAttribute>
+                                                    </userDefinedRuntimeAttributes>
+                                                </view>
+                                            </subviews>
                                         </tableViewCellContentView>
                                     </tableViewCell>
                                 </cells>
@@ -104,4 +120,7 @@
             <point key="canvasLocation" x="708" y="377"/>
         </scene>
     </scenes>
+    <resources>
+        <image name="icook-iphone-input-search" width="20" height="20"/>
+    </resources>
 </document>

Source/ICTokenField.swift

@@ -44,6 +44,7 @@ import UIKit
 ////////////////////////////////////////////////////////////////////////////////
 
 
+@IBDesignable
 public class ICTokenField: UIView, UITextFieldDelegate, ICBackspaceTextFieldDelegate {
 
   /// The receiver’s delegate.
@@ -58,7 +59,7 @@ public class ICTokenField: UIView, UITextFieldDelegate, ICBackspaceTextFieldDele
   }
 
   /// The image on the left of text field.
-  public var icon: UIImage? {
+  @IBInspectable public var icon: UIImage? {
     didSet {
       if let icon = icon {
         let imageView = UIImageView(image: icon)
@@ -77,7 +78,7 @@ public class ICTokenField: UIView, UITextFieldDelegate, ICBackspaceTextFieldDele
   }
 
   /// The placeholder with the default color and font.
-  public var placeholder: String? {
+  @IBInspectable public var placeholder: String? {
     get {
       return attributedPlaceholder?.string
     }
@@ -213,6 +214,19 @@ public class ICTokenField: UIView, UITextFieldDelegate, ICBackspaceTextFieldDele
     layoutTokenTextField()
   }
 
+  // MARK: - NSKeyValueCoding
+
+  public override func setValue(value: AnyObject?, forUndefinedKey key: String) {
+    switch value {
+    case let image as UIImage? where key == "icon":
+      icon = image
+    case let text as String? where key == "placeholder":
+      placeholder = text
+    default:
+      break
+    }
+  }
+
   // MARK: - UITextFieldDelegate
 
   public func textFieldShouldBeginEditing(textField: UITextField) -> Bool {
@@ -340,8 +354,6 @@ public class ICTokenField: UIView, UITextFieldDelegate, ICBackspaceTextFieldDele
       frame = CGRect(x: 0, y: 7, width: UIScreen.mainScreen().bounds.width, height: 30)
     }
 
-    backgroundColor = UIColor.whiteColor()
-
     addSubview(scrollView)
     scrollView.addSubview(inputTextField)
     scrollView.translatesAutoresizingMaskIntoConstraints = false