Your project today will animate text and images. Your app will scatter the letters of the word "Lambda" by animating the letters to random locations.

After completing the lesson material and this project, you'll be able to animate a number of UIView and CALayer properties.

Preview the scatter animation

Follow these steps to set up your project skeleton:

1. Create a new Single View iOS Xcode project
2. In the "Main.storyboard", embed a view controller in a navigation controller (be sure to set the initial view controller arrow)

These steps enable you to run your animation with a single tap:

1. Add a bar button item to your view controller's navigation bar (right side).
2. Name the button "Toggle"
3. Connect an IBAction to your view controller: toggleButtonPressed(_:).
4. Create a Bool property variable called isScattered that you can toggle true and false.

You'll animate your views to either scatter them (explore outwards) or gather them together (reset to default position) when the Toggle button is tapped. The boolean variable will help you know what state you're in (scattered or gathered).

Build the UI elements you want to animate (either programmatically or in Interface Builder).

1. You need six labels (one for each letter of Lambda)
2. You need one image view for the Lambda logo. (Look for the logo file in this repo)

Create IBOutlet's for these views in your view controller so they can be animated by your toggleButtonPressed(_:) method.

Scatter Animation:

• Fade out your logo image view (the logo should disappear over the length of the animation)
• Move your letters to random locations (read the random Int API below)
• Assign them a random background color and text color
• Use a custom transform to rotate the views (letter.transform = CGAffineTransform(rotationAngle: random_angle)
• Incorporate as many other custom animations as you like
• Your animation should take between 2 and 4 seconds

Gather Animation

• Fade in your logo view (it should gradually reappear as the gather animation runs)
• Reset all the custom properties you previously assigned to the letters (they should appear as they did at the start of the app)
• Animate the letters back to their starting positions

Here are some stretch goals to investigate:

• Add 3D transforms to your layers instead of a 2D rotation.
• Animate shadows onto and away from your views.
• Add keyframe sequences to perform multiple tasks when scattering your views.
• Chain together animations
• Add a UIPanGestureRecognizer to move around the Lambda logo

Here are some helpful resources for your project:

• UIView reference (Xcode, also this Apple Doc article. See the Animations section for a list of animatable properties.
• CALayer animatable properties
• Core animation
• Affine Transforms in iOS:
  • see Xcode docs for CGAffineTransform and CATransform3D, Quartz 2D
  • Wolfram
  • Wikipedia
  • University of Texas
• Random numbers with Swift's random(in:) function for Int
  • You will want to cast the Int into a CGFloat to create CGPoint positions.
• UIPanGestureRecognizer Reference
  • Read Handling UIKit Gestures