本文將演示新增edges/top/bottom/leading/trailing的約束。

首先確保在專案中已經安裝了所需的第三方庫。

點選【Podfile】,檢視安裝配置檔案。

1 source 'https://github.com/CocoaPods/Specs.git'
2 platform :ios, ‘12.0’
3 use_frameworks!
4 
5 target 'DemoApp' do
6     pod 'SnapKit'
7 end

根據配置檔案中的相關配置，安裝第三方庫。

然後點選開啟【DemoApp.xcworkspace】專案檔案。

在專案導航區，開啟檢視控制器的程式碼檔案【ViewController.swift】

現在開始編寫程式碼，建立一個滾動檢視，並在滾動檢視中新增一個標籤控制元件。

  1 import UIKit
  2 //在當前的類檔案中，引入已經安裝的第三方類庫
  3 import SnapKit
  4 
  5 class ViewController: UIViewController {
  6     
  7     //新增一個布林變數，用來標識是否已經給檢視物件添加了約束關係。
  8     var didSetupConstraints = false
  9     
 10     //初始化一個滾動檢視物件
 11     let scrollView  = UIScrollView()
 
 12     //初始化一個內容檢視控制元件
 13     let contentView = UIView()
 14     
 15     //新增一個標籤控制元件
 16     let label: UILabel = {
 17         //初始化標籤
 18         let label = UILabel()
 19         //設定標籤的背景顏色為橙色
 20         label.backgroundColor = .orange
 21         //設定標籤不限制內容的行數
 22         label.numberOfLines = 0
 

 23         //設定文字在超過標籤檢視邊界時的換行模式：按單詞分割換行。
 24         //標籤末尾不會出現被分割的單詞。
 25         label.lineBreakMode = .byClipping
 26         //設定標籤控制元件的文字顏色為白色
 27         label.textColor = .white
 28         //設定標籤的文字內容
 29         label.text = NSLocalizedString("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.", comment: "")
 30         //返回設定好的標籤控制元件
 31         return label
 32     }()
 33     
 34     override func viewDidLoad() {
 35         super.viewDidLoad()
 36         
 37         //將滾動檢視新增到根檢視中
 38         view.addSubview(scrollView)
 39         
 40         //設定內容檢視的背景顏色為棕色
 41         contentView.backgroundColor = UIColor.brown
 42         //將內容檢視新增到滾動檢視中
 43         scrollView.addSubview(contentView)
 44         //將標籤新增到內容檢視中
 45         contentView.addSubview(label)
 46         
 47         //呼叫檢視物件的重新整理約束的方法
 48         view.setNeedsUpdateConstraints()
 49     }
 50     
 51     //新增一個方法，用來重新整理檢視的約束關係
 52     override func updateViewConstraints() {
 53         
 54         //當還沒有給檢視物件新增約束時，
 55         //給控制元件新增約束關係
 56         if (!didSetupConstraints) {
 57             
 58             //給滾動檢視新增約束關係
 59             scrollView.snp.makeConstraints { make in
 60                 //在滾動檢視和根檢視之間建立約束關係。
 61                 //設定滾動檢視和根檢視的邊距為0。
 62                 //即滾動檢視的顯示區域，始終和根檢視保持相同。
 63                 make.edges.equalTo(view).inset(UIEdgeInsets.zero)
 64             }
 65             
 66             //給內容檢視新增約束關係
 67             contentView.snp.makeConstraints { make in
 68                 //在內容檢視和滾動檢視之間建立約束關係。
 69                 //設定內容檢視和滾動檢視的邊距為0，
 70                 //即內容檢視的顯示區域，始終和滾動檢視保持相同。
 71                 make.edges.equalTo(scrollView).inset(UIEdgeInsets.zero)
 72                 //設定內容檢視的寬度始終等於滾動檢視的寬度
 73                 make.width.equalTo(scrollView)
 74             }
 75             
 76             //給標籤物件新增約束關係
 77             label.snp.makeConstraints { make in
 78                 //設定標籤物件的頂邊，與父檢視保持20點的距離。
 79                 make.top.equalTo(contentView).inset(20)
 80                 //設定標籤物件的底邊，與父檢視保持20點的距離。
 81                 make.bottom.equalTo(contentView).inset(20)
 82                 //設定標籤物件的左邊，與父檢視保持20點的距離。
 83                 make.leading.equalTo(contentView).inset(20)
 84                 //設定標籤物件的右邊，與父檢視保持20點的距離。
 85                 make.trailing.equalTo(contentView).inset(20)
 86             }
 87             
 88             //更改布林變數的值，標識當前已經完成三個控制元件的約束
 89             didSetupConstraints = true
 90         }
 91         
 92         //呼叫父物件的重新整理檢視約束的方法
 93         super.updateViewConstraints()
 94     }
 95     
 96     override func didReceiveMemoryWarning() {
 97         super.didReceiveMemoryWarning()
 98         // Dispose of any resources that can be recreated.
 99     }
100 }