您好,登錄后才能下訂單哦!
本章目標: 了解ios tableView (tableView 和android 中的 listView是一個性質的 ) 的結構,樣式,和簡單使用
在手機應用程序中我們常常看到 集合列表內容, 它們是怎么實現的呢,這一章我們 來分解分解。
在iphone 中, tableView 主要分為兩個樣式 ,如下
兩種樣式 如圖 :
這一章我們先做一個簡單列表
下面我們開始 做一個基本的列表風格 demo
1: 創建一個 Single View Application 模板的ios 應用程序 項目信息部分如下圖:
點擊 next 選擇保存位置,創建好后
如果你的命名和上圖中的命名是一致的話。application會包含一個 TableViewVieiwController.xib 文件, 打開此 xib 文件。 為我們的視圖文件添加一個UiTableView組件。 如下圖
添加UitableView 我們還需要給 Uitableview添加委托喝數據源呢, 按住Ctrl鍵 點擊 上圖中的 Objects-》View -》TableView 會彈出一個小框框,我們需要把 TableView組件下面的Outlets 下的 dataSource(數據源)和 delegate(委托) 于我們的控制器建立連接 , 按住ctrl 把dataSource(數據源)和 delegate(委托) 后面的 小圓圈,拖到File‘s Owner 上面去 ,建立完成后 如下圖
接下來 我們來編寫我們的 控制器
打開 TableViewViewController.h 為我們的UiTableView組件添加協議,表示這表視圖的委托喝數據源 。和一個NsArray數據集合用于存放表視圖要顯示的數據。
代碼如下 :
#import <UIKit/UIKit.h>
@interface TableViewViewController : UIViewController<UITabBarDelegate,UITableViewDataSource>
@property(nonatomic,retain) NSArray *listData;
@end
其中藍色部分是我們添加的代碼。
保存文件,把代碼切換到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 因為我們沒有使用 自動內存管理計數器。
3:因為我們沒有使用自動內存管理計數器,所以我們還需要 銷毀 listData 集合。所以還需要 下面代碼
- (void)dealloc
{
self.listData=nil;
[super dealloc];
}
- (void)viewDidLoad
{
[self.listData release];
[super viewDidLoad];
}
其中 dealloc 方法 需要我們自己寫出來,xcode 并沒有為我們生成出來。
4: 視圖控制器最核心的方法 ,就是這里面, 就是為表視圖實現委托和數據源了。 先看代碼 。
#pragma mark-
#pragma mark Table View Data Source Methods
//返回總行數
-(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];
}
//取得當前行
NSUInteger row=[indexPath row];
cell.textLabel.text=[listData objectAtIndex:row]; //設置每一行要顯示的值
return cell;
}
上面代碼中我們定義了一個靜態的字符串常量,用此字符串來表示表單元的鍵,把上面的代碼添加到TableViewViewController.m 文件的 尾部 ,是 @end 上面喔 。
至此 我們完成了一個簡單的視圖列表 ,趕快保存,運行 看看效果吧。
效果圖:
我們再來 給 表視圖 添加點元素,讓視圖更多元話,首先先給 表視圖添加一個 圖片。 在ios下面 給 表視圖的行左側 添加一個圖片非常簡單,因為ios 已經為我們想好了 。看代碼 (藍色部分):
//為每一行賦值
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];
}
//取得當前行
NSUInteger row=[indexPath row];
cell.p_w_picpathView.p_w_picpath=[UIImage p_w_picpathNamed:@"city.png"];
cell.textLabel.text=[listData objectAtIndex:row]; //設置每一行要顯示的值
return cell;
}
一行代碼 就搞定了。方便吧, 在ios的 表視圖 中 ,每個單元都有一個ImageView 屬性,每個p_w_picpathView又包含了Image屬性和一個HighlightedImage屬性, HighlightedImage的屬性是 選中時候 顯示的p_w_picpath 感興趣的同學趕快去試試吧。
UiImage使用的是文件名的緩存機制,所以它不會每次調用都重新加載,而是使用已經加載的版本。
這一章 先到這里了,下一章我們來看看 表格視圖的單元樣式。 歡迎大家拍磚
本章代碼下載地址 :
https://blog.51cto.com/ext/down_att.php?aid=36008&code=4727
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。