SnapKit教程：簡化iOS App開發中的自動布局
對於iOS開發人員，以編程方式設置UI可能會感到困難和復雜，特別是如果您在Swift方面不是很有經驗。但幸運的是，有很多圖庫支持我們解決這個問題。其中一個是SnapKit。
我們使用SnapKit以編程方式設置UI，因為它是迄今為止最好的Swift UI布局庫。在這個SnapKit教程中，我們將簡要介紹SnapKit世界。
在這個 SnapKit教程中，我們描述了使用SnapKit的經驗， 以幫助您學習 如何簡化iOS App Development中的自動布局。
1. SnapKit簡介
對於iOS程序員來說，“自動布局”術語非常熟悉。在實現移動應用程序的布局時，它幾乎成為必需的部分。
但是，項目越大越復雜，接口文件的數量越多，管理這些文件的難度就越大。然後，如果您需要一些動態布局，則必須拖動許多約束來相應地更新UI。它使您的項目難以調試並且難以控制。就像這還不夠，現在想象一下，你有大量的iOS開發人員在同一個項目上工作，因此會出現很多其他問題，例如自動生成文件的合並沖突。
因此，無論哪種方式，您都必須知道如何以編程方式進行自動布局，因為如果您的應用程序成功，這將成為未來的一項要求。
但以編程方式使用自動布局的最大缺點是需要太長時間。您將不得不編寫大量代碼來設置約束而不是點擊幾下鼠標。Apple的自動布局編寫非常冗長且耗時。SnapKit通過提供Apple的Auto Layout Constraints系統的簡潔抽象，幫助我們解決這個問題。
2. SnapKit和用法
SnapKit是一個允許iOS開發人員輕松操作自動布局約束的工具。通過使用SnapKit，您可以創建，更新，刪除和管理UI視圖的布局約束。
讓我們考慮一些例子，讓您了解SnapKit的簡潔和清晰，而不是Apple的Cocoa Auto-Layout庫。
pod‘SnapKit‘
為了節省時間和墨水（笑），我們不會談論CocoaPods和Podfile。它們屬於另一篇文章，所以請谷歌隨意。
你還記得如何以編程方式添加約束嗎？例如，如果我們想要垂直居中視圖，代碼將是這樣的：
let horizontalConstraint = NSLayoutConstraint(item: view, attribute: NSLayoutConstraint.Attribute.centerX, relatedBy: NSLayoutConstraint.Relation.equal, toItem: view, attribute: NSLayoutConstraint.Attribute.centerX, multiplier: 1, constant: 0)
哎呀，看起來很難看。我們甚至不想考慮它，更不用說寫下來了。讓我們看看SnapKit如何為Swift開發人員解決這個巨大的痛點。
讓我們顯示一個UIView固定在其超視圖的四個邊緣。所以，想象一下我們有四個約束，比如上面的一個，有很多混亂的代碼。讓我們看看SnapKit如何處理這種情況。
第1步：以編程方式創建UIView
想象一下，我們在新的Xcode項目中有一個空白視圖控制器。在viewDidLoad（）中，我們有以下幾行代碼：
let childView = UIView() childView.backgroundColor = .red self.view.addSubview(childView)
它基本上是創建一個新視圖，為它設置背景顏色並將其添加到視圖中。這裏的所有都是它的。
第2步：使用SnapKit
首先，我們需要導入這個庫。
import SnapKit
讓我們繼續在viewDidLoad（）中編寫代碼
childView.snp.makeConstraints { (make) in
make.top.bottom.left.right.equalTo(self.view)
}
這很簡單，對吧？！從字面上看，有一行，我們已經使childView的所有四個邊都等於super.view的邊。如果將其與我們在上一節中顯示的代碼進行比較，這是一種更簡潔的方法。因此，在編寫UI時，您已經節省了大量時間。但那還不是全部。我們甚至可以進一步重構此代碼：
childView.snp.makeConstraints { (make) in
make.edges.equalTo(self.view)
}
現在重新運行，您可以看到我們僅使用一行代碼固定四條邊，而不是像之前顯示的二十或三十條線。
3.更多SnapKit示例
讓我們繼續使用另一個SnapKit示例。我們將創建另一個名為anotherChildView的視圖：
let anotherChildView = UIView() anotherChildView.backgroundColor = .yellow self.view.addSubview(anotherChildView)
讓我們在SnapKit中嘗試新事物：
childView.snp.makeConstraints { (make) in
make.size.equalTo(CGSize(width: 300, height: 300))
make.top.equalTo(self.view.snp.top).offset(100)
make.centerX.equalTo(self.view)
}
anotherChildView.snp.makeConstraints { (make) in
make.size.equalTo(childView)
make.top.equalTo(childView.snp.bottom).offset(50)
make.centerX.equalTo(self.view)
}
如您所見，我們有很多功能
- size.equalTo
- top.equalTo (Likewise, we have bottom.equalTo, left.equalTo and right.equalTo) with the offset.
- centerX.equalTo and centerY.equalTo with the offset.
除此之外，SnapKit也有。乘以。您可以使用此功能為視圖創建縱橫比。因為這些代碼行非常簡單直接，所以我們不會深入研究實現細節。您可以參考SnapKit.io網站，因為它的文檔非常詳細且易於理解。
現在讓我們再次運行它。
它按預期工作。此外，SnapKit還支持我們進行調試。它將準確地向我們顯示約束被破壞的視圖。然後我們可以相應地輕松檢查和更新這些約束。
4.關於SnapKit的結論
閱讀本SnapKit教程後，我們希望您能看到SnapKit以編程方式設置UI的好處。它允許您編寫更少的代碼，這反過來使整個過程更加簡單。然而，作為一個小缺點，我們仍然需要繼續學習如何使用可用的iOS API以編程方式使用自動布局（因為SnapKit只是一個第三方庫，有一天可能不再支持 - 這是非常不可能的，因為圍繞SnapKit開源項目有一個巨大的iOS社區）。
總的來說，如果您希望在以編程方式進行約束時改進代碼，則SnapKit是一個有用的庫。您的Xcode項目將變得更簡潔，更模塊化
SnapKit教程：簡化iOS App開發中的自動布局