IOS 8編程入門--使用swift語言 專題目錄:
...............
使用prototype?Cell定制Table View
在上一章,我們使用平常的單元格風格創建了一個簡單的基于表格的App來顯示一系列餐館名。再這一張,我們將要定制單元格讓它看起來更好看。我們將會一起做一系列的修改:
1、使用UITableView?Controller替代UITableView重建App
2、為每個餐館使用不同的圖片替代每個餐館一樣的縮略圖
3、定制表格單元格而不是使用基礎風格的表格單元格
你可能很奇怪為什么我們需要重建一樣的App。做一件事情有很多的方法。上次我們使用對象庫的UITableView創建表格。這次我們使用UITableView Controller創建表格。這種方法會更簡單嗎?回答是肯定的。回憶一下在原來的例子里我們需要明確實現UITableViewDataSource和UITableViewDelegate協議,UITableView Controller實現了這些協議并且已經建立好了關聯。除上面之外,它還包含容器右側自動布局的約束。
使用UITableView?Controller創建表格App
首先,讓我們看一下如何使用UITableView Controller重建Simple Table App。先打開Xcode。然后使用“Single View application”模版創建一個新項目。將這個項目命名為FoodPin,然后填寫Xcode工程所需要的其他信息,就像你在前面章節一樣。
Xcode工程建立完畢后,選擇“Main.storyboard”打開Interface builder。和前面一樣禁用Size Classes。在文件查看器里,取消“Use Size Classes”并且選擇iPhone設備。因為我們選擇了“Single View application”模版,會發現Xcode在storyboard中已經生成了一個默認的view controller。這次我們不使用默認的controller。所以選中view controller然后點擊delete按鈕刪除它。view controller和ViewController.swift關聯。我們同樣不需要。在工程導航窗口,選擇ViewController.swift同樣刪除它。
回到storyboard。從對象庫拖拽一個Table View Controller(或者UITableView?Controller)并且把它放在storyboard。你需要指定這個view controller作為初始view controller,即第一個加載的view controller。選擇屬性檢查器并且選中“Is Initial View?Controller”選項。隨后你將會看到一個指向table view controller的箭頭。
如果你現在編譯和運行App,那將會看到一個空白表格的App。很明顯,我們還沒有插入任何數據到表格里。
現在,我們添加的table view controller和默認的UITableView Controller類關聯。為了添加數據,我們需要將table
view controller和我們自己的類關聯。
回到工程導航窗口并且右擊FoodPin文件夾。選擇“New Files...”創建新文件。選擇“Cocoa Touch Class”作為模版然后點擊“Next”。為新的類命名為”RestaurantTableViewController”。因為新類是從UITableView Controller中擴展的,所以修改“Subclass of”的值為“UITableView Controller”。其他選項值保持不變。點擊“Next”并且在項目文件夾中存儲。這樣就在工程里創建了一個RestaurantTableViewController.swift文件。
超類和子類
Swift是面向對象語言(OOP)。在OOP中,一個類可以由另一個類繼承而來。在這次的例子里,RestaurantTableViewController類就是從UITableView?Controller類繼承而來。RestaurantTableViewController繼承了UITableView Controller類所有的狀態和功能。RestaurantTableViewController就稱為UITableViewController的子類。換句話說UITableView?Controller就是RestaurantTableViewController類的父類或者超類。
在storyboard中的table?view controller并不知道RestaurantTableViewController類的存在。所以下一步我們需要在table view controller和新的類之間建立聯系。回到storyboard并且選擇table view controller。在標志查看器(Identity Inspector)中選擇custom class為RestaurantTableViewController。現在我們在storyboard中的table view controller和新類之間建立了聯系。
還有一件事情,配置table view。選擇單元格。在屬性查看器中修改單元格風格為“Basic”并且設置標識名為“Cell”。
OK,用戶界面準備好了。讓我們回到編碼工作。選擇項目導航窗口中的RestaurantTableViewController.swift然后聲明一個變量實例來保存表格數據。
前面說過了UITableView Controller已經實現了UITableViewDataSource協議。如果你還記得,我們需要實現下面的方法:
tableView(_:numberOfRowsInSection:)
tableView(_:cellForRowAtIndexPath:)
UITableViewController類為這兩個方法提供了默認實現。通常情況下,這些默認實現的方法不適合我們自己的App,我們這個App也有這個問題。我們需要重載默認實現的方法并且提供我們自己的實現。添加下面的代碼到RestaurantTableViewController.swift:
在Swift中,要重載超類的方法我們只需要在方法開頭處添加override。上面的代碼和前面的章節里的代碼是一樣的,所以這里我們不在介紹這些代碼的細節。
下一步,我們修改RestaurantTableViewController中的代碼片段。再Xcode創建類文件時這些代碼就生成了。默認情況下,方法返回表格節數為0。但是我們要實現的表格有一個節。
順便提一下,上面的代碼是可選的。如果你移除它,表格依然默認被設置為1節。
現在從http://pan.baidu.com/s/1jIOL1Pk 下載圖片壓縮包,并且將全部圖片拖到images.xcassets。如果你忘記了操作過程可以參考上一章。現在點擊“Run”按鈕,你的FoodPin App會看起來和我們前面創建的simple table app一樣。