Xcode11 在Xib中進行UIScrollView布局

作者：默默_David
鏈接：https://www.jianshu.com/p/3161da83ee42

概要

在Xcode11中對UIScrollView在Xib中的布局，蘋果引入了Content Layout guide和Frame Layout Guide。我們拖動一個UIScrollView到Xib中，默認就會有Content Layout guide和Frame Layout Guide兩個選項嵌入。如下圖：

 

 

 這時我們可以選擇兩種方式來進行布局：

（1）將右邊檢查器中Content Layout Guides的勾勾去掉，這樣Content Layout guide和Frame Layout Guide在UIScrollView中就會自動消失，這時候布局就跟以前的Xcode版本一樣，網上教程有很多，不在本文的討論里面

（2）保留Content Layout guide和Frame Layout Guide，分別對它們進行設置，完成UIScrollView的內容布局，本文則講解這種方式的布局步驟進行實現

實現步驟

最終實現目的

要將這樣的UIScrollView成功布局，我們要完成兩個部分：

（1）完成UIScrollView自身相對於父視圖的布局設置，這個是Frame Layout Guide的部分

（2）完成UIScrollView滾動內容的布局設置，這個是Content Layout guide的部分

在下面，我們就一步步就完成這些設置

 

一、在視圖控制器中拖入一個UIScrollView並設置約束

拖入一個UIScrollView到ViewController中，並分別設置它相對於父視圖的約束為0，如下圖

 

 

二、拖入一個UIView到UIScrollView中，並設置它的約束

拖入一個UIView到UIScrollView中,作為內容顯示視圖，Autolayout將使用這個View的寬高來計算UIScrollView的滾動范圍，並分別設置它相對於Content Layout guide的約束為0，具體步驟為：左鍵選中View，右鍵拖動它到Content Layout guide上，按住shift鍵，將上下左右都給選中，如果xcode默認了當前的相對數據，在右邊將它手動改為0，操作如下圖

 

 

注意上圖中右邊紅框區域，默認的一般不是0，要將它手動修改為0

接下來，我們將View改名為ContentView，方便標識

三、設置內容滾動范圍

上面的步驟設置之后，我們會發現紅線仍然存在，這是因為AutoLayout仍然不知道內容的滾動范圍是多大，我們接下來設置滾動范圍，具體步驟為，左鍵選中ContentView，右鍵拖動到Frame Layout Guide

 

 

 

 

 

 

在設置完成后，我們會發現，所有的紅線都不存在了，而且關於滾動視圖的范圍都已經設置好了，如果有變化，可以像以前一樣將約束拖線到代碼中進行設置

接下來關於內容的設置，就和以前的一樣了，像以前一樣進行設置即可