How to sort data and display in UITableView
So, today we are going to see how to make a simple app in iPad that will sort the list of countries in ascending or in descending order as per required.
Given below is the snapshot of what will our app look like.
So lets get started :-
1.) Creating a new project
The first step is to create a new project. For this we need to :-
a.) launch Xcode.
b.) click on File -> New Project.
c.) select Application (under iOS).
d.) select View-Based Application project template.
e.) Under Product , choose iPad.
f.) click on choose.
g.) save the project and name it “sort”.
This is how the list of files look like in Xcode.
2.)Building the Interface
Go to “Resources” folder and click “sortViewController.xib” file. This will launch the”Interface Builder” which consists of few windows.
a.)Now we will go to the “Library window” and from there we will select the “Table View” and drag it to the “View window”.
b.)Same way we are going to drag ”Segmented Control”.
c.) We will make the interface as shown in the figure and name the objects according to it.
3.)Writing Code
a.)So Code for “sortViewController.h” fil
There would be a piece of code that Xcode has already written for you. Here’s what the whole code will look like.
#import <UIKit/UIKit.h>
@interface sortViewController : UIViewController <UITableViewDataSource>{
NSMutableArray *sortedArray;
IBOutlet UITableView *tableView;
IBOutlet UISegmentedControl *segmentedControl;
}
@property(nonatomic,retain) IBOutlet UISegmentedControl *segmentedControl;
@property(nonatomic,retain) IBOutlet UITableView *tableView;
-(IBAction) do_sorting;
@end
Here we declare an Mutable Array that will contain the sorted list of countries , a Table View object and Segmented Control objects.
We set the property for the SegmentedControl and the TableView Object.
A function “do_sorting” which when called will sort the list in acending or descending as required.
Property List:
Property lists organize data into named values and lists of values using several object types. These types give you the means to produce data that is meaningfully structured, transportable, storable, and accessible, but still as efficient as possible.
We will use them here to organize the list of countries we will be sorting out.
Lets see how to create a Property List also known as plist.
a.) In Xcode, go to File.
b.) click on File -> New File.
c.) select Resources (under Mac OS X).
d.) select Property List file template.
e.) click on choose.
f.) save and name it as “country”.
Fill it with the name of some countries and save it in the “Resources” directory.
The plist will look something like this,
b.)Code for “sortViewController.m” file
#import "sortViewController.h"
@implementation sortViewController
@synthesize segmentedControl;
@synthesize tableView;
-(IBAction) do_sorting{
if (segmentedControl.selectedSegmentIndex == 1) {
NSSortDescriptor * sortDesc = [[NSSortDescriptor alloc] initWithKey:@"self" ascending:NO];
[sortedArray sortUsingDescriptors:[NSArray arrayWithObject:sortDesc]];
[tableView reloadData];
}
else {
NSSortDescriptor * sortDesc = [[NSSortDescriptor alloc] initWithKey:@"self" ascending:YES];
[sortedArray sortUsingDescriptors:[NSArray arrayWithObject:sortDesc]];
[tableView reloadData];
}
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 1;
}
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
return @"Country";
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return [sortedArray count];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = [[UITableViewCell alloc]
initWithStyle:UITableViewCellStyleDefault
reuseIdentifier:@"cell"];
cell.textLabel.text = [sortedArray objectAtIndex:indexPath.row];
return cell;
}
// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.
- (void)viewDidLoad {
NSString *myfile = [[NSBundle mainBundle]
pathForResource:@"country" ofType:@"plist"];
sortedArray = [[NSMutableArray alloc]initWithContentsOfFile:myfile];
NSSortDescriptor * sortDesc = [[NSSortDescriptor alloc] initWithKey:@"self" ascending:YES];
[sortedArray sortUsingDescriptors:[NSArray arrayWithObject:sortDesc]];
[super viewDidLoad];
}
// Override to allow orientations other than the default portrait orientation.
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
return YES;
}
- (void)didReceiveMemoryWarning {
// Releases the view if it doesn't have a superview.
[super didReceiveMemoryWarning];
// Release any cached data, images, etc that aren't in use.
}
- (void)viewDidUnload {
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;
}
- (void)dealloc {
[super dealloc];
}
@end
We synthesize the “SegmentedControl” and “TableView” object .
In the “numberOfSectionsInTableView” method we return 1 as we are having only 1 section in the Table and we set the Title for the table as “Country”.
In “viewDidLoad” method, we bundle the plist with the Array object “sortedArray”. We then declare an object of “NSSortDescriptor” class that is a built in class which is used for sorting.
When app is loaded, table is filled with the elements of the array “sortedArray”.
“do_sorting” method sorts the list in ascending or descending order as required by using “NSSortDescriptor” class.
4.)Building the Connections
Our next step is to build the connections between the code we have written with our Interface elements.
a.)So we click on the “sortViewController.xib” in the “Resources” folder to launch “Interface Builder.
b.)There in the “Document window” we select “File’s Owner” and right click it.
c.)Now a window pops up which shows all the “Outlets and Actions” defined by us.
d.)Do the connections as shown below.
5.)Build and Run
Now finally we have to go to the Xcode and there at the top bar we see “Build and Run”. Just click it to run the application. Make sure we have saved our application before doing this.
So finally our app will look something like this:-
Name the file as ShakeView.
