iOS Storyboard 学习之 新建Navigation的UITableView demo

文章内容只是把关键的地方在文中讲解了一下，完整的代码在文章最后，请下载对比自己的代码。

1 建立一个项目 “StoryboardUITableViews”，选择Single
View Application



2 点击“MainStoryboard.storyboard” 选择“Editor
> Embed In > Navigation Controller”



会出现一个Navigation
Controllers



3 在右边的View Controller上放置一个Table View



4 编辑ViewController.h文件，加入如下



@interface ViewController
: UIViewController<UITableViewDelegate,UITableViewDataSource> {

}

5 点击“MainStoryboard.storyboard”，找到“View
Controller”，点击“Table View” 按住 “Control”键拖动到“View
Controller”上，然后选择"data source"，重复之前的拖动，选择"delegate".



6 找到“View
Controller”，点击"Table
View Cell"，选择“Attribute Inspector”，在“Identifier”中填写“Cell”，然后回车，随后"Table
View Cell"变为"Table
View Cell - Cell"，保存。



7 编辑“ViewController.h”



#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDelegate, UITableViewDataSource>{

}

@property(nonatomic, retain)NSMutableDictionary *states;

@property(nonatomic, retain)NSArray *datasource;

-(void)setupArray;

@end

9 增加显示详情的文件

建立文件File
> New File > UIViewController Subclass 名为 “DetailViewController”



然后增加一个“View Controller”，配置Identifier为“detail”





选择Class为”DetailViewController“
然后编辑"DetailViewController.h"



#import <UIKit/UIKit.h>



@interface DetailViewController : UIViewController{

NSString *state;

NSString *capital;

IBOutlet UILabel *stateLabel;

IBOutlet UILabel *capitalLabel;

}

@property (nonatomic, retain)NSString *state,
*capital;

@property (nonatomic, retain)IBOutlet UILabel *stateLabel,
*capitalLabel;

@end
"DetailViewController.m"





@synthesize state,capital,stateLabel, capitalLabel;



- (void)viewDidLoad

{

[super viewDidLoad];

stateLabel.text = state;

capitalLabel.text = capital;

}



9 编辑“ViewController.m”，实第四步加入的<UITableViewDelegate,UITableViewDataSource> 的protocol

头部加入

#import "DetailViewController.h"

首先声明个数据源



-(void)setupArray{



states =
[[NSMutableDictionary alloc]init];

[states setObject:@"Lansing" forKey:@"Michigan"];

[states setObject:@"Sacremento" forKey:@"California"];

[states setObject:@"Albany" forKey:@"New
York"];

[states setObject:@"Phoenix" forKey:@"Arizona"];

[states setObject:@"Tulsa" forKey:@"Oklahoma"];



datasource =
[states allKeys];

}

然后加入三个基本的方法

9.1 会有多少列

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



{
return 5;



}

9.2 如何显示列名





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

{

static NSString *CellIdentifier
= @"Cell";

UITableViewCell *cell = (UITableViewCell *)
[tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle
reuseIdentifier:CellIdentifier];

}

UIImageView *imageView = [[UIImageView alloc] initWithFrame:cell.frame];

UIImage *image = [UIImage imageNamed:@"LightGrey.png"];

imageView.image = image;

cell.backgroundView = imageView;

[[cell textLabel] setBackgroundColor:[UIColor clearColor]];

[[cell detailTextLabel] setBackgroundColor:[UIColor clearColor]];



cell.textLabel.text = [datasource objectAtIndex:indexPath.row];



cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;



return cell;

}

9.3 点击列名后的动作“ 这一步可以看出StoryBoard真的是给我们简化了很多工作
”





-(void)tableView:(UITableView *)tableView
didSelectRowAtIndexPath:(NSIndexPath *)indexPath{



DetailViewController *detail = [self.storyboard instantiateViewControllerWithIdentifier:@"detail"];

detail.state = [datasource objectAtIndex:indexPath.row];

detail.capital = [states objectForKey:detail.state];

[self.navigationController pushViewController:detail animated:YES];



}

10 点击“MainStoryboard.storyboard”，在“View
Controller”上加入两个Label “State”和“Capital”



然后分别链接“State”和“Capital”到“stateLabel”和“capitalLabel”



以上完成了就大功告成了。应该可以看到





实例二：

如果要表格中增加数据的话，需要增加UITableViewDataSource协议。

如果需要响应用户单击的话，需要增加UITableViewDelegate协议。

1、创建项目：使用模板Single View Application新建一个项目，仅支持iPhone。

2、在ViewController.h中增加UITableViewDataSource和UITableViewDelegate协议，如下：

[cpp] view
plaincopy

#import <UIKit/UIKit.h>



@interface ViewController : UIViewController<UITableViewDataSource, UITableViewDelegate> {



NSArray * listData;

}



@property ( nonatomic, retain) NSArray *listData;



@end

3、往列表中增加数据，实现UITableViewDataSource协议，如下：

[cpp] view
plaincopy

//返回总行数

-(NSInteger ) tableView:(UITableView *)tableView



numberOfRowsInSection:(NSInteger )section



{

return [ self.listData count ];



}



// 添加每一行的信息

- (UITableViewCell *) tableView:(UITableView *)tableView

cellForRowAtIndexPath:(NSIndexPath *)indexPath



{



NSString *tag=@"tag";



UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:tag];



if (cell==nil ) {

cell=[[[ UITableViewCell alloc ] initWithFrame : CGRectZero

reuseIdentifier:tag] autorelease];

}



NSUInteger row=[indexPath row];



//设置文本

cell.text =[listData objectAtIndex :row];



//选中后的颜色又不发生改变，进行下面的设置

//cell.selectionStyle = UITableViewCellSelectionStyleNone;



//不需要分割线

//tableView.separatorStyle=UITableViewCellSeparatorStyleNone;



return cell;



}

4、响应用户单击事件，实现UITableViewDelegate协议，如下：

[cpp] view
plaincopy

//响应用户单击事件

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{



UIAlertView* showSelection;

NSString* message;



message = [[NSString alloc]initWithFormat:@"You chose the : %@",

[self.listData objectAtIndex:indexPath.row]];



showSelection = [[UIAlertView alloc]

initWithTitle:@"Selected"

message:message

delegate:nil

cancelButtonTitle:@"OK"

otherButtonTitles:nil];



[showSelection autorelease];

[showSelection show];

}

5、往ViewController中增加UITableView，并将UITableView的delegate和dataSource连接到ViewController。如下图所示：



6、完整的代码如下：

[cpp] view
plaincopy

#import "ViewController.h"



@interface ViewController ()



@end



@implementation ViewController



@synthesize listData;



- (void)viewDidLoad

{



self.listData =[[NSArray alloc] initWithObjects:@"Item1",@"Item2",@"Item3", @"Item4", @"Item5", @"Item6", @"Item7",nil];;



[super viewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

}



- (void)viewDidUnload

{

self.listData = nil;



[super viewDidUnload];

// Release any retained subviews of the main view.

}



- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation

{

return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);

}





#pragma mark - Table view data source delegate



//返回总行数

-(NSInteger ) tableView:(UITableView *)tableView

numberOfRowsInSection:(NSInteger )section

{

return [ self.listData count ];

}



// 添加每一行的信息

- (UITableViewCell *) tableView:(UITableView *)tableView

cellForRowAtIndexPath:(NSIndexPath *)indexPath



{



NSString *tag=@"tag";



UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:tag];



if (cell==nil ) {

cell=[[[ UITableViewCell alloc ] initWithFrame : CGRectZero

reuseIdentifier:tag] autorelease];

}



NSUInteger row=[indexPath row];



//设置文本

cell.text =[listData objectAtIndex :row];



//选中后的颜色又不发生改变，进行下面的设置

//cell.selectionStyle = UITableViewCellSelectionStyleNone;



//不需要分割线

//tableView.separatorStyle=UITableViewCellSeparatorStyleNone;



return cell;



}



#pragma mark - Table view data delegate



//响应用户单击事件

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{



UIAlertView* showSelection;

NSString* message;



message = [[NSString alloc]initWithFormat:@"You chose the : %@",

[self.listData objectAtIndex:indexPath.row]];



showSelection = [[UIAlertView alloc]

initWithTitle:@"Selected"

message:message

delegate:nil

cancelButtonTitle:@"OK"

otherButtonTitles:nil];



[showSelection autorelease];

[showSelection show];

}



@end

完整的代码请到github下载：https://github.com/xxd/StoryboardTutorial-UITableViews1
http://www.cnblogs.com/buro79xxd/archive/2012/03/06/2381548.html