Useful UITextField Extensions

One of the side projects I’m working on is very frontend focused and after spending a lot of time on my designs, I really wanted to give my app a custom look and feel. As a result, I had of modify a lot of UI elements to fit my specific purposes.
Here is an extension for a UITextField that gives two functionalities. The first is a text field with just a bottom border (think material design). The second adds a done button to the keyboard like so:

It’s very useful for the number pad input which doesn’t the native “Done,” “Return,” etc. buttons on the keyboard itself.

extension UITextField {

    // Set border to none in Storyboard and then call this function to add just a bottom border
    func addBottomBorder() {
        let bottomBorder = CALayer()
        let width = CGFloat(1.0) // Border width
        bottomBorder.borderColor = Colors.red.cgColor // Border color
        bottomBorder.frame = CGRect(x: 0, y: self.frame.size.height - width, width:  self.frame.size.width, height: self.frame.size.height) // Frame

        bottomBorder.borderWidth = width // Apply border width
        self.layer.addSublayer(bottomBorder) // Add to text field
        self.layer.masksToBounds = true
    }

    // Add done button to number keyboard
    // Source: https://gist.github.com/jplazcano87/8b5d3bc89c3578e45c3e
    func addDoneButtonOnKeyboard() {
        let doneToolbar: UIToolbar = UIToolbar(frame: CGRect(x: 0, y: 0, width: 320, height: 50)) // Create keyboard toolbar
        doneToolbar.barStyle = .default // Set style

        let blankFlexSpace: UIBarButtonItem = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil) // Add blank spacing item to left of done button
        let doneButton: UIBarButtonItem = UIBarButtonItem(title: "Done", style: .done, target: self, action: #selector(self.doneButtonAction)) // Add done button

        doneToolbar.items = [blankFlexSpace, doneButton] // Create array of the items and add to toolbar
        doneToolbar.sizeToFit() // Fit to screen size

        self.inputAccessoryView = doneToolbar // Add toolbar to keyboard

    }

    // Function called when done button pressed
    // Put manually put under action
    func doneButtonAction() {
        self.resignFirstResponder() // Desselect
    }

    // MARK - End of adding done button to number pad

}

One of the things on my bucket list is to build and publish my own libraries. This would not only improve my own development and production speed, but also give you tools/UI tweaks that you might find useful. I don’t typically use libraries in my projects, but I do see their benefit. Because I’m focusing on the learning right now, I’ve been building my own “libraries” from scratch as a teaching tool for myself. Hopefully I can push one of those out to you all soon!

Force Touch Shortcuts

First you must setup your Info.plist file to give your app permission to use Force Touch app shortcuts. Here is a useful tutorial for doing just that: developer.apple.com

// Launch a specific screen as initial VC
private func launchInitialVC(viewController identifier: String) {
    self.window = UIWindow(frame: UIScreen.main.bounds)
    let storyboard = UIStoryboard(name: "Main", bundle: nil)
    let initialViewController = storyboard.instantiateInitialViewController() as! UINavigationController
    self.window?.rootViewController = initialViewController
    self.window?.makeKeyAndVisible()

    // Perform required segues and navigations
    if (identifier == Storyboard.editEventDetails) { // If launching edit details screen
        initialViewController.pushViewController(storyboard.instantiateViewController(withIdentifier: Storyboard.categorySelection), animated: false)
        let categorySelection = initialViewController.topViewController as! CategorySelection
        categorySelection.newEventNoCategory(self)
    }
}

Here are some other useful tools for giving your app Force Touch capabilities:
Useful tutorial: http://samwize.com/2016/04/25/tutorial-on-creating-app-shortcut-with-3d-touch/
Design guidelines on shortcut icons: https://developer.apple.com/reference/uikit/uiapplicationshortcuticontype

Hope this was useful! Sorry my blog posts have been fairly minimal in writing. I haven’t had a lot of time this semester because of my heightened work load. Hope I’ll catch a break soon so I can put some more time and thought into my pieces. Thanks!

Posted in iOS Development with Swift, Tutorial