Tutorial: Getting Started with iOS 7

17 September 2013

Tutorial: Getting Started with iOS 7

At the keynote Apple event on September 10, 2013, the company not only unveiled their newest iPhones, but they formally announced iOS 7, the latest version of the operating system which drives all Apple mobile devices. It’s scheduled to roll out to the public on Wednesday, September 18 (tomorrow!) and it brings with it a few things that Corona developers should be aware of.

First and foremost, your existing iOS 6.1 and earlier apps should run without any problems. There are, however, a few things that your Corona-built apps must have to behave properly on iOS 7.

App Icons

In iOS 7, Apple has added a few new icon sizes, effectively increased by a few pixels in each of the core usage cases. Of course, you should still support iOS 6.1 and earlier, so the previous icon sizes remain valid and necessary. The questions that arise in regards to iOS icons include:

• What size(s) are the required icon image files?
• How must I name these icon image files?
• Does each icon image file need to be named exactly and specifically?
• Do they have to be listed in the build.settings file, and if so, where?

Let’s answer these questions now. Since iOS 3.2, Apple has used a plist in the bundle information called CFBundleIconFiles. This is an array of strings equating to the names of the icons used in your app. For the most part, the naming scheme is fairly flexible, which creates some confusion about exactly how the icons should be named.

To keep this simple for Corona developers, you need to add 4 new required icons and 2 new  recommended icons, for a total of 6 new image files. Remember to place these files inside your core project folder, not inside a subfolder.

To minimize changes in your code, we recommend keeping the existing icon file names that you use today, then simply add these new ones to the mix. Your new build.settings file would then contain:

Please refer to our Project Build Settings guide for a complete list of the required icon sizes. Many of you may not be including the smaller settings/spotlight search icons.

NOTE: Although this is an iOS-related post, we’ve also added a quick Android update as of Daily Build #1206. Specifically, the new Android xxhdpi.png icon is now supported in Corona, so you should include it if you’re publishing to Android. This new icon size is 144×144 pixels in size — conveniently the same as the iOS [email protected] file.

Styling Apps For iOS 7

Perhaps the biggest change in iOS 7 is a completely new look and feel. Apple has “flattened” the interface considerably, steering away from that “real world” look known as skeuomorphic. In other words, buttons don’t need to look like physical buttons to be functional. If you’re a fan of skeuomorphic designs, like a compass app that looks like an actual compass, iOS 7 may not appeal to you visually. However, for those who hate skeuomorphic design (a calendar app doesn’t really need a “spiral binding” after all), Apple has sided with the “less UI is more” team.

In the world of games, this is probably going to have very little impact on your development. However, in the business and utility world, there is a strong, industry-wide movement to flatten designs and move away from skeuomorphism.

For developers using Corona’s current widget library, set to the default iOS theme, you know that the widgets resemble the native widgets in iOS 6.1 and earlier. Now, for those who are eager to begin styling their apps for iOS 7, we have added an iOS 7 widget theme as of Daily Build #1206. To use it, simply include this line of code after you require the widget library:

One current exception is the picker wheel widget. Native iOS 7 uses some 2.5D visualizations wherein the top and bottom of the wheel is skewed slightly to provide a sense of depth. We’ll add this to the Corona picker wheel widget when Graphics 2.0 is officially released, but for now your picker wheels will appear flat.

Fonts

The new font for iOS 7, in most cases, is Helvetica Neue Light. If you want to build apps that match iOS 7 in typography, you’ll probably want to use this font as well, for example:

Fortunately, this font is included in both iOS 6 and iOS 7, as well as on OS X. If you want a bolder version, just use “HelveticaNeue”. If you need a template for iOS 7 imagery, an Adobe Photoshop PSD of graphical elements is located here — just make sure that you read and understand the legal usage terms that accompany this download. Finally, a good article that describes Apple’s requirements and recommendations is located here.

Building for iOS 7

Public Build #1202 can only build for iOS 6.1 and earlier, but Daily Builds after that have an additional dialog option called iOS SDK which we include at any time there are two versions of the iOS SDK to build for. As of Daily Build #1203, choosing iOS 7 will build against the “iOS 7 Gold Master seed.” This means that you can submit builds to Apple using this option. Daily Build #1203 – #1206 lists this as a “Beta” but it is the GM seed, not one of the Beta versions.

While we are using the iOS 7 GM seed SDK, it’s still in testing mode. We are working out the last few details before we enable app submission against the iOS 7 target. However, you should be testing against it, and there are a few other software requirements before you can do so:

1. Building for iOS 7 requires XCode 5. Apple made XCode 5 available today in the Mac App Store as a free download. This will install over top of your existing Xcode 4.x installation.
2. You must be running OS-X Mountain Lion (10.8) or later to run XCode 5.

If you have been running the XCode 5 developer preview, but you need to revert back to building with 4.x or if you want to use the XCode 5 GM Seed, you’ll need to specify so using the following command line (Terminal) command:

In Summary

iOS 7 brings a fresh new look to iOS, while at the same time introducing many new features and UI improvements. As a Corona developer, you can build for iOS 7 now and begin implementing the new widget theme as well. Get started today by downloading Daily Build #1206, available to Corona SDK Pro subscribers.