1. 程式人生 > >ScrollView程式碼設定約束

ScrollView程式碼設定約束

       Swift寫的 app,直接從頁面說起,上方是一個輪播圖,下方是一個collectionView,很顯然,如果使用TableView後期涉及到資料傳遞的問題就頭大了,所以我最後決定用scrollView,經過垂死掙扎,終於研究出了一點小結果,總結了一些簡單的純程式碼約束規則分享給大家.

裡面用到的第三方約束框架是SnapKit


一、將scrollView設定為控制器的根檢視

首先我沒有采用直接給View賦值的方式( self.view = scrollView() )(PS:如果有大神能通過這種方式將scrollView設定為根檢視,咱麼私聊,哈哈). 

將scrollView以子檢視的方式新增到View上,需要對scrollView的四個邊界進行約束,約束到View上,一定一定要四個邊界約束


對scrollView的四個邊界進行約束

二、給scrollView新增子控制元件,重點來了。。。

(1)首先我們得知道,用程式碼給scrollView新增約束時,是不能設定固定contentSize(滾動範圍)的,contentSize是根據子控制元件的大小自動計算的;

(2)子控制元件必須設定大小,也就是(width,height),一定要一定要寫死!!!!!這樣不無道理,自動計算contentSize,你必須要讓人家計算機知道所有子控制元件加在一起的width,height.

(3)我們的需求是讓頁面上下滾動,一定要讓計算機檢測到這種結構


top和bottom約束必須有

 ^_^          一定不要忘記上面正確的規則

至於一些規則,我們來看:

(1)我懂你,你在想只需約束它左右邊界就可以知道子控制元件的寬了,同時高也同理都約束好了,完美,子控制元件大小都知道了,例如這樣:


對於scrollView,還是錯誤的示範

但是你執行出來是這個樣子,看到滾動條沒,他已經知道你子控制元件的加起來的長度,並且計算出了contentSize,但是就是不顯示內容


可滾動,不顯示控制元件

所以為了顯示內容,你必須直接了當的約束width,height,就是這樣,儘量避免衝突的將子控制元件的寬和高寫死!!!

(2)別指望約束邊界自動計算,在這裡兩邊約束是有自己的目的的. 例如:回看我們的正確版本,位於最下面的子控制元件的約束,(make.bottom),它存在的目的是使計算機知道這種結構,從而計算出contentSize


上下滾動要求

如果設定了固定的高就不去設定底部約束,如果這樣會顯示內容但不會滾動

正確版本程式碼中並沒有同時設定左右邊界約束,因為我們並不希望頁面會左右滾動,而希望頁面上下滾動,因此,如果我們希望頁面所有方向都可以滾動就需要毫不吝嗇的把約束全部加上並直接設定寬高,例如這種結構


上下左右滾動要求