Using Haptics

If you have an iPhone 7 or 8, you might think the home button is a physical button. If you completely shut off the phone you find it is a solid circle. What makes that click is a haptic. You can easily use haptics in your application to make buttons click or warn the user.  

I’d suggest downloading the exercise file. Haptics only work on a live phone. Take a look at the starter file. I have a simple button.

Right-click the document outline and you’ll see I made a Touch Up Inside and touch down event action for the button. 

Go to the ViewController.swift code. 

There are three types of haptics. The impact generator can be used for a collision of objects on the screen or as I use it a touch of a finger to a button for a click.  At the top of the code add this: 

let impactGenerator = UIImpactFeedbackGenerator(style: .medium)

The style gives one of three options of .light, .medium, or .heavy impact. I’ll use .medium. Impact generators need a small bit of time to get ready, so when I push down on the button, I’ll add the prepare method.

impactGenerator.prepare() //need enough time for this to get ready

Then I can use the impact occurred method to give the illusion I’m clicking down on something. 

impactGenerator.impactOccurred()
impactGenerator.impactOccurred()

When I lift up my finger I don’t feel anything, but to get the click that I’m releasing the button, I can add the impact occurred again. 

impactGenerator.impactOccurred()

To run and experience this code you’ll need a real phone. Simulators don’t do haptics, and neither do websites.  I suggest trying this yourself since this as a physical sensation or check out the video of this tip Run this and tap the switch. You get a feel like you are pushing down a button and then releasing it. 

Stop the app. At the top of the code, add a notification feedback generator. These give more complicated haptics to notify a user of an event. 

let notificationGenerator = UINotificationFeedbackGenerator()

Comment out the impactOccured in clickMeUp .

Add in clickMeUp 

notificationFeedbackGenerator.notificationOccurred(.success)

You have a few options for the type of notification:error success and warning. I’ll use a success. 

 Then run the app again. Press down and you’ll feel the impact click. Release and you’ll get a double tap for success. 

Try .error, run again.  You get a different pattern.

The third type of haptic is a selection feedback generator. It is so subtle it’s hard to demonstrate. It’s the haptic you get when spinning a picker view. 

Haptic can be used for gaming, and for physical feedback, such as alerting users not looking at their phone. Try to use them only when they are necessary, overuse confuses the user. Also, tie them to visual feedback whenever possible. With the proper uses, haptics can add to your applications a true feel. 

The Whole Code

Here’s the code for this project. You can find a download of this at GitHub here. You can also watch this lesson at LinkedIn Learning

//
//  ViewController.swift
//  Haptics demo
//
//  An exercise file for iOS Development Tips Weekly
//  by Steven Lipton (C)2018, All rights reserved
//  For videos go to http://bit.ly/TipsLinkedInLearning
//  For code go to http://bit.ly/AppPieGithub
//

import UIKit

class ViewController: UIViewController {
    let impactGenerator = UIImpactFeedbackGenerator(style: .medium)
    let notificationGenerator = UINotificationFeedbackGenerator()
    @IBAction func clickMeDown(_ sender: UIButton) {
        impactGenerator.prepare()
        impactGenerator.impactOccurred()
    }
    
   
    @IBAction func clickMeUp(_ sender: UIButton) {
        //impactGenerator.impactOccurred()
        notificationGenerator.notificationOccurred(.error)
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }


}

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: