XIB中UIScrollView的自動布局

XIB中UIScrollView的自動布局

使用場景我們在使用XIB或者StoryBoard的時候 經常會使用到UIScrollView ,但是如果想使用XIb 進行UIScrollView自動布局(AutoLayout)復雜 ,因為scrollview本身contentSize、contentInsets等復雜的特性導致

讓我們來看下 在XIB中UIScrollView的自動布局的幾種方法

效果

這里我們以豎屏為例

1 . 第一步 --> ScrollView

新創建一個項目 ,拖動一個UIScrollView到StoryBoard中 并給ScrollView添加約束

1-拖動一個ScrollView

1-給ScrollView添加相對于SuperView的約束

2 . 第二步 -->Contain View

在拖動一個View(將其命名為Contain VIew)到ScrollView上,然后添加上下左右的約束

注意:這個 ScrollView就是根據這個Contain View 來確定ContentSize的大小的

2-添加Contain View約束

特別提醒添加完 Contain View的約束后~Xcode 會報錯 暫時先別管

根據橫豎屏 設置Contain View的額外約束

我們需要先確定 我們ScrollView是橫屏滾動還是豎屏滾動

如果 橫豎屏都需要滾動的話 就不需要添加下面的約束

a .橫屏滾動

3-根據橫豎屏 添加Contain View的額外約束條件

3 . 設置Contain View的高度(如果是橫屏的就要設置寬度)

通過設置Contain View的寬度來確定 ScrollView 的高度

如果想動態設置ScrollView的高度,我們可以將這個高度的約束 拉出去~然后該成屬性

然后在修改

4-ContainView的高度約束

4.如果是確定的寬度 可以在updateViewConstraints方法中修改,也可以在別的地方修改

//更新約束- (void)updateViewConstraints{? ? [superupdateViewConstraints];//設置ContentSize為3個屏幕的寬度self.ViewHeight.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*3;}

3.第三步 -->添加Contain View內的UI控件

現在就可以 豎直滾動了 只是ScrollView里面沒有元素而已 有的就是 一個 Contain View的寬高的 空間

所以我們現在要做的就是 向一個View(Contain View)中添加 內容

3-為需要添加的三個視圖 添加約束

然而的上面的約束 并沒有 設置 三個View的高度

我們可以 添加通過代碼 手動設置 這幾個視圖的高度

添加視圖高度的約束

通過代碼設置 這幾個視圖的高度

//更新約束- (void)updateViewConstraints{? ? [superupdateViewConstraints];//設置ContentSize為3個屏幕的寬度self.ViewHeight.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*3;//第二個視圖top距離SuperView的距離 也就是第一個視圖的高度self.secondViewTop.constant=CGRectGetHeight([UIScreenmainScreen].bounds);//第三個視圖top 距離SuperView的距離 也就是第二個視圖的高度self.threeViewTop.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*2;//第三個視圖的高度= ContentSize.height(self.ViewHeight.constant)-(self.threeViewTop.constant)}

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容