IOS的UIScrollView的自動佈局

 IOS的UIScrollView的自動佈局

標籤:iOS UIScrollView 自動佈局

轉載於 http://blog.csdn.net/dongtaochen2039/article/details/41749209 感謝博主的分享。

最近在研究ios開發,遇到的UIScrollView的自動佈局問題,特記錄之。

終結的要點有:

    添加一個AnchorView爲UIScrollView的ContentView確定寬高。


操作如下:

1.我們需要做什麼。

我們需要自己完成一個類似於collection view 的功能。完成的效果圖如下:


上面的標題欄整體是一個view,下面的工作區是scrollview。自動佈局後橫屏效果如下:


3.view 結構


最外層的view是根視圖,第一個view(包含兩個button,和p_w_picpathview的)是標題欄。第二個view(包含scrollview的)是scrollview的滑動區,就是上圖的工作區。

之所以這麼設計就是將複雜的佈局簡單化,這樣原先標題欄好幾個視圖和scrollview的自動佈局就變成一個view和scrollview的自動佈局。整體框架圖如下:



首先先對區域1和區域2的父view進行自動佈局,他們的自動佈局比較簡單,寫出上下左右的間距即可。

下面我們主要講解下區域2的佈局。我們平時對 scrollview進行佈局,我們知道scroll view除了自身的佈局需要考慮(x, y, width, height)外,還有一個contentSize屬性也必須要在佈局的過程中進行確定,contentSize是UIScrollView用於確定它所 要展示的內容尺寸的大小,而這個contentSize在佈局中實際上是又scroll view的子view :content view的寬和高實現的,注意:我們不能將content view的寬和高的約束設定爲由scroll view決定(如和scroll view等寬、等高),否則,Xcode會有警告:scroll view的content size不確定!


在這種情況下,我們必須要對content view的佈局約束引入scroll view之外其他參照物,我們拖進來一個輔助的view作爲參照物or錨點,示意圖如下:



在storyboard中這3個視圖的結構如下:




通過這個參考view,確定content view的寬度和高度,儘管content view的尺寸可以不依賴於scroll view,但我們還不得不設定content view 和其父view的關係:具體而言就是要確定content view和scroll view的top, bottom, leading和trailing contstraints,這個地方可能比較具有迷惑性,原因是蘋果對於這四個約束的使用在scroll view中做了變化:它不再是確定content view尺寸的依據,而是幫助scroll view中content view四周的邊界(or你可以理解爲留白),進而確定scroll view的contentSize屬性。


contentView具體的約束如下:

 

scrllview的約束可以指定充滿父view,anchor view左邊、右邊、上邊緊挨父視圖。這會xcode會讓你指定anchor view的高度,否則會有***的提示信息。這樣再指定anchor view的高度就可以了。這會你應該有疑問,anchor view不是用來確定滑動區域content view的大小的嗎?如果把anchor view的大小寫死,contentView也不就不能改變大小了嗎?我們需要在代碼裏面動態的更改anchor view的大小,在我們的代碼裏面也就是高度,因爲寬度是屏幕寬度,不用更改。anchor view的高度約束如下圖所示:





這裏我隨便付的值,然後在代碼裏面動態調整高度,修改的代碼如下:

[objc] view plaincopy

  1. //計算contentView的高度  

  2. int rowNums = (appDelegate.workerList.count+COLUMN_COUNT-1)/COLUMN_COUNT;  

  3. int totalHeight = VIEW_HEIGHT * rowNums + (rowNums+1)*MIDDLE_GAP+100;  

  4.   

  5. //找到anchor view的高度約束脩改高度  

  6. NSArray *arrs = scrollAnchorView.constraints;  

  7. for (NSLayoutConstraint *attr in arrs) {  

  8.     if(attr.firstAttribute == NSLayoutAttributeHeight){  

  9.         attr.constant = totalHeight;  

  10.     }  

  11. }  

  12.   

  13. //更新父視圖約束條件  

  14. [scrollAnchorView.superview.superview updateConstraints];  

上面的代碼放在你需要動態確定contentview高度的地方。
修改好之後,就可以看到剛開始的效果了。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章