One of the things I like about the tab controller is the easy option to add a image into them. I do give it to apple on how their framework has everything thought out for a good user experience. As a programmer, I hardly have to think about the UI at all. I just have to make it work.

So you want to double click on the MainWindow.xib. This will launch Interface Builder.

You want to make sure the inspector dialog is showing

• Tools -> Inspector

Now that everything is loaded we can easily change the text by double clicking it in the Tab Bar Controller view. or we want to change it in the inspector.

The first thing I always do is change the view from thumbnail to listing view. You do that in the screenshot below.

Also if you didn’t you need to drag the images you want to use into your project like we did in the icon example.

So once the icons are there we want to select the item we want to edit. So see the following screenshot as we want to edit the first tab. In the inspector window when its selected we have Title and Image. We can change the title to whatever we want. I choose Browse. Then just select which image you want to use with it. You are free to not use an image if you wish. For the other tab I choose to set it as options.

Once they are set, you can save and quit out of Interface Builder and build your app and you should see the following.

The first thing you might notice is your image while selected is all blue and the other one is white. The Apple framework does this. I think also you should use a png file for these since Apple uses the alpha channel or such. There is a good section about how to create a nice looking icon.

Again I am not including any source since this is all using standard code and Interface Builder. Also those images might change randomly as the tutorials go on. I just might create better looking graphics for them.