iOS 7 Option Screens for UIView or Sprite Kit Based Apps
5.0 (9 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
376 students enrolled
Wishlisted Wishlist

Please confirm that you want to add iOS 7 Option Screens for UIView or Sprite Kit Based Apps to your Wishlist.

Add to Wishlist

iOS 7 Option Screens for UIView or Sprite Kit Based Apps

Learn how to make incredible looking Option menus for any iOS 7 project. Games or App, Sprite Kit or UIView-based.
5.0 (9 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
376 students enrolled
Created by Justin Dike
Last updated 3/2014
English
Current price: $10 Original price: $20 Discount: 50% off
5 hours left at this price!
30-Day Money-Back Guarantee
Includes:
  • 4.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
What Will I Learn?
  • Create a fully functioning option or preferences screen for an iOS app.
View Curriculum
Requirements
  • Mac with Xcode 5 or higher
Description

In this tutorial, we will focus entirely on creating an Options or Preferences screen, using a Single View Application (or UIView based project) or Sprite Kit based project. We'll create UISwitches, UIButtons, UISliders, UISegmentedControls (and groups of buttons that act like segmented controls), and finally, a UIPickerView. Picker views can be made up of single or multiple columns of "spin-able" data (for example, Apple's Clock app has a Timer function made up of a double column UIPickerView).

In our hypothetical project we will create a 3-column picker view which populates itself using data from a Property List file. This data is split into a column for the level name ("Ocean, Bad Lands, etc"), a column for the mode of game play ("Kill X" number of enemies, "Collect X" number of coins, or "Beat the Clock") and third column for a number parameter to tweak the difficulty of each game mode (for example, you could add more time to the "Beat the Clock" mode or add more enemies to kill). We will make the wheels interconnected as well. So if you spin the first wheel to set the level, it will change the other two wheels to default to the settings defined in the Property List for the level. If you spin the middle wheel to change the game mode, it will automatically change the third wheel to use a different range of numbers (one mode of play might be best with a small range like 1-15, but another might work better in increments of ten, like 60-300).

All of our data is stored in a singleton AppData class, which serves as a go-between to use (or test) our preference variables with any other class. You'll see how to test any changes made in the OptionScreen class with the main game / app class.

The source projects are saved in increments throughout the tutorial series, and uploaded in the Supplemental Materials tab at notable breakpoints. You'll get both UIView and Sprite Kit based projects. The images to use are included as well.

Who is the target audience?
  • Anyone already developing an iOS app or planning to.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
20 Lectures
04:43:51
+
Introduction and Initial Setup
6 Lectures 01:28:34

In this video, we'll create a singleton class to store values which we will pass back and forth between the main app's class (or game engine) and the options screen.

Preview 09:33

In this tutorial we will create the OptionScreen class to be used with either a UIView class called MainGame or with a Sprite Kit based class. We'll test the classes with simple NSLog statements, in both projects.

Preview 13:59

In this video we will create a UIButton to launch the OptionScreen from either a UIView project or Sprite Kit project. We will look at positioning and sizing the button differently based on the device. And we will also format the title of the button using a UIFont.

Preview 19:12

In this vide we will finally show something in our Options Screen. To have a bit of fun, we will make the screen open overtop the main app (or game class) at about 95% of the device's height and width, leaving a border around the Option Screen to the class below. Then we will test using the touchesBegan method to see if the user touches outside of that border, if so we return to whatever class opened the Options Screen.

Opening and Closing the Options Screen
21:54

This optional lesson teaches how to use a repeating NSTimer or SKAction (in the Sprite Kit project) to fade in a tinted background behind the Options Class. We'll do this using a UIView with the backgroundColor set to black, and changing the alpha value over time.

NSTimer / SKAction for Fading and Tinting
20:30
+
UISwitches, UISliders, UISegmented Controls and More
4 Lectures 01:00:17

In this tutorial, we will add two UISwitches to the Options Screen. These are simple toggles (off or on) which could be used to mute sound FX or set another preference between two settings. We will save the values of these switches in the AppData singleton so whenever the Option Screen is opened it initializes using the last settings saved.

UISwitches
19:14

In this video, we will set up a UISlider, this could be used to fine tune a setting in the game (for example, "slide to adjust the rate of acceleration in a plane game"). The minimum and maximum range can be any number (1 to 10, or 50 to 10,000), whatever works best for your needs. Again we will save the value of the slider to the AppData class so when the Options Screen is opened next, the slider is set back to the same value.

UISliders
17:17

In this video, we will go over creating a UISegmentedControl. This style won't exactly "gel" with our project's look, but we will create a similar button group in the next video.

UISegmentedControls
05:50

In this video, we will create a group of UIButtons to select a hypothetical weapon to use. Turning one button on, will turn off the other buttons, similar to a UISegmentedControl group. As usual we will save this data to the AppData class.

The projects at the end of this Session have been uploaded to the Supplemental Materials tab.

UIButton Groups
17:56
+
The UIPickerView
8 Lectures 01:55:31
Introduction
01:25

In this tutorial, we will create a basic single column UIPickerView.

UIPickerView with a Single Component Wheel
24:18

In this tutorial, we will create a Property List to store data for our three wheel UIPickerView.

Using a Property List to Populate the UIPickerView
13:31

In this tutorial, we will switch the UIPickerView to use three component wheels, then populate it with data from Property List.

Switching to Three Component Wheels
18:41

This tutorial will finish off the first version of our UIPickerView by setting default values when spinning the Level wheel (the first wheel). So whatever settings are specified in the property list file, will get spun to automatically when changing the first wheel. In this version, wheel 1 (the Level Names) and wheel 2 (the Level's type of Game Play) are locked together (the next version will change this).

Spinning to Default Values Based on the Property List
21:21

In this version we will polish off the UIPickerView and make it so the middle wheel only has three values (each mode of play is only listed once), and this wheel can also be set independent of the first wheel. In the previous version these two wheels would always spin to the same row.

Interconnected and Independent Wheels
14:47

In this video we will complete the polished version of the UIPickerView and test for any changes to the picker in the main class.

Testing from the Main Class for a Change in the UIPickerView
19:10

In this video we add a Return to Game button (in case it wasn't obvious that tapping outside the frame of the OptionScreen would go back to the game).

Return to Game Button
02:18
+
NSUserDefaults and NSNotifications
2 Lectures 19:29

In this video, we will save our variables to the standard NSUserDefaults, and use them to retain those same preferences even if the app is closed and restarted.

NSUserDefaults
10:48

In this tutorial, we will quickly look at NSNotifications as an alternate means of alerting classes to a preference change (and passing NSObjects between classes via the notification).

The finished project has been uploaded to the Supplemental Materials tab.

NSNotifications
08:41
About the Instructor
Justin Dike
4.3 Average rating
602 Reviews
41,502 Students
24 Courses
CartoonSmart / Owner / Leader Developer and Instructor

Justin Dike is the founder of CartoonSmart one of the internet's first video training websites. He is a long-time illustrator and animator, focusing mostly on Adobe Flash, and experienced programmer with Swift, Sprite Kit, Actionscript 3, Objective C and Cocos2d. For CartoonSmart he has recorded hundreds of hours of video tutorials and recently published his first full length book titled iOS Programming with Xcode and Cocos2d available in the iBookstore. Justin has also developed many iOS games, including a side scrolling game engine.