XCode4: UITabBarController with UINavigationController using Interface Builder

If this helped you, please consider downloading my FREE iPhone app "Hydrate Yourself"and leaving a review.

There are a whole bunch of tutorials to create a Navigation Controller inside a TabBarController with XCode3.  But there are a number of small changes in XCode4 which can trip up someone not familiar with them.  So this guide is essentially an updated version of those other guides, designed to create the same simple demo using the new tool.

1. Create a new Project
We are going to start with a Tab Bar Application, so go ahead and create a new project as usual. I'm calling mine Navigation Tab Bar.

1. Create new project

2. Select the Tab Bar
Click MainWindow.xib and you should see the integrated Interface Builder. On the left is a section called Objects, select the Tab Bar Controller.

2. Select Tab Bar

3. Add the Navigation Controller
On the right side of your screen click the Utilities box. This is new in XCode4 and should look familiar if you've been using XCode3. At the bottom find the Navigation Controller and drag it into the Tab Bar in the middle of your screen.

3. Expand Utility View and Add Navigation Controller

3b. Navigation Controller Added
Here you can see I added it as the middle Tab
4. Configure new tab
Back in the Objects section you can now expand the Navigation Controller and select the View Controller object. Now on the right side you can select the Identity Inspector at the top and put in your UIViewController's class name. For the purpose of this demo I am calling it "YourNewViewController" which we will make at the end.

4. Expand new Navigation Controller select identity inspector and fill in new View Controller name

Once that is done switch to the Attribute Inspector and put in the name of your XIB file in the NIB Name section. Note: do not add the .xib extension, this will cause a runtime crash.

4b. Switch to Attribute Inspector and Fill in the nib name

5. Create the new UI View Controller
This is probably familiar to you already, create file from the File menu and select a UIViewController subclass.

5. Create new UIViewController

5b. With XIB
Be sure to select With XIB for user interface

5c. Use the same file name as before
Use the same file name as you used before.

6. Add an IBAction
We will be adding a button to push a view onto the navigation controller.  Open up the header file and add an action.

8. Add an IBAction for our button
I just added the buttonPushView line

Switch to the implementation file and add another few lines for a simple call to pushViewController.

9. Tell the navigationController to push a new View Controller
This is the simplest pushViewController line I could come up with

7. Add a button
Select YourNewViewController.xib in the file menu. Adding a button is a simple matter of dragging/dropping from the bottom right Objects section.

Next you link the button to the new IBAction by right clicking the button and dragging the arrow to File's Owner, in the Placeholders section. Select buttonPushView.

10. In the new XIB file drag in a button and link to the IBAction

8. You're done!
All thats left now is the build and run (Command-R).  Select the second tab to see your new Navigation Controller and click the button to see it in action.

8. Build and run the simulator. Press the button in the second bar item to try it out      8b. It works

Vim Search for Tags File

I use ctags with vim. This works great when the tags file is in the same directory as the files I'm working on, but is a chore when projects have nested directories.

Add this to your .vimrc file and the recursive search up the directory structure will be done for the tags file:
set tags=tags;/

Why Hydrate Yourself?

This is a short essay about why I decided to create "Hydrate Yourself". It is a free app for the iPhone, iPod touch and iPod which tracks water intake and helps encourage a healthier lifestyle.

According to webmd.com [1] and the US National Library of Medicine [2], symptoms of dehydration include: Dizziness, Lethargy, Lightheadedness, Headaches, Fainting, Weakness and (naturally) a Dry mouth. Other symptoms even include heart palpitations (that feeling of your heart jumping or pounding).

So why is it that water intake is such a secondary concern to so many adults? All it takes is a little attention throughout the day, such as keeping track of how much water you are drinking or carrying a water bottle with you at all times. I strongly believe that drinking enough water is one of the easiest ways to improve your health. But how much water is enough?

Its hard to say, since so many foods we eat every day contain water. Common "rules of thumb" include 8-10 glasses a day, or your body weight divided by two. In reality it will always vary from person to person depending on their lifestyle. For example if you drink a lot of diuretics, like coffee or caffeinated sodas, you will retain some of that water but not all, which skews how much you need to drink. Another factor is your personal activity levels, anything which causes you to sweat causes you to lose more water which needs to be replenished.

One of the most accurate litmus tests for determining whether you should drink more water or not is the color of your urine [3]. The web page urinecolors.com has a color chart stating that if your urine is light orange or darker that you need to drink water immediately.

With all of that known it is easy to see why you should make an effort drink enough water. I spent the last three months of 2010 creating a program to help with just that. After being unsatisfied with the alternative water tracking applications I designed "Hydrate Yourself" from the ground up. There were three key features that needed to be done right: Easy to use multiple containers, multiple calculators for recommended intake, reminders throughout the day to drink more water.

I added two daily intake calculators and an option to enter a custom amount. These calculations can then be used or customized to fit your ideal intake amount. There is a simple calculator that is based off just your weight and basic activity levels (low or high), then there is a complex calculator which is based on your weight, daily minutes of activity, climate, illnesses and more. Of course you can also skip all that and enter a direct amount - maybe your doctor made a recommendation.

A problem with the alternatives is that it can be difficult to use multiple containers, or modify them on the fly. Taking this into account I added a configurable spot on the main page for three containers (such as a water bottle, your favorite glass, and a drinking fountain). From there you can just tap the icon and have it logged or press and hold to get extra options - add a partial serving (half a water bottle), change the default portion size (a new waterbottle holds 32oz instead of 20oz) or add a serving that you forgot to enter earlier (I often forget to add my first glass in the morning).

Perhaps the most useful feature is the ability to add customizable reminders. The hardest part about drinking water throughout the day is remembering to drink it at all. To help with that I added a reminder. It goes off a customizable amount of time after you add a portion, or finish using the app. If it goes off I know that its time to get myself some more water.

[1] http://www.webmd.com/a-to-z-guides/dehydration-adults
[2] http://www.nlm.nih.gov/medlineplus/ency/article/000982.htm
[3] http://www.urinecolors.com/dehydration.php