同上篇一樣固逗,圖示3個(gè)ImageView胚委,他們的寬度和高度都是固定的(比如100)朦促,那么如何用約束使他們等距離擺放呢?
首先對(duì)每個(gè)imageView都做等高等寬約束米辐,值都為約定好的100胸完。
我們來理清一下已知條件,N個(gè)(現(xiàn)在是3個(gè))imageView翘贮,每個(gè)imageView的寬度和高度都是100赊窥,將它們進(jìn)行等距離縮放。
我們先來進(jìn)行簡單一些的狸页,假設(shè)imageView之間的間距和imageView對(duì)屏幕邊緣的間距是相等的∠悄埽現(xiàn)在假設(shè)間距為x,整個(gè)屏幕寬度為X芍耘,可以計(jì)算 x = (X-300)/4址遇,那么第一個(gè)imageView的中心點(diǎn)橫坐標(biāo)為 x+50, 也就是 X/4 - 25斋竞,也就是說倔约,第一個(gè)imageView處于整個(gè)屏幕寬度的1/4往左偏移25pm處。
(注意這里要確保imageView的寬度不會(huì)太大坝初,否則在窄屏幕上回重疊在一起)
然后修改水平方向相等的約束浸剩,在我看來這個(gè)約束的意義是水平方向上中心點(diǎn)的x值相等钾军,我們把它的multiplier修改為1:2,也即imageView.center.x = view.center.x/2绢要,也就是位于整個(gè)屏幕的1/4處吏恭,constant修改為-25,即往左偏移25pm袖扛,和我們上面的計(jì)算結(jié)果一致砸泛。
同理第二個(gè)imageView的中心點(diǎn)橫坐標(biāo)為 2x+150,也就是X/2蛆封,即位于整個(gè)屏幕正中央唇礁,做相同的約束,并且multiplier修改為1惨篱, constant為0
同理第三個(gè)imageView的中心點(diǎn)橫坐標(biāo)為 3x+250盏筐,也就是3X/4 + 25,multiplier修改為3:2砸讳, constant為25
這樣就完成了
效果圖如下:
基本方法就是這樣的了琢融,對(duì)于稍微復(fù)雜一些的,比如和屏幕之間間距是固定的等距離擺放簿寂,則需要自己動(dòng)筆去計(jì)算一下其中約束的值應(yīng)該怎么設(shè)置漾抬,然后按照計(jì)算好的值填上去,就ok了常遂。