Skip to content

Instantly share code, notes, and snippets.

@KalpeshTalkar
Last active July 20, 2021 14:13
Show Gist options
  • Save KalpeshTalkar/0ec476fd56de0c8caebc000ea4f17247 to your computer and use it in GitHub Desktop.
Save KalpeshTalkar/0ec476fd56de0c8caebc000ea4f17247 to your computer and use it in GitHub Desktop.
Custom IBDesignable text field written in Swift 3
// Copyright © 2017 Kalpesh Talkar. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
//
// For support: https://gist.github.com/KalpeshTalkar/0ec476fd56de0c8caebc000ea4f17247
//
import UIKit
@IBDesignable
public class KTextField: UITextField {
// MARK: - IBInspectable properties
/// Applies border to the text view with the specified width
@IBInspectable public var borderWidth: CGFloat = 0.0 {
didSet {
layer.borderWidth = borderWidth
layer.borderColor = borderColor.cgColor
}
}
/// Sets the color of the border
@IBInspectable public var borderColor: UIColor = .clear {
didSet {
layer.borderColor = borderColor.cgColor
}
}
/// Make the corners rounded with the specified radius
@IBInspectable public var cornerRadius: CGFloat = 0.0 {
didSet {
layer.cornerRadius = cornerRadius
}
}
/// Applies underline to the text view with the specified width
@IBInspectable public var underLineWidth: CGFloat = 0.0 {
didSet {
updateUnderLineFrame()
}
}
/// Sets the underline color
@IBInspectable public var underLineColor: UIColor = .groupTableViewBackground {
didSet {
updateUnderLineUI()
}
}
/// Sets the placeholder color
@IBInspectable public var placeholderColor: UIColor = .lightGray {
didSet {
let placeholderStr = placeholder ?? ""
attributedPlaceholder = NSAttributedString(string: placeholderStr, attributes: [NSForegroundColorAttributeName: placeholderColor])
}
}
public override var placeholder: String? {
didSet {
let placeholderStr = placeholder ?? ""
attributedPlaceholder = NSAttributedString(string: placeholderStr, attributes: [NSForegroundColorAttributeName: placeholderColor])
}
}
/// Sets left margin
@IBInspectable public var leftMargin: CGFloat = 10.0 {
didSet {
setMargins()
}
}
/// Sets right margin
@IBInspectable public var rightMargin: CGFloat = 10.0 {
didSet {
setMargins()
}
}
// MARK: - init methods
override public init(frame: CGRect) {
super.init(frame: frame)
applyStyles()
}
required public init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
applyStyles()
}
// MARK: - Layout
override public func layoutSubviews() {
super.layoutSubviews()
updateUnderLineFrame()
updateAccessoryViewFrame()
}
// MARK: - Styles
private func applyStyles() {
applyUnderLine()
setMargins()
}
// MARK: - Underline
private var underLineLayer = CALayer()
private func applyUnderLine() {
// Apply underline only if the text view's has no borders
if borderStyle == UITextBorderStyle.none {
underLineLayer.removeFromSuperlayer()
updateUnderLineFrame()
updateUnderLineUI()
layer.addSublayer(underLineLayer)
layer.masksToBounds = true
}
}
private func updateUnderLineFrame() {
var rect = bounds
rect.origin.y = bounds.height - underLineWidth
rect.size.height = underLineWidth
underLineLayer.frame = rect
}
private func updateUnderLineUI() {
underLineLayer.backgroundColor = underLineColor.cgColor
}
// MARK: - Margins
private var leftAcessoryView = UIView()
private var rightAcessoryView = UIView()
private func setMargins() {
// Left Margin
leftView = nil
leftViewMode = .never
if leftMargin > 0 {
if nil == leftView {
leftAcessoryView.backgroundColor = .clear
leftView = leftAcessoryView
leftViewMode = .always
}
}
updateAccessoryViewFrame()
// Right Margin
rightView = nil
rightViewMode = .never
if rightMargin > 0 {
if nil == rightView {
rightAcessoryView.backgroundColor = .clear
rightView = rightAcessoryView
rightViewMode = .always
}
updateAccessoryViewFrame()
}
}
private func updateAccessoryViewFrame() {
// Left View Frame
var leftRect = bounds
leftRect.size.width = leftMargin
leftAcessoryView.frame = leftRect
// Right View Frame
var rightRect = bounds
rightRect.size.width = rightMargin
rightAcessoryView.frame = rightRect
}
}
@Nishadarora
Copy link

And if I want to change the textField contentType

@KalpeshTalkar
Copy link
Author

And if I want to change the textField contentType

Hey @Nishadarora,
KTextField inherits from UITextField so you can use the following:

textField.textContentType = UITextContentType.emailAddress // Set content type as email
textField.keyboardType = UIKeyboardType.emailAddress // Set keyboard type as email

Let me know if you are facing any issues with this.

Thanks.

@Nishadarora
Copy link

oh ok!
ty so much

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment