Table View and Picker

6.1 Dealing with Table Views

Table views are the essential object for the iPhone application development. Table views can be used for display set of data and can also be used for developing iPhone applications with iPhone standards and so on. Table views having set of delegates which can be used to access the data in table view.

The best way to understand how to use a Table view in your application is to create a new View- based Application project and then manually add a Table view to the View window and wire it to a View Controller. That way, you understand the various building blocks of the Table view.

In the header file, first add UITableViewDelegate and UITableViewDataSource. Then create one outlet for UITableView and one array to store the values that is going to display in the table view. The header file will be look as follows,

Now come back to implementation section, we have to use two data source function required to display the data in table view. Following are two major data source functions of table view to display the relevant data.

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;

In the first function, we have to define the total number of rows that we are going to append in the table view. We can manually set integer value or we can set the count value of array that we are going to use in our application.

In the second function, we have to define the cell. We can create our own cell as per project requirement. Implementation section coding will be as follows,

Array values are defined in ViewDidLoad Function. Now In the xib file, connect the outlets and tableView delegates as shown in following figure,

In addition to above two datasource functions, we have following optional functions to enhance the property of Table View datasource.

Finally build and run the application, we will get output as follows,

Till now we didn't use any delegate functions for table view. For that we have to Implement following modifications in our application. When the user click particular row in the table view, it should navigate to next view and show the row element name in the next view. For that first we have to declare and define the navigationController in app-delegate. The app-delegate.h and app-delegate.m files are changed as follows,

fig : app-delegate.h

fig: app-delegate.m

Now we have to add one more UIViewController in our project, for that right click on the project and add new UIViewController file, name it as subview. In subview.h file , add one method to get the string value. This method will get the string value for the selected row in the table view.

Also declare object for label and finally subview.h file look as follows,

Now in subview.m file, we have to define the method. Finally connect the outlet for label in subview.xib file.

Now come to our tableView header file and import subview.h file . Now come to implementation section and add one delegate function in the code as follows,

Finally build and run the application, the output will be as follows

4.2 UIPicker and it's Functions

UIPicker is another one object used in iPhone development for displaying the data inside a picker. iPhone allow us to use two kinds of picker, namely DataPicker and Picker. Date picker is used to display the date, time or both . User can select desire one as per his requirement.

Following example shows the date picker example. First we have to create a view based application and in the header section of View controller file, add UIDatePicker object and one IBAction to invoke date picker function. In the implementation section, define the function .

Fig: Header File

Fig: Implementation File

Finally connect the outlets and IBAction in xib interface. Choose Value changed as action as shown below,

Build and run the application. You will get the desire output. Developers can change the properties for picker via attribute window. They can change the type, values, selector style etc, through attribute window.

Now we shall see a picker with example. In picker, we can customize the data as per our requirements. UIPicker having data sources and delegates similar to UITableView. First we have to import the picker delegate and data source in the header file. And create an object for picker . In this application, we are going to implement two components, i.e. We are splitting a picker in to two parts loaded with different data. To store the data, we are going to declare two array in header section. To get the current index value for each section, we are going to declare two integer values in header. Finally we will get the header file as,

Now we have to set data source and delegate action for picker using data source and delegate functions. Initialize the arrays with objects in viewDidLoad function.

Above three data source functions are used to set data in the picker. First function defines the number of rows in each component, second one is for set number of components in the picker and third one is to set data for each component.

Following are the delegates function used to perform any action in picker,

here, we are getting the index path for each components. By using this index path, we can get the component's index path globally and can use that in anywhere of the program page. Finally define the alert action by using index paths as follows,