IPhone Tutorial4-View Based(Using Array)

January 3rd, 2010 by aabhaanjan

Hi All In this tutorial I would like to describe how to used NSArray to display the content I am going to show you the simplest way to create a list of content using array .

You will learn how to:

  • Create a Windows Based Application
  • Create Class to display fresa menu .
  • Create User Interface to display the menu .

Creating a New Windows-Based Application

Open Xcode

Start a new iPhone OS Project
Click Xcode > New Project and a window should pop up like this:

Make sure Application is selected under iPhone OS and then select Windows-Based Application. Click Choose… It will ask you to name your project. Type in “Tutorial 2 -NSArray” and let’s get started.

Now, all of these files together create a basic program.When you click Go ahead and click on the Build and Go button ,It display the bellow

will see the iPhone simulator start and your program will launch.



Use Array to display Fresa Content in View:-

Process to create Array :-

  1. For Creating Array for fresa application à GO TO FILE à ADDà New Fileàand Select Objective C –Class and enter the name of file .The Screen will look like this


2. Now start by opening FresaCellView.h. This is the class for view controller that Apple display fresa content to main view .



Here you are creating the instance of Label and image to display the content to label and Picture to Image view control and you are creating method .

  1. Now start FresaCellView.m.


Here you have created the class and initialize the label and imageView.

  1. Now you want to utilize this class , you have to create a new table view controller class. For Creating New Viewcontroller Class . All of the functions you see already created in here are functions that have been overridden from the Table View super class.

GO TO File à ADD à New File àSelect Objective C Class àEnter the name àFresaTableViewController.

Automatically two file will created .

  1. FresaTableViewController.h
  2. FresaTableViewController.m

Now you have to write code to utilize the FresaCellView Class .



Here you have to import fresaCellView class in FresaTableViewController.h .



This is fresatableViewController.m file . here you have to define your fresa content , Which will be appear in simulator

Since we are editing a table, all of these functions will be related to editing a table. So find the function called numberOfRowsInSection.



This function tells the application how many rows are in our table. Currently, it returns 0. Let’s change that to return no of content defined in array

Now go down to the function called cellForRowAtIndexPath. This function gets called once for every row. This is where we define what content to display in a given row. In this case we want the row to be a string that says.



What this function is doing is creating a new cell object and returning it. The code between the i(cell==null) block checks to see if we have created a cell before, if not build a new cell, otherwise use the one we created before. This helps in performance so we don’t need to build new cells each time we visit this function. So right before the // Set up the cell comment add the following code:

[call setLabelText:[arryData objectAtIndex:indexPath.row]];



  1. Now come to the main file Tutorial2_NsArrayAppDelegate.h and Tutorial2_NsArrayAppDelegate.m .

For displaying view to the main window you have to create navigationControll to mapped with the view.

Now You have to create User Interface to display the fresa content .

Process to Create View :-

1.GOTO –> Resource –>Add File –>View UI –>Add Label and ImageView

Now most important part to mapping with label and image. You have to mapped with the class .Here description text properties which is defined in fresaCellView.h class is mapped with label .

Process for User Interface :

  1. Now open Window.xib file.
  2. Drag and drop Navigation control to mainwindow.xib .
  3. Select Tutorial2_NsarrayAppdelegate class from Class identity.
  4. Now most important part here is that, You have to mapped navigationcontroller with the navigationControlle tab which you have selected from Library.

5.Now Call FresatableViewcontroller.xib file in View Controller properties . the screen will be look like this .

After Mapping Click the Build and Go button again to launch the iPhone simulator. You should see screen look like this and your content will display on the screen:

Tags: , , , , , , , , , , , , , , , , , , ,