作業7–1: auto layout

題目
三個image view水平排列,彼此間距10,距離左右邊界間距20, 等寬,寬高比例1:2,垂直置中

題目看起來好像很簡單,開 xcode 應該 3~5分鐘就可搞定

#1 Storyboard 拉好三張圖

#2 設定三張圖的條件

依序是 左圖、中圖、右圖 各6個 constrain

設完,有些衝突

#3 準備驗收

先執行看看結果再說

….然後,就死掉了…

中圖有自動以 1:2 縮放,旁邊兩張依舊是 w:100, h:200


接著 又搞了 1 個多小時

沒結果


突然看到 彼得潘講義 中這張圖

下方有個 Equal Widths

應該是指讓兩個物件設成相同寬度吧?

來拉線看看…

「左圖」按住 Ctrl 往「中圖」拉線

還真的有個 Equal Widths 選項

那就設定 左圖 =中圖,中圖=右圖

執行結果

還不錯

不過 xcode 裡頭還有些 confliction Constrains 警告訊息

相關 xcode project:

ps: 前後瞎搞了2個多小時

Show your support

Clapping shows how much you appreciated Fire Shieh’s story.