2016年2月15日 星期一

[iOS] AutoLayout筆記 - 設定距離的小技巧

你現在有一個需求,假設是一個View必須放在螢幕寬度1/3的位置處,並且置中。

你可能會使用透明的View來達成這樣的效果。

先放一個大的透明View,假設高為150,寬與螢幕等寬。























接著在這個透明View裡面,切兩區塊,左邊為1/3,右邊為2/3

塞入一個View,設定寬為父View的1/3,並靠左上下均為0

















































此時,你會得到一個寬為螢幕1/3大小的區塊

















接著,你只要在綠色區塊塞入你要的View,在將綠色區塊設為透明並將你的View置中。

這樣也許能夠達到你想要的效果。
























但是似乎有點太麻煩,而且也設定了不少Constraint



























接著你可以試試看另一種作法,可以少掉一些設定。

我們在下面一樣在加入一個150高的View,然後與上面條件相同,在1/3處有一置中的View

接著我們直接在這個View當中加入我們要的View,省略了上面綠色區塊的步驟

一樣設定寬高為100




















接著加入垂直與水平置中






















接著你選擇垂直的那條Constraint,並進行修改。






















你會發現結果會跟上面的一樣。























事實上,你可以針對水平,垂直置中的Constraint做修改,只需要去改他的Multiplier就可以了。

假設我們要分上下兩區塊,而我們的View要在下面的區塊並置中。

你只要很簡單的將垂直置中的Multiplier改為3/2就好了。



























某些情況下你可能希望你的距離不是一個固定的值,試著使用這種方式來設定你的Constraint。

另外一提,如果你想要利用此方式又增加一些固定值是否可行呢,

像是需要一個置中的View,但是他又得往右約100。

一樣是可行的,先拉出最簡單的置中Constraint。






















接著點選垂直的Constraint,並將他的Constraint設定為100。





















你就會得到一個置中,且偏右100的View了。