之前在使用autolayout給uiscrollview進行布局的時候,總會出現點這樣那樣莫名其妙的問題.我也曾跳坑兩次,掙扎許久最後都以放棄storyboard改為**實現而告終.今天終得正解,遂拿出來說說.
先從最基礎的開始,我們試著在storyboard上新增乙個uiscrollview,並且在內部新增乙個和它一樣大的uiimageview.
首先,拖乙個uiscrollview到storyboard,設定約束如下:
頂部距離控制器view距離為50
左側和右側距離控制器view距離分別為0
高度固定250(多吉利的數字)
scrollview的約束
然後拖乙個uiimageview到scrollview中,我們想讓它在處並和scrollview的尺寸一樣,於是設定上下左右距離父控制項都為0:
imageview相對scrollview的約束
好像沒什麼問題,可是...
沒看錯,xcode告訴我們這樣安排約束是錯誤的.
uiscrollview的子控制項新增約束與普通view不同,僅僅這4個約束不足以滿足它的需求.
那麼,怎樣才是正確的做法呢?
首先:scrollview自身的約束(scrollview的位置和尺寸)可以像正常的uiview一樣參照其父控制項新增.
正如上面我們第一步所做的,在給scrollview新增子控制項之前,那四個約束決定了scrollview的大小和位置,這步是沒有問題的.
問題的關鍵在於如何給scrollview內部的子控制項新增約束.
scrollview內部子控制項約束的新增需要遵循兩個原則:
1、scrollview內部子控制項的尺寸不能以scrollview的尺寸為參照
2、scrollview內部的子控制項的約束必須完整
首先,子控制項的尺寸不能以scrollview的尺寸為參照,那麼我們有兩種選擇:
其次,約束"完整"的意思是說:子控制項在水平及豎直方向上的約束要把scrollview"撐滿".
也就是說,在水平方向上,我們需要設定:
豎直方向上也一樣,要設定:
scrollview子檢視的約束條件圖1
scrollview子檢視的約束條件圖2
兩張中,所有紅色線條的長度都要確定(黃線表示對齊),才能保證autolayout不會報錯.
為什麼scrollview如此隔路(隔路:特殊,與眾不同)呢?
這是因為,scrollview需要根據新增在其內部的子控制項的寬高及與四周的距離計算出它的contentsize.
舉個栗子:
乙個新增在scrollview內部的imageview的寬高為, imageview距離上左下右的距離分別為:100, 200, 300, 400,那麼不需要用**賦值contentsize,我們就可以列印出scrollview的contentsize為.
如圖:
ib新增約束的原理
如果理解起來還是有困難,我們可以把scrollview的contentsize的範圍想象成一塊uiview(上圖中的藍色區域),暫且叫它container(實際是沒有這個東西的).當我們在storyboard或xib中設定子控制項與scrollview之間約束時,實際上設定的是子控制項與container之間的約束.
也就是說,子控制項的約束決定了container的尺寸(contentsize).
這就說明了為什麼我們要在水平和豎直方向用約束"撐滿".如果不撐滿,container不知道它自己應該多大.
也正是因為container的尺寸由子控制項的約束決定,所以子控制項的尺寸不能再反過來參照container的尺寸.不然你等於我,我等於你,那到底是多少呢?如果你是xcode你也會抓狂.(再次強調那個container不是真的,只是為了方便理解)
理論部分解釋完畢,回到一開始的案例上.
imageview有了上下左右四個約束,還缺少寬高,我們再新增個固定寬高的約束(可以大一點,太小了看不到滾動效果),問題就可以解決了.
強調一下, 用**給scrollview新增約束(包括使用masonry的情況)是一樣的.
UIScrollView實現重用
import inte ce test19viewcell uiview 索引 property nonatomic,assign nsuinteger index 文字 property nonatomic,copy nsstring text 文字控制項 property nonatomic,r...
UIScrollView使用注意
這裡討論同時使用autolayout 和 uiscrollview 的情況 1.如果內容元件的尺寸能夠確定 則直接在storyboard 中設定乙個uiview包裹住所有內容元件，並在storyboard中設定固定的高度。這樣，uiscrollview設不設定contentsize都可以正常顯示。2...
UIScrollView控制項介紹
一 知識點簡單介紹 1.uiscrollview控制項是什麼？1 移動裝置的螢幕 大 小是極其有限的,因此直接展 示在 使用者眼前的內容也相當有限 2 當展 示的內容較多,超出 乙個螢幕時,使用者可通過滾動 手勢來檢視螢幕以外的內容 3 普通的uiview不具備滾動功能,不能顯 示過多的內容 4 u...