在這邊說明一下如何達到這個效果,首先先開啟一個新的專案。
新增一個User Interface,並選擇Empty,並命名為CustomTableCell
此時你會得到一個空的xib,在右下角選擇Table View Cell,並將它拉入畫面中
將這個Cell的高度設定為300,並拉入兩個元件,UIImageView與UILabel,將你的Cell拉成這個樣子。
接著,在新增一個Cocoa Touch Class,命名為CustomTableCell並繼承UITableViewCell
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_rs7MiQYuIxna2uJfN-Q8jmIVpnIkBZujEvX_CupxNhcD_ZX5dtkDpLOWIPV96KiZpX_WhtMW37exUqhcpzzn3rqaoi3OsULB8CpxDPGgPLZ2wyTSE5RjZIqVAotgDCwEjbkXrq918WRb/s640/%25E8%259E%25A2%25E5%25B9%2595%25E5%25BF%25AB%25E7%2585%25A7+2015-12-16+%25E4%25B8%258A%25E5%258D%258811.41.35.png)
接著,選回CustomTableCell.xib,將Custom Class的Class設定為CustomTableCell
將剛才新增的兩個元件,加入IBOutlet
回到Main.storyboard,加入UItableView與Cell
針對這個Cell做三件事
1. 將Custom Class 改為 CustomTableCell
2.將Identifier命名為 Cell
3.將此Cell高度設為300
跟使用一般UITableView一樣,必須實作UITableViewDataSource與UITableViewDelegate兩個protocol。
不過要注意的一點是,在viewDidLoad時,必須要註冊你的xib,這樣才能讓它們關聯起來
forCellReuseIdentifier要填入上面你所命名的Cell Identifier
接著我們先將圖片加入專案之中
這裡放了三張圖,我們假設顯示三筆資料,分別是三個國家圖,與名稱。
最後要實作UITableViewDataSource的兩個事件。
完整的程式碼如下
沒有留言:
張貼留言