UIKit Dynamics Tutorial: Getting Started

Learn how to make your user interfaces in iOS feel realistic with this UIKit Dynamics tutorial, updated for Swift! By James Frost.

Leave a rating/review
Save for later
Share
You are currently viewing page 4 of 4 of this article. Click here to view the first page.

User Interaction

As you’ve just seen, you can dynamically add and remove behaviours when your physics system is already in motion. In this final section, you’ll add another type of dynamics behaviour, UISnapBehavior, whenever the user taps the screen. A UISnapBehavior makes an object jump to a specified position with a bouncy spring-like animation.

Remove the code that you added in the last section: both the firstContact property and the if statement in collisionBehavior(). It’s easier to see the effect of the UISnapBehavior with only one square on screen.

Add two properties above viewDidLoad:

var square: UIView!
var snap: UISnapBehavior!

This will keep track of your square view, so that you can access it from elsewhere in the view controller. You’ll be using the snap object next.

In viewDidLoad, remove the let keyword from the declaration of the square, so that it uses the new property instead of a local variable:

square = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))

Finally, add an implementation for touchesEnded, to create and add a new snap behavior whenever the user touches the screen:

override func touchesEnded(touches: NSSet, withEvent event: UIEvent) {
  if (snap != nil) {
    animator.removeBehavior(snap)
  }

  let touch = touches.anyObject() as UITouch 
  snap = UISnapBehavior(item: square, snapToPoint: touch.locationInView(view))
  animator.addBehavior(snap)
}

This code is quite straightforward. First, it checks if there’s an existing snap behavior and removes it. Then creates a new snap behavior which snaps the square to the location of the user’s touch, and adds it to the animator.

Build and run your app. Try tapping around; the square should zoom into place wherever you touch!

Where To Go From Here?

At this point you should have a solid understanding of the core concepts of UIKit Dynamics. You can download the final DynamicsDemo project from this tutorial for further study.

UIKit Dynamics brings the power of a physics engine to your iOS apps. With subtle bounces and springs and gravity, you can bring life to your apps and make them feel more real and immersive for your users.

If you’re interested in learning more about UIKit Dynamics, check out our book iOS 7 By Tutorials. The book takes what you’ve learned so far and goes a step further, showing you how to apply UIKit Dynamics in an real world scenario:

SandwichFlowDynamics

The user can pull up on a recipe to take a peek at it, and when they release the recipe, it will either drop back into the stack, or dock to the top of the screen. The end result is an application with a real-world physical feel.

I hope you enjoyed this UIKit Dynamics tutorial – we think it’s pretty cool and look forward to seeing the creative ways you use it in your apps. If you have any questions or comments, please join the forum discussion below!

James Frost

Contributors

James Frost

Author

Over 300 content creators. Join our team.