本章目標(biāo): 了解ios tableView (tableView 和android 中的 listView是一個性質(zhì)的 ) 的結(jié)構(gòu),樣式,和簡單使用
創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價比葉城網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式葉城網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋葉城地區(qū)。費用合理售后完善,十多年實體公司更值得信賴。
在手機(jī)應(yīng)用程序中我們常??吹?集合列表內(nèi)容, 它們是怎么實現(xiàn)的呢,這一章我們 來分解分解。
在iphone 中, tableView 主要分為兩個樣式 ,如下
兩種樣式 如圖 :
這一章我們先做一個簡單列表
下面我們開始 做一個基本的列表風(fēng)格 demo
1: 創(chuàng)建一個 Single View Application 模板的ios 應(yīng)用程序 項目信息部分如下圖:
點擊 next 選擇保存位置,創(chuàng)建好后
如果你的命名和上圖中的命名是一致的話。application會包含一個 TableViewVieiwController.xib 文件, 打開此 xib 文件。 為我們的視圖文件添加一個UiTableView組件。 如下圖
添加UitableView 我們還需要給 Uitableview添加委托喝數(shù)據(jù)源呢, 按住Ctrl鍵 點擊 上圖中的 Objects-》View -》TableView 會彈出一個小框框,我們需要把 TableView組件下面的Outlets 下的 dataSource(數(shù)據(jù)源)和 delegate(委托) 于我們的控制器建立連接 , 按住ctrl 把dataSource(數(shù)據(jù)源)和 delegate(委托) 后面的 小圓圈,拖到File‘s Owner 上面去 ,建立完成后 如下圖
接下來 我們來編寫我們的 控制器
打開 TableViewViewController.h 為我們的UiTableView組件添加協(xié)議,表示這表視圖的委托喝數(shù)據(jù)源 。和一個NsArray數(shù)據(jù)集合用于存放表視圖要顯示的數(shù)據(jù)。
代碼如下 :
#import
@interface TableViewViewController : UIViewController
@property(nonatomic,retain) NSArray *listData;
@end
其中藍(lán)色部分是我們添加的代碼。
保存文件,把代碼切換到TableViewViewController.m 類中。
1: 在開頭部分的@implementation TableViewViewController 下面添加
@synthesize listData; 此方法會為我們自動生成 get set 方法 。
2: 在 - (void)viewDidLoad 方法中,初始化listData集合,代碼如下:
- (void)viewDidUnload
{
[super viewDidUnload];
NSArray *array=[[NSArray alloc]initWithObjects:@"廣州",@"深圳",@"梅州",@"東莞",@"潮汕",@"肇慶",@"四會",@"佛山",@"湛江",@"江門",@"陽江",@"珠海", nil];
self.listData=array;
[array release];
}
上面代碼中 我們需要自己銷毀 array 因為我們沒有使用 自動內(nèi)存管理計數(shù)器。
3:因為我們沒有使用自動內(nèi)存管理計數(shù)器,所以我們還需要 銷毀 listData 集合。所以還需要 下面代碼
- (void)dealloc
{
self.listData=nil;
[super dealloc];
}
- (void)viewDidLoad
{
[self.listData release];
[super viewDidLoad];
}
其中 dealloc 方法 需要我們自己寫出來,xcode 并沒有為我們生成出來。
4: 視圖控制器最核心的方法 ,就是這里面, 就是為表視圖實現(xiàn)委托和數(shù)據(jù)源了。 先看代碼 。
#pragma mark-
#pragma mark Table View Data Source Methods
//返回總行數(shù)
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
NSLog(@"count is %d",[self.listData count]);
return [self.listData count];
}
//為每一行賦值
static NSString *SimpleTableIdentifier=@"SimpleTableIdentifier";
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier];
if(cell==nil){//如果行元素為空的話 則新建一行
cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier];
}
//取得當(dāng)前行
NSUInteger row=[indexPath row];
cell.textLabel.text=[listData objectAtIndex:row]; //設(shè)置每一行要顯示的值
return cell;
}
上面代碼中我們定義了一個靜態(tài)的字符串常量,用此字符串來表示表單元的鍵,把上面的代碼添加到TableViewViewController.m 文件的 尾部 ,是 @end 上面喔 。
至此 我們完成了一個簡單的視圖列表 ,趕快保存,運行 看看效果吧。
效果圖:
我們再來 給 表視圖 添加點元素,讓視圖更多元話,首先先給 表視圖添加一個 圖片。 在ios下面 給 表視圖的行左側(cè) 添加一個圖片非常簡單,因為ios 已經(jīng)為我們想好了 ??创a (藍(lán)色部分):
//為每一行賦值
static NSString *SimpleTableIdentifier=@"SimpleTableIdentifier";
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier];
if(cell==nil){//如果行元素為空的話 則新建一行
cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier];
}
//取得當(dāng)前行
NSUInteger row=[indexPath row];
cell.p_w_picpathView.p_w_picpath=[UIImage p_w_picpathNamed:@"city.png"];
cell.textLabel.text=[listData objectAtIndex:row]; //設(shè)置每一行要顯示的值
return cell;
}
一行代碼 就搞定了。方便吧, 在ios的 表視圖 中 ,每個單元都有一個ImageView 屬性,每個p_w_picpathView又包含了Image屬性和一個HighlightedImage屬性, HighlightedImage的屬性是 選中時候 顯示的p_w_picpath 感興趣的同學(xué)趕快去試試吧。
UiImage使用的是文件名的緩存機(jī)制,所以它不會每次調(diào)用都重新加載,而是使用已經(jīng)加載的版本。
這一章 先到這里了,下一章我們來看看 表格視圖的單元樣式。 歡迎大家拍磚
本章代碼下載地址 :
https://blog.51cto.com/ext/down_att.php?aid=36008&code=4727