AutoLayout比例約束

2021-08-19 16:07:57 字數 1520 閱讀 4522

本文記錄如何在 uistoryboard 或者 xib 中進行百分比布局,包括

在 ios nslayoutconstraint priority 一文中提到過 multiplier, 上述提到的百分比布局都是基於 multiplier 實現的,下面來一一檢視其實現。

view.width 佔其 superview.width 的百分比

該功能實現很簡單,以乙個居中的按鈕 button 為例,首先將按鈕相對于父容器新增equal width的 constraint,然後將它的 multiplier 設成 0.2,這樣就可實現 button1 的寬度為父容器寬度的 0.2 倍。操作步驟如下:

view.leading 與 superview.leading 間距佔 superview.width 的百分比

該功能實現其實是使 view.leading 相對於 superview.trailing 布局,然後再調整 multiplier 引數實現,如下操作步驟實現了將 button 的左邊距離父檢視左邊界的距離站父檢視寬度的0.2倍,如下:

view.trailing 與 superview.trailing 間距佔 superview.width 的百分比

該需求實現是使 view.trailing 相對於 superview.trailing 布局,然後再調整 multiplier 引數,需要注意的是使用reverse first and second item調整如下表示式中 item1 和 item2 在等式中兩邊的位置。

item1.attribute1 = multiplier × item2.attribute2 + constant

以下步驟實現 button 的 trailing 距離父檢視右邊距為父檢視寬度的0.2倍,需要注意的是,此時的 multiplier 是 (1-0.2=0.8),在修改 button 約束值時,可以從頂部導航中看到約束表示式的變化:

view.leading 與 superview.centerx 間距佔父檢視 superview.width 的百分比

有時間需要將 ui 元件相對于父檢視的中線進行布局,比如將 view.leading 與父檢視中線的距離設定為父檢視寬度20%, 即相對于父檢視 centerx 的 multiplier 值為 1.4

限定view的寬高比

有時候我們需要保持檢視的寬高比不變進行縮放,此時可以設定其 aspect ratio 保持其在進行縮放時寬高比固定。

以 superview.width 寬度的某一百分比為 view 之間的間隔

要實現這個需求就沒有之前那麼簡單了,這需要新增乙個間距檢視,設定每個檢視與相鄰間距檢視的邊緣間距約束,然後給所有的間距檢視新增相對於其父檢視的等寬約束,設定合適的比例即可。這裡借用 為iphone 6設計自適應布局 文中一圖:

關於文中所涉及到的方法,可在 autolayoutmultiplier 工程中檢視。

參考:

iOS自動化布局 AutoLayout約束優先順序

autolayout新增的約束中也有優先順序 priority 優先順序的數值1 1000,分為兩種情況 當uilabel顯示的內容過長或太短,控制項就會被拉伸和壓縮,當我們不想讓控制項被拉伸壓縮時,就需要設定控制項的固有約束 intinsic content size 來實現我們的需求。固有約束分...

AutoLayout 約束就是等式或不等式

ps 本文面向的讀者是已經接觸過autolayout的,如果你還未接觸過,那本文內容可能不大容易消化,關掉本頁或點返回可能會更好,在資訊氾濫的當下避免攝入過量的資訊也是一種智慧型。一般情況下我們知道autolayout會自動計算檢視 view 的大小 size 和位置 position 但是前提得設...

AutoLayout學習歷程

隨著iphone6和iphone6 plus的問世,我也惶恐以前的hard code布局了。於是學習一下autolayout,以後肯定都是這種方式進行適配咯。不閒扯了,前一段時間在學習整理的一些 奉獻出來,感謝分享的那些博友們。關於autolayout,還是多動手試驗才是最重要的。請看下面 本文收集...