亚洲免费在线-亚洲免费在线播放-亚洲免费在线观看-亚洲免费在线观看视频-亚洲免费在线看-亚洲免费在线视频

【一步一步學(xué)IOS5 】 創(chuàng)建一個簡單的表視圖(Tab

系統(tǒng) 2728 0

首先,在iPhone App中的表視圖是什么?

?

表視圖(Table View) 是IOS Apps 中一個通用的UI元素。很多應(yīng)用程序在一定程度上,都有使用表視圖來顯示數(shù)據(jù)列表。最好的例子是內(nèi)置的iPhone應(yīng)用程序。你的聯(lián)系人顯示在表視圖中。另外一個例子是Mail應(yīng)用程序,它使用表視圖顯示你的郵箱和郵件。不僅可以用來顯示文本數(shù)據(jù),表視圖也可以呈現(xiàn)圖像數(shù)據(jù)。內(nèi)置的Video和YouT ube應(yīng)用程序是這一用法的例子

?

1.創(chuàng)建simpleTable 項目

?

啟動Xcode, 創(chuàng)建一個Single View application 的新項目

?

輸入Xcode項目所有必須的選項:

Product Name: SimpleTable

?

Company Identifier: com.appcode

?

Class Prefix: SimpleTable

?

Device Family: iPhone

?

Use Storyboards:[不選擇]

?

Use Automatic Reference Counting:[選擇]

?

Include Unit Test:[不選擇]

?

?

2.設(shè)計視圖

?

首先,我們將創(chuàng)建用戶界面,并添加表視圖。選擇SimpleTableViewController.xib文件,切換到Interface Builder界面。

?

在對象庫(Object Library)中,選擇Table View對象,并拖拽到視圖中。

?

?

3.第一次運行你的應(yīng)用程序

在繼續(xù)之前,嘗試使用模擬器運行你的應(yīng)用程序。點擊Run按鍵構(gòu)建你的App并進(jìn)行測試。

?

模擬器屏幕如下圖所示:


【一步一步學(xué)IOS5 】 創(chuàng)建一個簡單的表視圖(Table View)應(yīng)用程序

?

?

我們已經(jīng)設(shè)計好了表視圖,但是,現(xiàn)在它沒有包含任何數(shù)據(jù)。接著,我們將編寫代碼,添加表數(shù)據(jù)。

?

4.添加表數(shù)據(jù)

?

返回項目導(dǎo)航欄,選擇SimpleTableViewController.h 文件。 在UIViewController 之后,添加<UITableViewDelegate,UITableViewDataSource>。完成后代碼如下所示:

?

?

#import <UIKit/UIKit.h>

?

@interface SimpleTableViewController : UIViewController < UITableViewDelegate , UITableViewDataSource >

?

@end

?

?

在Object-C中,UITableViewDelegate和UITableViewDataSource稱為協(xié)議。基本上,為了在表視圖中顯示數(shù)據(jù),我們必須遵守定義在協(xié)議中的要求,并實現(xiàn)所有要求的方法。

?

UITableViewDelegate 和 UITableViewDataSource

?

UITableView 是表視圖幕后的實際類,用來靈活處理不同的數(shù)據(jù)類型。你可以顯示國家列表或者聯(lián)系人姓名。或者像本示例一樣,我們將使用表視圖程序菜譜列表。因此,你可以告訴UITableView需求顯示的數(shù)據(jù)列表呢?

?

UITableViewDataSource 是答案,它用來連接你的數(shù)據(jù)和表視圖。

?

UITableViewDataSource 協(xié)議定義了2個要求實現(xiàn)的的方法

?

(tableView:cellForRowAtIndexPath 和 tableView:numberOfRowsInSection)。通過實現(xiàn)這些方法,你告訴表視圖顯示多少行數(shù)據(jù)和每一行數(shù)據(jù)。

?

UITableViewDelegate 負(fù)責(zé)處理UITableView的表現(xiàn)。協(xié)議中可選方法讓你管理表行的高度,配置節(jié)點頭部和底部,對表單元重新排序等等。

?

接著,選擇SimpleTableViewController.m 文件,定義一個實例變量,存放數(shù)據(jù)。

?

@implementation SimpleTableViewController

{

NSArray * tableData;

}

?

在viewDidLoad方法中(Called after the controller's view is loaded into memory - 在控制器的視圖裝載到內(nèi)存中完成之后,調(diào)用該方法),添加如下代碼實例化 tableData 數(shù)組。我們初始化數(shù)組位菜譜離列表:

?

- ( void )viewDidLoad

{

? ? [ super viewDidLoad ];

? ? //Initialize table data

? ? tableData = [ NSArray arrayWithObjects : @"Egg Benedict" , @"Mushroom Risotto" , @"Full Breakfast" , @"Hamburger" , @"Ham and Egg sandwith" , @"Creme Brelee" , @"White Chcolate Dount" , @"Starbucks Coffee" , @"Vegetable Curry" , @"Instant Noodle with Egg" , @"Noodle with BBQ Pork" , @"Japanese Noodle with Pork" , @"Green Tea" , @"Thai Shrimp Cake" , @"Angry Birds Cake" , @"Ham and Cheese Panini" , nil ];

}

?

在Object-C中,NSArray 是創(chuàng)建和管理數(shù)組的類,你可以使用NSArray創(chuàng)建靜態(tài)數(shù)組,其容量是固定的。如果你需要創(chuàng)建動態(tài)數(shù)組,則使用NSMutableArray代替。

?

NSArray提供了一組工廠方式來創(chuàng)建數(shù)組對象。在我們的代碼中,我們使用arrayWithObjects來實例化一個NSArray對象,并預(yù)先填充特定的元素(如Hamburger)。

?

最后,我們需要添加2個數(shù)據(jù)源方法:tableView:numberOfRowInSection 和 tableView:cellForRowAtIndexPath。這兩個方法是UITableViewDataSource協(xié)議的一部分。在配置UITableView時,需要強制實現(xiàn)這兩個方法。

?

第一個方法用來通知表視圖選擇了多少條數(shù)據(jù)行,因此添加如下代碼。count方法簡單返回tableData數(shù)組中元素個數(shù)。

?

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

{

? ? return [ tableData count ];

}

?

接著,我們實現(xiàn)另外一個需要實現(xiàn)的方法:

?

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

{

? ? static NSString *simpleTableIdentifier = @"simpleTableItem" ;

? ? UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier :simpleTableIdentifier];

?

? ? if (cell == nil ) {

? ? ? ? cell = [[ UITableViewCell alloc ] initWithStyle : UITableViewCellStyleDefault reuseIdentifier :simpleTableIdentifier];

? ? }

?

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

return cell;

}


每一次數(shù)據(jù)顯示的時候,都會調(diào)用cellForeRowAtIndexPath方法。下圖讓你更好的理解UITableview和UITableDataSource是如何工作的。


【一步一步學(xué)IOS5 】 創(chuàng)建一個簡單的表視圖(Table View)應(yīng)用程序
?

請求數(shù)據(jù)源,在表視圖的特定位置插入一個單元格。表視圖中可見的每一行都會觸發(fā)該事件。事件包含的參數(shù)之一是NSIndexPath類型。NSIndexPath類表示數(shù)組集合中的某個特定項的路徑。要知道當(dāng)前填充的是哪一行,只需要調(diào)用NSIndexPath對象(indexPath)的row屬性,然后使用行號來引用tableData數(shù)組中元素即可。得到的值被用來設(shè)置表視圖中該行的文本值。

需要注意的的是,這里使用UITableView類的dequeueReusableCellWithIdentifer:方法獲取UITableViewCell類的一個實例。

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:simpleTableIdentifier];

dequeueReusableCellWithIdentifier:方法返回是一個可重用的表視圖單元格對象。因為如果表非常大,為每一行都創(chuàng)建一個單獨的UITableViewCell對象會產(chǎn)生嚴(yán)重的性能問題,并占用大量的內(nèi)存。

此外,由于表視圖在某一時刻只會顯示固定數(shù)量的行,因此重用已經(jīng)滾動到屏幕外面的那些單元格將非常有意義。這正是dequeueReusableCellWithIdentifier:方法將要完成的事情。比如,如果表視圖顯示了10行,那么只會創(chuàng)建10個UITableViewCell對象 --- 當(dāng)用戶滾動表視圖時,總是會重用這10個UITableViewCell 對象。

5.連接數(shù)據(jù)源(DataSource) 和 委托(Delegate)

像第一個Hello World 應(yīng)用程序一樣,我們需要在表視圖和創(chuàng)建的2個方法之間建立連接。

返回SimpleTableViewController.xib,點擊并按住Control鍵,選擇表視圖,并拖拉到File's Owner圖上,釋放按鈕,彈出dataSource 和 delegate窗口。選擇dataSource,在表視圖和它的數(shù)據(jù)源之間建立連接。重復(fù)上述操作,在委托(delegate)上也建立連接。

就這些了,為了確保正確建立了連接,你可以再次選擇表視圖。在工具區(qū)域(Utility Area)的上部,點擊Connecion Inspector顯示所有現(xiàn)存的連接。

6.測試你的應(yīng)用程序

最后,點擊Run按鈕,讓模擬器裝載你的App

7.在表視圖中添加縮略圖

右擊SimpleTable 文件夾,選擇Add Files to SimpleTable...

選擇一個圖像文件,同時選中Copy Item to destination group's folder 復(fù)選框。點擊OK按鈕添加該文件。

現(xiàn)在編輯SimpleTableViewController.m 文件,添加如下代碼行到tableView:cellForRowAtIndexPath方法中:

cell.imageView.image = [UIImage imageNamed:@"creme_brelee.jpg"];

添加的代碼行裝在圖像文件,并保存在表單元格的圖像區(qū)域。現(xiàn)在,再次點擊Run按鈕,你的應(yīng)用程序應(yīng)該在每一行顯示圖像了:


【一步一步學(xué)IOS5 】 創(chuàng)建一個簡單的表視圖(Table View)應(yīng)用程序
?


【一步一步學(xué)IOS5 】 創(chuàng)建一個簡單的表視圖(Table View)應(yīng)用程序


更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主

微信掃碼或搜索:z360901061

微信掃一掃加我為好友

QQ號聯(lián)系: 360901061

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。

【本文對您有幫助就好】

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描上面二維碼支持博主2元、5元、10元、自定義金額等您想捐的金額吧,站長會非常 感謝您的哦!!!

發(fā)表我的評論
最新評論 總共0條評論
主站蜘蛛池模板: 亚洲精品无码不卡在线播放he | 97在线观看成人免费视频 | 色老老精品偷偷鲁 | 国产福利区一区二在线观看 | 亚洲无线码一区在线观看 | 4hu四虎免费影院www | 97视频免费| 久久精品国产欧美 | 久久亚洲精品国产亚洲老地址 | 色综合色综合色综合色综合网 | 国产一级毛片一区二区三区 | 国产乱子伦一级毛片 | 在线韩日| 狠狠地射| 日本人一级毛片免费完整视频 | 香蕉久久夜色精品国产小说 | 久久久久久久久久爱 | 久久精品一区 | 亚洲视频 欧美视频 | 欧美亚洲国产色综合 | 天天成人综合网 | 男人看片网站 | 久久国产网 | 91亚洲最新精品 | 亚洲精品中文字幕乱码三区一二 | 奇米网在线视频 | 99久久免费国产精品 | 黄色免费看视频 | 欧美亚洲国产视频 | 久久艹精品 | www.一级毛片| 久久免费激情视频 | 狠狠色丁香婷婷综合小时婷婷 | 免费成人高清视频 | 99热这里只有精品2 99热这里只有精品3 | 亚洲欧美国产五月天综合 | 久久色吧 | 国产欧美亚洲精品第3页在线 | 伊人久久青草青青综合 | 欧美精品专区免费观看 | 免费看欧美毛片大片免费看 |