Multi-level navigation-based apps

This post will teach you how to reliably and consistently create a high-quality multi-level navigation-based app.

.

This post was most recently updated in October 2011.

.

The “Nav SCS” example app

Our next navigation-based example app, “Nav SCS”, uses multiple levels of table views, as well as standard view controllers, in the navigation stack.

The root view displays a list of selected Seneca School of Computer Studies certificate, diploma, and degree program codes.

When the user taps on a program code, the next-level table view slides onto the screen, showing the first year of course codes in the program. In the example below, BSD was tapped. Then, when a user taps a course code, the next-level standard view slides onto the screen, showing details for the course (name and description). It also has a button: When tapped, it slides a final-level view onto the screen. This view has a UIWebView object, which enables in-app web browsing.

Nav SCS 1 - root view controller - list of programsNav SCS 1 next-level, showing the courses in a programNav SCS 1, next-level view controller, showing course detailsNav SCS 1, last-level view controller, showing a UIWebView

.

The data for the app is stored in a dictionary. The dictionary is in the app bundle, as SCSCurriculum.plist. Each of the three top-level key-value pairs in the dictionary uses a program code as its key, and a dictionary as its value. This next-level dictionary has key-value pairs for the courses; the course code is the key, and a dictionary is its value. The last level dictionary has key-value pairs for the course name, description, and outline URL.

Make sure that you understand the structure of the dictionary.

Your professor recommends that you use Xcode or the Property List Editor, and attempt to re-create a portion of this dictionary. This will help you understand the current task, and prepare you for future tasks.

.

The model, as shown in Xcode or the Property List Editor, is below:

SCSCurriculum.plist - the data model for "Nav SCS 1"

.

You can download “Nav SCS” from the “programming examples” list, linked at the right.
.

Design principles and coding patterns

Creating a multi-level navigation-based app is simple and uncomplicated, if you follow the design principles and coding patterns that were introduced in the previous post.

One of the key principles is to ensure that any view controller be configured with data-bearing properties, so that the view controller has all the data it needs to display correctly. Typically, the “parent” view controller will configure the “next” view controller’s data-bearing property with its data.

.


.

.

.

Advertisements
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: