SnapKit nedir? Neden projelerimizde kullanmalıyız?

Merhabalar, bu yazımda size basitçe SnapKit’in nasıl kullanılacağı ve hayatımızı nasıl kolaylaştırdığını bir örnek üzerinden göstereceğim.

https://github.com/SnapKit/SnapKit

SnapKit nedir?

SnapKit, geliştiricilerin Storyboard kullanmadan kodda constraintleri hızlı ve kolay bir şekilde oluşturmasına olanak tanıyan Snapchat yazılımcıları tarafından çıkarılan bir kütüphanedir.

Neden kullanmalıyız ?

Storyboard render problemleri, viewların zaman zaman görünmemesi, birden fazla kişi ile çalışılan projelerde ortak yerlerde oluşan conflictlerin çözümünün neredeyse imkansız olması ya da NSLAyoutConstraints ‘ in kullanımının zor ve kod karmaşıklığını artırıyor olması SnapKit kullanılması için gayet yeterli sebepler.

Gelin SnapKit ile kodlarımızı daha kolay, daha temiz ve daha hızlı hale nasıl getiriyoruz bir örnekle inceleyelim.

ViewController.swift’ i açalım ve UIView, UILabel, UIButton ekleyelim :

  private let snapKitView: UIView = {
    let view = UIView()
     view.layer.cornerRadius = 20
     view.backgroundColor = .yellow
     return view
  }()

  private let snapKitLabel: UILabel = {
    let label = UILabel()
    label.font = UIFont(name: "HelveticaNeue-Medium", size: 20)
    label.text = "SnapKit Deneme"
    label.textColor = .white
    return view
  }()

  private let snapKitButton: UILabel = {
    let button = UIButton()
    button.backgroundColor = .lightGray
    button.setTitle("Şimdi Dene!", for: .normal)
    button.setTitleColor(.purple, for: .normal)
    return button
}()

Şimdi, viewDidLoad() ‘ da, view’ e snapKitView’ i ekleyelim:

self.view.addSubview(snapKitView)

Son olarak, SnapKit’i kullanarak snp.makeConstraints ile constraintleri oluşturalım:

 snapKitView.snp.makeConstraints { make in
   make.centerX.equalToSuperview() //1
   make.centerY.equalToSuperview() //2
   make.left.equalToSuperview().offset(50) //3
   make.right.equalToSuperview().offset(-50) //4
   make.height.equalTo(200) //5
  }

1. snapKitView’ı view de yatay olarak ortaladık.
2. snapKitView’ı view de dikey olarak ortaladık.
3. snapKitView’ı view’in solundan 50 px kadar uzanması için bir constraint ekledik.
4. Benzer şekilde bir sağ constraint ekledik.
5. snapKitView her zaman 200 px yüksekliğinde olacak şekilde bir yükseklik ekledik.

Benzer şekilde snapKitLabel ve snapKitButton içinde constraintleri ekleyelim:

self.snapKitView.addSubview(snapKitLabel)
snapKitLabel.snp.makeConstraints { make in
  make.top.equalToSuperview().offset(20) 
  make.centerX.equalToSuperview()
}

self.snapKitView.addSubview(snapKitButton)
snapBtn.snp.makeConstraints { make in
  make.bottom.equalToSuperview().offset(-20)
  make.left.equalToSuperview().offset(30)
  make.right.equalToSuperview().offset(-30)
  make.height.equalTo(60)
}

Son hali şu şekilde görünmelidir:

Bazen oluşturduğumuz constraintleri kaldırıp yeniden oluşturmak ve ya güncellemek isteyebiliriz. snp.updateConstraints ile güncelleme snp.remakeConstraints ile önce varolan constraintleri silip ardından tekrar oluşturabiliriz.

Buraya kadar SnapKit’ in ne olduğunu ve basit bir test örneğini size anlatmaya çalıştım, okuduğunuz için teşekkürler.