I have been a bit slow updating this site lately partly because we were trying to launch our new app before the holiday season. It features CNET Reviews and packs a bag of goodies like easy category access, filtering and sorting results, latest pricing comparisons, search, barcode scanning or buying guides. So go check it out, install it, and love it!

Here is an intro blog post from a CNET executive editor: http://reviews.cnet.com/8301-19512_7-20021529-233.html

You can download the app here: http://reviews.cnet.com/iphoneappdownload or directly from iTunes: http://itunes.apple.com/us/app/cnet-product-reviews/id399322513

If it’s anything like last year, it’s going to be pretty miserable. 5,000 knowledge-hungry developers from all around the world trying to get to the same sessions as you. There will be lines for everything; bathrooms, presentation rooms, lunch, labs, store, escalators. Pretty much anywhere you want go, there will hundreds of others who want the same thing.

At the end, it’s worth it though. The information presented is very solid. They don’t cover everything but enough to get you started. After you walk out of there, you should be able to build a semi-complex iPhone/iPad app. Not bad for ~4 days of sessions.

For all you first-comers, here are a few words of advice:

1. If you want to see the keynote, count on seeing some hardcore fans camped out in front of Moscone as early as 1-2am. Getting there at 6am will put you somewhere at the end of the North-West side of Moscone West. You will still be able to get inside the keynote room at that point. Once people condense, the line isn’t really as long as it seems at first. I’d pack light, bring snacks and something small to sit on. You will get cold after a while no matter what the predictions say so have a jacket ready.
2. There will be a bunch of companies going around the long line giving away SWAG. Don’t take anything you don’t want because you’ll have to hold it until you get to a trash can. The cute girls giving it away and trying to sign you up for their newsletter aren’t really interested in you, no matter how convincing they are. So don’t be gullible and be strong!
3. Once the line starts moving, don’t get your hopes up just yet. You’ll make several stops inside the building before reaching the presentation room. The good thing is, once you’re deep enough, Apple will provide breakfast pastries, coffee and water. Don’t run to it, there will be plenty of it.
4. The session rooms will fill up rather quickly. Always know what session you want to attend next and where it is. If you screw around for too long, you may not get in.
5. It’s easy to forget about the lunchtime speakers. Don’t waste your time pretending you’re coding in one of the rest areas and go see the lunchtime speakers. They’re really worth seeing. Their success stories are very inspiring and educational.
6. When it’s time for lunch, you don’t have to rush. There is plenty of food and lines are fairly manageable. It’s much better than lines to bathrooms or sessions. The food is made for masses so don’t expect Hubert Keller’s cuisine. A vegetarian dish will always be available so meat-haters need not worry.
7. For all of our sake, please do not type during sessions. Both slides and session videos will become available a couple months after the conference so don’t try to copy all the source code you see on the screen. There is a lot of loud typers out there and there really isn’t anything more annoying then listing someone hammering on their keyboard during a presentation. If a session bores you or you just prefer to IM your buddies instead, please leave the room so that someone who is actually interested can attend.
8. Evening events are fun. I’m not going to go as far as saying they’re unforgettable but they’re fun. Again, it used to be a lot more intimate a few years back but now that everything is being catered to five thousand people, it’s not the same. Stump the experts is one of those events that is highly hyped. It’s full of inside jokes that date all the way back to when WWDC was still in diapers. You may not laugh at them but it’s very intriguing to learn some of the “behind the scenes” tidbits you wouldn’t hear anywhere else. The prizes have been quite substantial too so if you happen to answer a difficult question, you may walk out of there with a Macbook Pro.
9. In general, don’t bring too much with you. You’ll have to carry it around all day long and that’s not fun. The bags and laptop sleeves Apple gives out when you pick up your badge are usually pretty uncomfortable to carry so don’t feel obligated to use them throughout the conference. My bag from last year is still in its plastic cover, untouched. It wanted to be a backpack but it was really a glorified laptop sleeve. Don’t expect to get two free phones like at Google IO.

Among other conferences, like JavaOne, WWDC rates as one of the most exciting ones. The whole thing is designed as any other Apple product – very pretty to look at but it has its share of problems. There was a controversy going on about the cost of admission this year. There was no pre-registration period since Apple knew they would sell out quickly anyway. The price tag of $1,595 is up there but still cheap compared to other conferences. Only, the “other” conferences are usually paid for employers. WWDC attendees are mostly individual contributors who pay for the ticket out of their pockets. Therefore, $1,600 in addition to transportation, room and board for 5 days can be quite an expense.

For those attending, you’re going to have lots of fun and I hope to meet some of you there!

The way settings are used today is by specifying Settings.bundle and Root.plist files in your project. This lets Settings.app know about your app and its settings. The obvious downside of this approach is that app settings are separated from the app itself.

InAppSettingsKit uses a hybrid approach to this problem. It still uses the same resource files to create your settings bundle. However, your settings will be available both within the app and in Settings.app. This is great because you don’t have to create any additional metadata files to support this feature while still maintaining the existing functionality.

I’ll play around with it a bit and post back with a report. For now, head over to FutureTap’s or Edovia’s blogs for release notes and more information.

The first one of these back in 2007 was still pre-SDK.  It was primarily concentrated around web-based apps. This is when I developed CiUI to serialize production of web-based apps. CNET is still using it (http://reviews.cnet.com/4250-1-0.html) but development of their mobile sites has since been handed over to CBS Mobile.

In any case, if any of you are going to be in attendance this Thursday, hope you come say Hi!

There is a very easy way of creating a tab bar application. In fact, it’s so easy it requires no work whatsoever. When you choose to create a new iPhone application in Xcode, one of the options is Tab Bar Application. Just the bare-bones template provided by Apple gives you a fully-functioning app with two tabs. That is not what this tutorial will be about. We are going to create a tab bar controller programatically. It’s really a lot easier than most people think.

Prerequisites

This tutorial is a continuation of my previous tutorials so if you haven’t followed them, it’s a good time to catch up.

We’re going to be starting off from a slightly modified version of the previous source code. You can download the primer code for this tutorial here: MyDVDLibrary04Primer. The only changes made were some name changes (DetailViewController became DvdInfoViewController) and I organized all classes into groups.

Also, I’ve recently upgraded to OS X Snow Leopard + Xcode 3.2 with iPhone SDK 3.0 (not 3.1 yet) so the project was compiled on that platform.

1. Create DetailViewTabBarController class

We’re going to add a view controller that will create a tab bar controller with three tabs: Info, Stats and Borrowers. Each of the tabs will be a separate, self-contained view controller. We already created one of them, DvdInfoViewController, which was previously called DetailViewController. The reason I renamed it is that the real detail view controller will now be our tab bar controller.

In Xcode, right-click on the View Controllers folder from the the Groups & Files panel on the left and choose Add -> New File. Choose UIViewController subclass from the Cocoa Touch Class section and click Next. Name the file DetailViewTabBarController.

Note: You may be wondering why we didn’t choose a UITabBarController subclass instead. As you can see that option wasn’t even offered. This is because UITabBarController is not meant to be subclassed. Instead, we create a generic view controller to which a tab bar controller will be assigned.

2. Create DvdStatsViewController and DvdBorrowersViewController

These are the new view controllers I mentioned previously. We already have our DvdInfoViewController that will be in the first tab, so let’s create the remaining two.

In Xcode, right-click on the View Controllers folder and choose Add -> New File. Choose UIViewController subclass and name the file DvdStatsViewController.

To create DvdBorrowersViewController do the same thing, only name it DvdBorrowersViewController.

That’s it about those two controllers for now. I’m not going to cover actually filling them with any content since that’s not the point of this tutorial. We will leave them here as placeholders for future tutorials when we cover Core Data and RSS feed processing.

3. Set up DetailViewTabBarController

Since we’re going to be coming to the tab bar controller from the RootViewController, we need to pass it DVD info from the row that was tapped. We can do that in a custom init method in DetailViewTabBarController. You’ll see how it’s used later when we instantiate it in didSelectRowAtIndexPath method of RootViewController.

We’re also going to need a handle on the data about the DVD that was tapped on the front page.

Declare it all in DetailViewTabBarController.h

@interface DetailViewTabBarController : UIViewController {
    NSDictionary *dvdData;
}
-(id)initWithDvdData:(NSDictionary *)data;
@end

Next, let’s define initWithDvdData in DetailViewTabBarController.m

-(id)initWithDvdData:(NSDictionary *)data {
    if (self = [super init]) {
        dvdData = data;
    }
    return self;
}

All we’re doing here is setting local instance variable dvdData to whatever is passed in. We now have a handle on the DVD data and can use it across all the view controllers.

4. Implement loadView method in DetailViewTabBarController

loadView is a method on UIViewController that can be overridden in case you want to build your view from ground up. That’s exactly what we want to do so let’s override loadView now. Let’s discuss it piece by piece;

- (void)loadView {
    UIView *contentView = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame]];
	contentView.backgroundColor = [UIColor whiteColor];
	self.view = contentView;
	[contentView release];

Borrowing the biblical line; in the beginning there was nothing, we need a base view to build upon. So we created an empty view with a white background that takes up the whole screen. We will attach all the other views to it.

Now we need to instantiate all three of our controllers. Each one will become one tab in the tab view.

    // Declare all three view controllers
    DvdInfoViewController *dvdInfoController = [[DvdInfoViewController alloc]
                                                initWithDvdData:dvdData
                                                nibName:@"DetailViewController" bundle:[NSBundle mainBundle]];
    DvdStatsViewController *dvdStatsViewController = [[DvdStatsViewController alloc] init];
    DvdBorrowersViewController *dvdBorrowersViewController = [[DvdBorrowersViewController alloc] init];
 
    // Set a title for each view controller. These will also be names of each tab
    dvdInfoController.title = @"Info";
    dvdStatsViewController.title = @"Stats";
    dvdBorrowersViewController.title = @"Borrowers";

You see the dvdInfoController is initialized the same way we did it before in RootViewController. We pass it dvdData that we get from our custom initialization method.

Now the meat of this method, let’s create the actual tab bar controller and give it the three view controllers. You can note that we’re setting the bounding frame to be 320 pixels wide and 460 pixels high. We shave off 20 pixels because the title bar is already taking up, well, 20 pixels.

UITabBarController creates tabs when you call setViewControllers on it and pass it an array with your controllers in it. That’s what’s happening here.

    // Create an empty tab controller and set it to fill the screen minus the top title bar
    UITabBarController *tabBarController = [[UITabBarController alloc] init];
	tabBarController.view.frame = CGRectMake(0, 0, 320, 460);
 
    // Set each tab to show an appropriate view controller
    [tabBarController setViewControllers:
     [NSArray arrayWithObjects:dvdInfoController, dvdStatsViewController, dvdBorrowersViewController, nil]];

And finally, let’s clean up objects we no longer need from memory and add the tab controller view to our parent view so we can actually see it.

    // Clean up objects we don't need anymore
    [dvdInfoController release];
    [dvdStatsViewController release];
    [dvdBorrowersViewController release];
 
    // Finally, add the tab controller view to the parent view
    [self.view addSubview:tabBarController.view];
}

5. Modify RootViewController’s didSelectRowAtIndexPath method to display DetailViewTabBarController

The last step we need to take is to modify didSelectRowAtIndexPath in RootViewController to display our newly created tab bar controller instead of the DvdInfoViewController we showed in the last tutorial.

Open up RootViewController.m and modify didSelectRowAtIndexPath to look like this:

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    DetailViewTabBarController *controller = [[DetailViewTabBarController alloc]
                                              initWithDvdData:[dao libraryItemAtIndex:indexPath.row]];
    controller.title = [[dao libraryItemAtIndex:indexPath.row] valueForKey:@"title"];
    [self.navigationController pushViewController:controller animated:YES];
    [controller release];
}

At this point, you can run your project and tapping on a DVD title should take you to the tab bar controller which has three tabs. The first tab contains the movie info, the remaining two are empty. As I mentioned before, we’ll fill those in in the later tutorials or it can be left as an exercise for the reader.

6. Add icon to tabs

The tabs now only have a textual title. Let’s make it prettier by adding an icon to each of them. I only use one image (included in the project) for demonstration purposes but you can have a different image for each tab. The image should be 32×32 pixels PNG file. You don’t need to to create the pretty, shiny, gray and blue images. Just pass it a normal image and the SDK will do the rest.

Add this in the loadView method in DetailViewTabBarViewController.m implementation file right after we set the titles of the controllers:

    // Set a title for each view controller. These will also be names of each tab
    dvdInfoController.title = @"Info";
    dvdStatsViewController.title = @"Stats";
    dvdBorrowersViewController.title = @"Borrowers";
 
    dvdInfoController.tabBarItem.image = [UIImage imageNamed:@"dvdicon.png"];
    dvdStatsViewController.tabBarItem.image = [UIImage imageNamed:@"dvdicon.png"];
    dvdBorrowersViewController.tabBarItem.image = [UIImage imageNamed:@"dvdicon.png"];

If everything went well, you should see your app looking like this

Conclusion

While it may seem easier to create everything in the Interface Builder, you can see that in this case creating a tab bar controller was a breeze. Adding new tabs/view controllers to it is as easy as adding an object to an array. I hope this tutorial connecting the dots how to go from a table view to a tab bar view in a navigation-based application.

You can download the complete source code to this tutorial here: My DVD Library Tutorial 4

I’m going to build this tutorial on the previous two so if you haven’t checked them out yet, you can see the first one here and the second one here. You can also download the source code on the bottom of each tutorial.

What we’ve done so far

We used UITableViewController to build out our root view controller that lists all the DVDs from our data file. Then we customized each cell by adding a DVD cover and some basic info about each movie. Tapping a row in the table caused the app to go to a detail page which was also a table displaying expanded info about the selected movie. That’s the part we’re going to work on now.

1. Download some source code to get your started

Since we’re going to be completely removing the detail view controller we used in the previous tutorials, let’s just start from there. Instead of walking you through deleting the controller and removing the appropriate functionality, download this source code that will get you started. You’ll get the root view controller with customized cells in it. However, tapping on any of the rows won’t do anything, yet. Download the primer project here: MyDVDLibrary03Primer.

2. Enhance test data file

Since our test data file only contains title, length, image and release date for each movie, that’s not going to cut it when trying to design a detail view page. We’ll at least want to add the description of the movie and maybe also its genre. This can be very tedious to do in a plist like we’re using right now but it will get a lot easier once we start using Core Data that I will cover in later tutorials.

I won’t make you add all the data by hand so for a shortcut, download the completed plist file here and replace your existing one that can be found in Xcode under the Resources folder: TestData.plist.

3. Create new DetailViewController class

In Xcode’s file browser on the left, right-click on the Classes folder and choose Add -> New File… . Under Cocoa Touch Classes group choose UIViewController subclass and make sure to check the With XIB for user interface checkbox. This will not only create our subclass but also the NIB file that we’ll use to layout our UI components.

4. Set up UI outlets

We now need to set up all properties in our controller that will be used on the detail view page. There will be an image view for the DVD cover, a label for the title, release date, length, genre and a text view for the description. Add this to the header file of the DetailViewController (DetailViewController.h):

@interface DetailViewController : UIViewController {
    IBOutlet UIImageView *coverImageView;
    IBOutlet UILabel *titleLabel;
    IBOutlet UILabel *releaseDateLabel;
    IBOutlet UILabel *lengthLabel;
    IBOutlet UILabel *genreLabel;
    IBOutlet UITextView *descriptionTextView;
}
 
@property (nonatomic, retain) UIImageView *coverImageView;
@property (nonatomic, retain) UILabel *titleLabel;
@property (nonatomic, retain) UILabel *releaseDateLabel;
@property (nonatomic, retain) UILabel *lengthLabel;
@property (nonatomic, retain) UILabel *genreLabel;
@property (nonatomic, retain) UITextView *descriptionTextView;
 
@end

Synthesize the properties in the implementation file (DetailViewController.m):

@synthesize coverImageView, titleLabel, releaseDateLabel, lengthLabel, genreLabel, descriptionTextView;

5. Lay out and connect UI components in Interface Builder

Before we jump to Interface Builder make sure to save all the changes so that IB can pick up on them.

In Xcode, locate DetailViewController.xib file (it got created this file along with DetailViewController class in Step#3) and double-click on it. Once Interface Builder opens you should see an empty canvas where we’re going to place our UI elements. Lay them out as shown in the screenshot below. Note that you should uncheck Editable checkbox on your text view so that the text is read-only.

Now we need to connect the UI elements to its variable counterparts. I’m not going to cover step-by-step how to do that as it has been discussed in some detail in the tutorial on customizing view cells. Please, review that tutorial if you’re unclear how to follow the next set of instructions.

Click on File’s Owner icon to highlight it. From the file menu choose Tools -> Connections Inspector (Cmd + 2). Under Outlets, you’ll see all of our instance variables we declared in the DetailViewController class. Control-drag from File’s Owner to each UI component in the view to connect coverImageView to Image View, releaseDateLabel to Release Date label, genreLabel to Genre label, etc. Once done, your Connections Inspector should be set up like this:

Save your changes and return back to Xcode.

6. Prepare DetailViewController to read test data

If you recall what we did with the original DetailViewController when it was still a table, in its initialization method we passed in a dictionary containing all the info about our DVD library. This was read in using DvdLibraryDao object that basically took the plist we constructed earlier and put all its content into a dictionary. We’re going to do the same thing in our new DetailViewController, only we’re now adding a couple of properties (genre, description) that we just added in Step#2.

We also add declaration of our custom initialization method here. It’s pretty much just a modified initWithNibName method that adds dvdData into the mix. This method will set the local instance variable dvdData that is also declared here. Change DetailViewController.h header file to look like this:

@interface DetailViewController : UIViewController {
    IBOutlet UIImageView *coverImageView;
    IBOutlet UILabel *titleLabel;
    IBOutlet UILabel *releaseDateLabel;
    IBOutlet UILabel *lengthLabel;
    IBOutlet UILabel *genreLabel;
    IBOutlet UITextView *descriptionTextView;
 
    NSDictionary *dvdData;
}
 
@property (nonatomic, retain) UIImageView *coverImageView;
@property (nonatomic, retain) UILabel *titleLabel;
@property (nonatomic, retain) UILabel *releaseDateLabel;
@property (nonatomic, retain) UILabel *lengthLabel;
@property (nonatomic, retain) UILabel *genreLabel;
@property (nonatomic, retain) UITextView *descriptionTextView;
 
- (id)initWithDvdData:(NSDictionary *)dvdData nibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil;
 
@end

Switch over to DetailViewController.m implementation file. Let’s implement the initWithDvdData method:

- (id)initWithDvdData:(NSDictionary *)data nibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
    if (self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil]) {
        dvdData = data;
    }
    return self;
}

All this is doing is it assigns data that is passed in to our instance variable dvdData.

To read everything in from dvdData to all of the UI elements, we’ll insert a little snippet of code in the viewDidLoad delegate method. As you can see, we assign each value from dvdData to its corresponding UI element.

- (void)viewDidLoad {
    coverImageView.image = [UIImage imageNamed:[dvdData valueForKey:@"coverImage"]];
    titleLabel.text = [dvdData valueForKey:@"title"];
    releaseDateLabel.text = [NSString stringWithFormat:@"%@", [dvdData valueForKey:@"releaseDate"]];
    lengthLabel.text = [NSString stringWithFormat:@"%@ minutes", [dvdData valueForKey:@"featureLength"]];
    genreLabel.text = [dvdData valueForKey:@"genre"];
    descriptionTextView.text = [dvdData valueForKey:@"description"];
    [super viewDidLoad];
}

7. Handle didSelectRowAtIndexPath in RootViewController

Now that we have our detail view controller all ready to go, let’s connect the dots and have the RootViewController go to the detail page when a row is tapped.

In RootViewController.m, locate the didSelectRowAtIndexPath method. Just as we did before, we’ll instantiate DetailViewController here and push it to the controller stack:

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    DetailViewController *controller = [[DetailViewController alloc]
                                        initWithDvdData:[dao libraryItemAtIndex:indexPath.row]
                                        nibName:@"DetailViewController" bundle:[NSBundle mainBundle]];
    controller.title = [[dao libraryItemAtIndex:indexPath.row] valueForKey:@"title"];
    [self.navigationController pushViewController:controller animated:YES];
    [controller release];
}

If everything went well, you should be able to run your project and get something like this:

8. Format the release date field

While something like 2007-07-08 16:32:07 -0700 is completely acceptable by me, many people want to see something a bit more user friendly. Let’s take that date and try to display it as July 8, 2007.  We’re going to achieve that using a nifty utility class called NSDateFormatter. Open DetailViewController.m and change viewDidLoad method to look like this:

- (void)viewDidLoad {
    coverImageView.image = [UIImage imageNamed:[dvdData valueForKey:@"coverImage"]];
    titleLabel.text = [dvdData valueForKey:@"title"];
    lengthLabel.text = [NSString stringWithFormat:@"%@ minutes", [dvdData valueForKey:@"featureLength"]];
    genreLabel.text = [dvdData valueForKey:@"genre"];
    descriptionTextView.text = [dvdData valueForKey:@"description"];
 
    // Format date we get from releaseDate field to more readable form
    NSDate *releaseDate = (NSDate *)[dvdData valueForKey:@"releaseDate"];
    NSDateFormatter *dateFormatter = [[[NSDateFormatter alloc] init] autorelease];
    [dateFormatter setDateFormat:@"MMMM d, YYYY"];
    releaseDateLabel.text = [dateFormatter stringFromDate:releaseDate];
 
    [super viewDidLoad];
}

All we had done is gave our formatter a string representation of the date format we want and then outputted that date to releaseDateLabel.

Conclusion

When customizing your detail views, possibilities are endless. You could add a texture to your background, add more images, maybe a table with some detailed information, or other controls that would take you forward in the controller stack. But I hope this tutorial got you started and showed you some basic techniques and tricks to create a detail page.

You can download the complete source code to this tutorial here: My DVD Library Tutorial 3

As an iPhone developer, I want this site to be a good resource for tips, tricks, tutorials, articles and other material that will help all of you interested in iPhone development get started and get developing.