iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 27
0
自我挑戰組

菜比八iOS程式開發30天自我挑戰系列 第 27

swift 4.2 Day-27 Swift 字第

https://ithelp.ithome.com.tw/upload/images/20181111/20110801hZiaso4rFS.png

今天我們我們繼續沿用上一個專案,但是需要去做一點小改動來做到TableViewCell的自定樣式,要做到自定TableViewCell,首先我們要先來準備一些素材:準備一些圖片、在TableViewController.swift的Array改成圖片Array(這裡Array裡的項目為圖片的名稱,使用也是用圖片的名稱)、新增一個TableViewCell並設定tableViewCell class。

https://ithelp.ithome.com.tw/upload/images/20181111/20110801XjlTXvBCF7.png

https://ithelp.ithome.com.tw/upload/images/20181111/201108012AqC2GkYFc.png

再來我們要自定Cell的高度,在右側設定style,設定為custom,並將高度的custom打勾,填入數值去設定高度

https://ithelp.ithome.com.tw/upload/images/20181111/20110801IDCEJCSc4J.png

設定好後,我們將Cell裡面清空,並從元件庫中拉一個ImageVIew到TableViewCell裡面,點擊Align去設定Auto Layout,將水平置中及平行置中打勾並設定數值為0。再來我們將ViewController的Label刪除,也改成加入ImageView,同樣將水平置中及垂直置中打勾,並設定圖片大小,這裡看自己想要設定多少都可以。完成之後連結ViewController.swift的IBOutlet。我們做最後一步,設定ImageView 的Content Mode,設定為Aspecct Fit,讓我們的圖片去符合這個尺寸也不會失真。

https://ithelp.ithome.com.tw/upload/images/20181111/201108017KVOWgx7aQ.png

回到TableViewController.swift,去設定numberOfSection、numberOfRowsInSection、cellForRowAt及prepare for segue

https://ithelp.ithome.com.tw/upload/images/20181111/20110801x02feN2uhe.png


上一篇
swift 4.2 Day-26 Swift 風格程式碼
下一篇
swift 4.2 Day-28 計數器
系列文
菜比八iOS程式開發30天自我挑戰30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言