iOS Programming Recipe 11: Using The UITableView Part II

In Part I of this recipe we left off with a UITableView that Displayed some creatures which were grouped by type. In this Recipe we’ll be extending the functionality a bit and emplement a delegate in order to handle a touch event. In addition, we’ll take a minute to explore styling of the table view and cells.


  • You Have already read through Part I, if not read through that first.

Styling The Table View

The next two sections will be brief, but I thought it was worth visiting since there are a few things that can be done right from the property inspector.

First of choose the tableview object from the storyboard and go to the property inspector tab on the top right hand pane. Choose Grouped from style section and go ahead and change default to some color, I change mine to blue.

[Read more…]

iOS Programming Recipe 11: Using The UITableView Part I

In most apps you’re sure to find a table view whenever a list of items needs to be presented. UITableView, similar to UIPickerView, declares both a data source and delegate protocol. The data source protocol is required while the delegate is optional. We’ll need to make use of the data source protocol for the UITableView class. For this recipe I chose to show a table view with bugs and animals shown. The bugs and animals will have seperate sections.


  • You are familiar with Xcode, if not familiarize yourself here.

Setting Up the View

First start with a single view controller project. Now drag a UITableView object onto the existing view from the object library and then drag a UITableViewCell onto the newly created table view. When you’re done you should have something that looks like this:

[Read more…]

iOS Programming Recipe 9: Adding Multiple Columns to UIPickerView

In my last article I left off on the UIPickerView with some basic functionality. This week I want to expand on that functonality and show a few other bits of functionality that can be used. What we did in Recipe 7 was show a picker with a single column. In this article I want to expand on that and show how to use two columns: The second column will change the alpha value for our color.


Reworking the Data Source

Alright, let’s get into this! The first thing we’ll want to do is edit these two methods:

// returns the number of 'columns' to display.
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
    //One column
    return 1;

- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
    //set number of rows
    return [self.colorArray count];

The first data source method should be obvious! We’ll simply change the return value from 1 to 2 this sets it to two columns (components). The second data source method requires a bit more work, Although it’s not too much. The second method just sets up a return value based on which column was selected.

[Read more…]

iOS Programming Recipe 7: Using the UIPickerView

The UIPickerView can be a frustrating element for a new iOS programmer. I know first hand as I was just recently there.

For this example I’m going to create a simple color picker. from the picker we can select a color and the RGB value will print to the screen. Seems easy enough? right? Let’s get to it!


  • You Are familiar with Xcode and the storyboard
  • you know how to create a single view controller

Setting up the Storyboard

First start out with a single view controller and title it whatever you like. I titled mine “PickIt”.

From the Storyboard drag a new UIPickerView object on to the view from the Object Library in the bottom right hand corner of the screen.

Create some new labels titled “Color Picker”, “You Chose:”, and “Nothing”. Arrange all of these elements as seen on the scren below. Optionally you can choose a background for your view too.

[Read more…]

iOS Programming Recipe 5: Passing Values Between Segues with PrepareForSegue

In Part 1 and 2 of Recipe 3 I stepped through creating a modal relationship using storyboards. There was no code needed to make this relationship using storyboards. If you want to pass information from the presenting view to the presented view you’ll need to add some code.


  • You know how to set up a segue relationship using the storyboard. If not go read part 1 and 2 of Recipe 3 here: Part 1Part 2

Setting Up the Views

To start off, I created a new single view controller project and replaced the view controller with a navigation view controller. Then I deleted the root controller and added two new view controllers. I made one view controller the root view controller, and I didn’t setup the segue on the other controller for now. Then I gave each views the titles “Root View Controller” and “First View Controller” respectively. See recipe 3 for more details on setting this up.

Next I deleted the viewController class and all of it’s refferences. Delete the viewController.m file and viewController.h file and Xcode will ask you if you would like to remove the refferences.

Next we’ll need to create two new UIViewController Classes. To do this push the plus sign in the bottom left hand corner of the project navigator.

Create New UIViewController Classes

When prompted choose objective-C class under Cocoa Touch and press next. For the next prompt name the Class “RootViewController” and choose the subclass “UIViewController” then press next. You will then press create on the next prompt. Repeat this step and name the next class “FirstViewController”.

Choosing UIViewController subclass

When you’re done creating classes you should see the newly created .m and .h files in the project navigator.

New Project Navigator


The last thing we’ll want to do is connect our new classes to our views on the storyboard. To do this, select the view and in the utilities pane under the identity inspector choose the class from the dropdown.  Do this for both the RootViewController and the FirstViewController.

[Read more…]

iOS Programming Recipe 4: Using NSURLConnection

URL Requests

Making URLS requests on the Mac is as simple as

  1. open
  2. then typing the following

$ curl

This retrieves the APP.NET global stream. If you are not familiar with APP.NET, it is a Twitter like service that sports an open api, similar to how Twitter used to be.

The result of running curl is a large JSON string representing the afore mentioned global stream as shown below

curl result

Unfortunately making URL requests in your iOS application isn’t quite this easy, but fortunately NSURLConnection does most of the heavy lifting for you.


The NSURLConnection class reference, located on Apple’s developer website has the following description

An NSURLConnection object provides support to perform the loading of a URL request. The interface for NSURLConnection is sparse, providing only the controls to start and cancel asynchronous loads of a URL request.

Which basically says NSURLConnection is used to perform URL requests, but how do you create the actual requests?

NSURLRequest to the rescue!

[Read more…]

iOS Programming Recipe 3: Creating Segues with the Storyboard Part 2

Last time we left off navigation controllers and a simple modal segue were covered. Now I want to go over one more common navigation controller. This time We’ll talk about the TabBarController. The steps here should be pretty familiar from Part 1. If you haven’t already gone to Part 1 you may want to head over there.


  • You Are familiar with Xcode 4.5, if not go here
  • You know how to create a project with a single view controller

The TabBarController

Alright, Let’s get into the meat of this. Start with a new single view controller project titled “TabBarSegue”. Then go ahead and delete the view on the storyboard. This sets us up for a good starting point.

From the object explorer in the bottom right hand pane, drag a new TabBarController on to the storyboard. Two views are already connected to the controller, but we want to show you how to create these connections yourself so go ahead and delete them. You should now just have the single TabBarController on the screen like below.


now go ahead and drag a new view controller onto the screen next to the tabBarController. You see the following:

add new view

Now control click the TabBarController and drag to the view controller. A dialogue will pop up and you will see at the bottom of the dialog an option title “view Controller” under “relationships”. Choose that option.

making connection

selecting relationship

You should now see a segue connection like the following:

one view added

Right Now you pretty much have everything you need to know about segueing to a TabBarController.  If you were to run this right now it wouldn’t do a whole lot though. Let’s go ahead and add a couple more  views to the storyboard scene and connect those as well. The steps are the same as already described.

You should have something that looks like this:

3 views added

Now go Ahead and add a label to each view. Call them “First”, “Second”, and “Third” respectively. Go ahead and run it!

You should have something like this:

Tab bar controller in action

Ok, Now one last thing. Most Apps you see with a TabBarController have little icons. Now We’ll show you how to do that. Find a small .PNG file with a transparent background.  Also Make sure it’s a black and white image for best results. I made a spur looking thing in photoshop that is about 32 x 32 pixels. I also made a 64 x 64 pixel version. This is needed for higher resolution devices. name the first icon 32 pixel icon whatever you want and then name the 64 pixel icon the exact same thing with an @2x on the end. Xcode will automatically pick the @2x.png image when high res devices are used, otherwise the smaller image will be scaled up on high resolution devices. This doesn’t look good. I suggest creating the 64 pixel version first then modify the image size down to 32 pixels and save that.


spur.png and spur@2x.png

Drag the images from the file location into you Xcode project. it will prompt you to copy the files to the project. Go ahead and do it.

now select the tab  bar on one of the views. The Attributes inspector should show the following prompt:

Tab Bar Properites

Select your image from the drop down and give it a title. Run it and you should see your image. My result looked like this:


Again, We didn’t need any code to get this done. In future posts we’ll talk more about transitioning from views without the use of interface builder. Many iOS developers have mixed feelings on the interface builder. Some will use it, others wont. As such, the requirement for a career is usually that you as a developer can do both. The next Recipe I’ll be posting will take these segued relationships and share data between them.


iOS Programming Recipe 3: Creating Segues with the Storyboard Part 1


In the early days of iOS development the Interface Builder was cumbersome and not too helpful. Now the interface builder is nicely integrated into Xcode and can be very helpful and easy to use. This article serves as an introduction into the storyboard as well as how to work with segues.

The storyboard in Xcode allows a developer to lay out the design of an App before any code has to be written. This can be helpful for conceptualizing an idea. Often a developer may want to transition between multiple scenes. To transfer between scenes with the storyboard a Segue needs to be implemented.


  • You Are Familiar with Xcode 4.5 if not, do so here.
  • You know how to create a project with a single view controller

The Segue

A segue is basically a connection between two views which allows one view to present another when an action(most commonly a button push) is performed. depending on the application, one of two types of segues may be used.

The Modal Segue

The modal segue is the most simple type of segue. Generally a modal segue would be used when there is no need to share information between the presenting view and the presented view. A good example of this would be a login screen.

The Push Segue

A push segue will be necessary for either the navigation controller or the tab bar controller. These types of controllers handle memory managment and help with passing data between views.

Using A Modal Segue

A modal segue is really pretty simple as far as implementation. For this example we’ll make a login screen that will take us to a view. Start of with a new single view controller project titled “modalview”.

In the main story board drag three Labels, two text fields, and a button from the objects explorer in the bottom right hand pane to the view. Then change the text on the labels and buttons to look like the following image:

iOS Login Screen Example

next drag a new view controller onto the storyboard. From the new storyboard control drag from the login button to the new view controller. When prompted choose “modal” from the dialogue.

[Read more…]

Privacy Policy