使用swift3從零寫一個基於位置信息的照片集iOS應用系列二

使用swift3從零寫一個基於位置信息的照片集iOS應用系列二

上一篇使用默認的UITableViewController顯示了模擬的數組數據和圖片。這一篇來自定義Prototype Cell的樣式。

爲了每行有更多的空間，首先設置行的高度

1. 選中Cell，在Attributes inspector中，將 Table View Cell中的Style改成 Custom

2. 選中TableView 在Size inspector中設置 Row height 的值爲80

3. 選中Cell 在Size inspector中將Row height 的值設置爲80 ，並把後面的 Custom 勾選上

從右下角的Object Library中找到 Image View 拖拽到Cell中。這裏注意看左側的結構，是放在 Cell下面的 Content View下面哦。
而後在右側面板的Size inspector中將View的 X、Y、Width、Height（位置座標和長寬）設置好。

接下來添加三個UI Label組件到Cell中

這裏注意，能夠一次性拖拽好三個，也能夠一個個拖拽進去都行。而後再右側將字改成Name便可，這裏會發如今 Main.storyboard 中字母沒顯示完整，能夠直接拖動邊框拉到顯示完整。
我通常是選中Label 而後再菜單欄選擇Editor->Size To Fit Content便可快捷鍵是 Command+=。有時候會顯示灰色，從新選中一下Label再進入editor裏面就能夠看到了。

而後將第一個label選中獎Font設置爲Headline，就是標題的意思。

將第二個label設置爲：

• Font：System

• Style：Light

• Size：14
  

下面，使用 「Embed In Stack」佈局工具

1. 按住 command 鍵。選中三個 Label，而後點擊上圖的3，將三個 Label 嵌入到一個 Stack View 中

2. 在左側的屬性面板中將 spacing 設置爲1

3. 一樣按住 command 鍵，再選中剛剛的 Stack View 和Image View

4. 而後點擊 上圖中的 3 按鈕，嵌入到 Stack View

5. 在左側的屬性面板中將 spacing 設置爲10

選中最外層的 Stack View，檢查一下約束是否加好了

Stack View 由於添加了約束，那麼它就會自動調整適應手機屏幕大小，這裏爲了固定住Image View的寬高。按住 control，從 Image View 組件橫向拖動，而後在它本身身上鬆掉，再彈出的框裏面，按住shift鍵，選擇width和height，而後點擊添加兩條約束。
這裏使用鼠標右鍵從Image View上橫向拖動也是能夠的。效果與按住control鍵是同樣的。

如今的文件結構應該是這樣的