Let’s see how we would make this text field in Swift
First create a UITextField subclass. I called mine UnderlinedTextField and annotated it as @IBDesignable. Now create a few properties.
These are annotated as @IBInspectable so they can be set in interface builder. We also need a property of hasError, which when set changes the colour of the text field:
When this property is set, we set the colour of our placeholderView. This is just a UILabel that we add and we animate it up when the user starts typing. Then if hasError is true, the text colour turns red and the view redraws to turn the underline colour to red. If it’s set again and is true again, the label will shake using a CAKeyframeAnimation.
Now we just override draw(_ rect: CGRect) and setup the placeholderView in didMoveToWindow(). That’s it, in about 100 lines of code. You can grab everything down below to look at in a bit more detail.