iOS7 > Lesson #7 - Simple Animation

Background

In this lesson, you can learn:

• UIImageView object
• NSMutableArray

In iOS, creating sophisticated animations does not require you to write a complex code. All you need to do is to create an UIImageView object with a series of images for animating. Once you trigger the animation, the image view will automatically render the individual frames.

---

Step#1: To create a new Xcode project - Animation

1. Create a new Xcode project

2. Select "Single View Application" from iOS Application template and then click "Next".

3. Fill in the options for your new project as below and save this new project into Documents:

4. Copy all .png images inside the group "Supporting Files". (Here has a bit difference between Xcode 4.x and Xcode 5)

Click for copying items and then click "Finish" button.

---

Step#2: To setup a new UIImageView object

Follow the Lesson #6 - Practice on Action and Message to setup a new UI object.

<Step #1 - .h file>1. In the project navigator, click "xxxViewController.h" and edit the code like this in order to declare a new UIImageView object:

---

<Step #2 - .m file>
2. Then, click "xxxViewController.m" and edit the code for "@synthesize" the UIImageView object and "the "viewDidLoad" like this:

Notes: 

• Create an array myImages to store all images as frames.
• You can control the frame rate by setting the animationDuration property. The property specifies the amount of time it takes to go through one cycle of the images. For example, it takes 0.5 second to go through all images. 
• Remove the code with @interface ... @end first in xxxViewController.m first.

---

<Step #3a - Storyboard file>
In tab "Connections", drag the "Image View", "Tool Bar", "Round Rec Button" object.

---

<Step #3b - Storyboard file>
In tab "Connections", click the yellow button (i.e. View Controller) at the bottom and then drag the "myAnimatedView" to the "Image View" object in View to do connection.

---

<Step #4 - Compile & Run>

Finished, that's all ~!

---

Reference

• iOS Programming 101: Simple Animation Using UIImageView

         http://www.appcoda.com/ios-programming-animation-uiimageview/