Fixed issue #3 and added option to set keyboard appearance

Athul Sai · Athul Sai · commit 9ca52447bc9a · 2017-01-17T16:12:38.000+05:30
diff --git a/Example/KWVerificationCodeView/Base.lproj/Main.storyboard b/Example/KWVerificationCodeView/Base.lproj/Main.storyboard
@@ -23,7 +23,7 @@
                         <subviews>
                             <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ekS-Ew-GpT" userLabel="verificationCodeView" customClass="KWVerificationCodeView" customModule="KWVerificationCodeView">
                                 <rect key="frame" x="33" y="273" width="310" height="62"/>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="calibratedRGB"/>
+                                <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                                 <constraints>
                                     <constraint firstAttribute="width" constant="310" id="SmR-e4-qbu"/>
                                     <constraint firstAttribute="height" constant="62" id="mda-A6-NvC"/>
@@ -32,12 +32,6 @@
                                     <userDefinedRuntimeAttribute type="number" keyPath="layer.cornerRadius">
                                         <integer key="value" value="5"/>
                                     </userDefinedRuntimeAttribute>
-                                    <userDefinedRuntimeAttribute type="color" keyPath="underlineSelectedColor">
-                                        <color key="value" red="0.068236636075229451" green="0.44572890228426398" blue="0.12406174271236946" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
-                                    </userDefinedRuntimeAttribute>
-                                    <userDefinedRuntimeAttribute type="color" keyPath="underlineColor">
-                                        <color key="value" white="0.33333333333333331" alpha="1" colorSpace="calibratedWhite"/>
-                                    </userDefinedRuntimeAttribute>
                                 </userDefinedRuntimeAttributes>
                             </view>
                             <button opaque="NO" contentMode="scaleToFill" enabled="NO" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Skh-28-8br" userLabel="submitButton">
@@ -52,7 +46,7 @@
                                     <color key="titleColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                                 </state>
                                 <state key="disabled">
-                                    <color key="titleColor" red="1" green="0.79129829853778799" blue="0.59988017074977373" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                                    <color key="titleColor" red="1" green="0.7912982985" blue="0.59988017069999999" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 </state>
                                 <userDefinedRuntimeAttributes>
                                     <userDefinedRuntimeAttribute type="number" keyPath="layer.cornerRadius">
@@ -72,11 +66,11 @@
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Enter Code" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="P6k-pN-VEP" userLabel="promptLabel">
                                 <rect key="frame" x="149" y="233" width="77" height="18"/>
                                 <fontDescription key="fontDescription" type="system" pointSize="15"/>
-                                <nil key="textColor"/>
+                                <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
                                 <nil key="highlightedColor"/>
                             </label>
                         </subviews>
-                        <color key="backgroundColor" red="0.93725490570000003" green="0.93725490570000003" blue="0.95686274770000002" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" cocoaTouchSystemColor="groupTableViewBackgroundColor"/>
                         <constraints>
                             <constraint firstItem="ekS-Ew-GpT" firstAttribute="top" secondItem="P6k-pN-VEP" secondAttribute="bottom" constant="22" id="H7u-LC-n82"/>
                             <constraint firstItem="ekS-Ew-GpT" firstAttribute="top" secondItem="6e0-Am-MUv" secondAttribute="bottom" constant="90" id="HQQ-Ne-ux5"/>
diff --git a/KWVerificationCodeView/Classes/KWTextFieldView.swift b/KWVerificationCodeView/Classes/KWTextFieldView.swift
@@ -25,7 +25,49 @@ protocol KWTextFieldDelegate: class {
       underlineView.backgroundColor = underlineColor
     }
   }
-  @IBInspectable var underlineSelectedColor: UIColor = UIColor.blue
+  @IBInspectable var underlineSelectedColor: UIColor = UIColor.black
+  @IBInspectable var textColor: UIColor = UIColor.darkText {
+    didSet {
+      numberTextField.textColor = textColor
+    }
+  }
+  @IBInspectable var textSize: CGFloat = 24.0 {
+    didSet {
+      numberTextField.font = UIFont.systemFont(ofSize: textSize)
+    }
+  }
+  @IBInspectable var textFont: String = "" {
+    didSet {
+      if textFont.trim() == "" {
+        numberTextField.font = UIFont.systemFont(ofSize: textSize)
+      } else {
+        if let font = UIFont(name: textFont, size: textSize) {
+          numberTextField.font = font
+        } else {
+          numberTextField.font = UIFont.systemFont(ofSize: textSize)
+        }
+      }
+    }
+  }
+  @IBInspectable var textFieldBackgroundColor: UIColor = UIColor.clear {
+    didSet {
+      numberTextField.backgroundColor = textFieldBackgroundColor
+    }
+  }
+  @IBInspectable var textFieldTintColor: UIColor = UIColor.blue {
+    didSet {
+      numberTextField.tintColor = textFieldTintColor
+    }
+  }
+  @IBInspectable var darkKeyboard: Bool = false {
+    didSet {
+      if darkKeyboard {
+        numberTextField.keyboardAppearance = .dark
+      } else {
+        numberTextField.keyboardAppearance = .light
+      }
+    }
+  }
   
   // MARK: - IBOutlets
   @IBOutlet weak var numberTextField: UITextField!
diff --git a/KWVerificationCodeView/Classes/KWTextFieldView.xib b/KWVerificationCodeView/Classes/KWTextFieldView.xib
@@ -20,17 +20,17 @@
             <rect key="frame" x="0.0" y="0.0" width="50" height="50"/>
             <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
             <subviews>
-                <textField opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" textAlignment="center" minimumFontSize="17" translatesAutoresizingMaskIntoConstraints="NO" id="uky-3e-m7A" userLabel="numberTextField">
+                <textField clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" textAlignment="center" minimumFontSize="17" translatesAutoresizingMaskIntoConstraints="NO" id="uky-3e-m7A" userLabel="numberTextField">
                     <rect key="frame" x="0.0" y="0.0" width="50" height="48"/>
                     <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
-                    <color key="tintColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
+                    <color key="tintColor" red="0.0" green="0.0" blue="1" alpha="1" colorSpace="calibratedRGB"/>
                     <nil key="textColor"/>
                     <fontDescription key="fontDescription" type="system" pointSize="24"/>
                     <textInputTraits key="textInputTraits" keyboardType="numberPad"/>
                 </textField>
                 <view userInteractionEnabled="NO" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="eC6-EU-k8d" userLabel="underlineView">
                     <rect key="frame" x="0.0" y="39" width="50" height="1"/>
-                    <color key="backgroundColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                    <color key="backgroundColor" white="0.33333333333333331" alpha="1" colorSpace="calibratedWhite"/>
                     <constraints>
                         <constraint firstAttribute="height" constant="1" id="pFW-zo-tEa"/>
                     </constraints>
diff --git a/KWVerificationCodeView/Classes/KWVerificationCodeView.swift b/KWVerificationCodeView/Classes/KWVerificationCodeView.swift
@@ -25,21 +25,81 @@ public protocol KWVerificationCodeViewDelegate: class {
       }
     }
   }
-  @IBInspectable var underlineSelectedColor: UIColor = UIColor.blue {
+  @IBInspectable var underlineSelectedColor: UIColor = UIColor.black {
     didSet {
       for textFieldView in textFieldViews {
         textFieldView.underlineSelectedColor = underlineSelectedColor
       }
     }
   }
-  
-  // MARK: - IBOutlets
+  @IBInspectable var textColor: UIColor = UIColor.darkText {
+    didSet {
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.textColor = textColor
+      }
+    }
+  }
+  @IBInspectable var textSize: CGFloat = 24.0 {
+    didSet {
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.font = UIFont.systemFont(ofSize: textSize)
+      }
+    }
+  }
+  @IBInspectable var textFont: String = "" {
+    didSet {
+      if textFont.trim() == "" {
+        textFieldFont = UIFont.systemFont(ofSize: textSize)
+      } else {
+        if let font = UIFont(name: textFont.trim(), size: textSize) {
+          textFieldFont = font
+        } else {
+          textFieldFont = UIFont.systemFont(ofSize: textSize)
+        }
+      }
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.font = textFieldFont
+      }
+    }
+  }
+  @IBInspectable var textFieldBackgroundColor: UIColor = UIColor.clear {
+    didSet {
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.backgroundColor = textFieldBackgroundColor
+      }
+    }
+  }
+  @IBInspectable var textFieldTintColor: UIColor = UIColor.blue {
+    didSet {
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.tintColor = textFieldTintColor
+      }
+    }
+  }
+  @IBInspectable var darkKeyboard: Bool = false {
+    didSet {
+      if darkKeyboard {
+        keyboardColor = .dark
+      } else {
+       keyboardColor = .light
+      }
+      
+      for textFieldView in textFieldViews {
+        textFieldView.numberTextField.keyboardAppearance = keyboardColor
+      }
+    }
+  }
+
+    // MARK: - IBOutlets
   @IBOutlet weak private var textFieldView1: KWTextFieldView!
   @IBOutlet weak private var textFieldView2: KWTextFieldView!
   @IBOutlet weak private var textFieldView3: KWTextFieldView!
   @IBOutlet weak private var textFieldView4: KWTextFieldView!
   
   // MARK: - Variables
+  private var keyboardColor = UIKeyboardAppearance.default
+  private var textFieldFont = UIFont.systemFont(ofSize: 24.0)
+  
   lazy var textFieldViews: [KWTextFieldView] = {
     [unowned self] in
     
diff --git a/KWVerificationCodeView/Classes/KWVerificationCodeView.xib b/KWVerificationCodeView/Classes/KWVerificationCodeView.xib
@@ -18,7 +18,7 @@
             </connections>
         </placeholder>
         <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
-        <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="DUS-Hj-ChZ">
+        <view userInteractionEnabled="NO" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="DUS-Hj-ChZ">
             <rect key="frame" x="0.0" y="0.0" width="375" height="62"/>
             <subviews>
                 <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="3tC-Ut-0VN" userLabel="textFieldView1" customClass="KWTextFieldView" customModule="KWVerificationCodeView">
@@ -40,27 +40,19 @@
                     <rect key="frame" x="284" y="6" width="81" height="50"/>
                     <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
                 </view>
-                <view alpha="0.050000000000000003" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Uba-Pv-jsf" userLabel="topView">
-                    <rect key="frame" x="0.0" y="0.0" width="375" height="62"/>
-                    <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
-                </view>
             </subviews>
             <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="calibratedWhite"/>
             <constraints>
                 <constraint firstItem="3tC-Ut-0VN" firstAttribute="leading" secondItem="DUS-Hj-ChZ" secondAttribute="leading" constant="10" id="0di-mx-zfw"/>
                 <constraint firstAttribute="bottom" secondItem="3tC-Ut-0VN" secondAttribute="bottom" constant="6" id="5uF-mn-LoT"/>
-                <constraint firstItem="Uba-Pv-jsf" firstAttribute="leading" secondItem="DUS-Hj-ChZ" secondAttribute="leading" id="8uT-N2-xM4"/>
                 <constraint firstItem="jRf-YT-Rjh" firstAttribute="height" secondItem="3tC-Ut-0VN" secondAttribute="height" id="Gb4-Os-cwr"/>
                 <constraint firstItem="vt9-dd-ekk" firstAttribute="top" secondItem="DUS-Hj-ChZ" secondAttribute="top" constant="6" id="Kg2-dv-3YJ"/>
                 <constraint firstItem="jRf-YT-Rjh" firstAttribute="width" secondItem="3tC-Ut-0VN" secondAttribute="width" id="U4v-Ht-Drn"/>
                 <constraint firstItem="vt9-dd-ekk" firstAttribute="width" secondItem="uqQ-2Z-1XV" secondAttribute="width" id="VK2-dB-JL0"/>
-                <constraint firstAttribute="bottom" secondItem="Uba-Pv-jsf" secondAttribute="bottom" id="VpP-Ye-4LD"/>
                 <constraint firstItem="jRf-YT-Rjh" firstAttribute="top" secondItem="DUS-Hj-ChZ" secondAttribute="top" constant="6" id="Vvq-kp-ykE"/>
                 <constraint firstAttribute="trailing" secondItem="vt9-dd-ekk" secondAttribute="trailing" constant="10" id="fPo-e5-fRn"/>
-                <constraint firstItem="Uba-Pv-jsf" firstAttribute="top" secondItem="DUS-Hj-ChZ" secondAttribute="top" id="gfu-mb-7SY"/>
                 <constraint firstItem="vt9-dd-ekk" firstAttribute="height" secondItem="uqQ-2Z-1XV" secondAttribute="height" id="jCR-aZ-KYb"/>
                 <constraint firstItem="uqQ-2Z-1XV" firstAttribute="height" secondItem="jRf-YT-Rjh" secondAttribute="height" id="nlt-Sw-o2S"/>
-                <constraint firstAttribute="trailing" secondItem="Uba-Pv-jsf" secondAttribute="trailing" id="q5B-Lv-1ay"/>
                 <constraint firstItem="uqQ-2Z-1XV" firstAttribute="leading" secondItem="jRf-YT-Rjh" secondAttribute="trailing" constant="10" id="rEH-pO-Tk3"/>
                 <constraint firstItem="uqQ-2Z-1XV" firstAttribute="width" secondItem="jRf-YT-Rjh" secondAttribute="width" id="rtg-SH-V0Y"/>
                 <constraint firstItem="vt9-dd-ekk" firstAttribute="leading" secondItem="uqQ-2Z-1XV" secondAttribute="trailing" constant="10" id="u6T-vB-S9e"/>
diff --git a/README.md b/README.md
@@ -41,7 +41,7 @@ It is possile to set the default and selected colors of the underline in the *St
 
 ### Delegate
 
-`KWVerificationCodeViewDelegate` has a method `didChangeVerificationCode()`, which you can implement to check for valid code in real time. This comes handy in stituations where you have to enable the submit button only if the verification code is valid.
+`KWVerificationCodeViewDelegate` has a method `didChangeVerificationCode()`, which you can implement to check for valid code in real time. This comes handy in situations where you have to enable the submit button only if the verification code is valid.
 
 ## Author
 
