Chapter 10. Image Compression and Animation

When Apple released the original watchOS, the WatchKit platform provided you with a one-way solution to perform your own animations by flipping through each of the image frames. Now, with the release of watchOS 2, this software update provides you with an additional animation API that you can use to animate your images using the animateWithDuration method.

The WatchKit framework provides you with the WKInterfaceImage interface object class that you can add to your WatchKit app storyboard. You should consider using images that are in either the PNG or JPEG formats. Apple suggests that you should avoid using file formats other than PNG or JPEG as they may have an impact on performance when they are rendered to the WatchKit interface, and you need to take into consideration the size of these images, especially when working with large image files.

In this chapter, you will learn how to build a simple application that will showcase how to animate a series...

Building the animation application – WatchKit

In this section, we will look at how we can go about designing our user interface for our Animation Example application. We will begin by developing the WatchKit portion of our application.

Before we proceed, we need to create our AnimationExample project, which is very simple to create using Xcode. Simply follow these steps:

1. Launch Xcode from the /Applications folder.

2. Choose Create a new Xcode project or go to File | New Project.

   

3. Select iOS App with WatchKit App from the list of available templates under the watchOS section, as shown in the following screenshot:

   

4. Click on the Next button to proceed to the next step in the wizard.

5. Next, enter AnimationExample as the name for your project.

6. Select Swift from the Language drop-down menu.

7. Then, select iPhone from the Devices drop-down menu.

8. Ensure that the Include Notification Scene checkbox is selected.

9. Click on the Next button to proceed to the next step in the wizard.

   

   Note

   The Organization Identifier input...

Summary

In this chapter, you learned how to download an image from an external website, extract the animation frames from the ZIP file, and then add them to the image assets catalog. You learned about the App Transport Security protocol that Apple introduced with the release of iOS 9 to enforce developers to provide secure connections between your Apple Watch apps and iOS apps that communicate over HTTPS, and learned how to properly configure our Apple WatchKit extension to allow our app to download images from external websites.

In our next step, we discussed Outlets and how we can connect and bind them to control objects within the Interface Builder canvas and then moved on to learning about creating Action events to our control elements that will be able to respond to user actions when tapped. To end the chapter, we moved on to discussing how to correctly animate an image within the WatchKit interface by cycling through each of the extracted frames and using the startAnimatingWithImagesInRange...