Hizalama nedir?

iOS geliştirmede hizalama, kullanıcı arayüzü öğelerinin (UIViews) birbirlerine veya kapsayıcılarına (superview) göre konumlandırılması mekanizmalarını ifade eder. Temel yaklaşımlar şunlardır:

1. Çerçeveler (Frames): Her View’un konumu ve boyutunun (x, y, width, height) onun süperview’inin koordinat sisteminde atanması. Basit ve sabit düzenler için uygundur.

2. Auto Layout: Kurallar (kısıtlamalar) kümesine dayanan deklaratif bir düzenleme sistemi olup, Views arasındaki ilişkileri tanımlar. Farklı ekran boyutları ve yönelimlere uyum sağlayan esnek bir yaklaşımdır.

   • Kısıtlamalar (Constraints): View’un özellikleri üzerinde sınırlar belirleyen kurallar (örneğin, leading, trailing, top, bottom, centerY, centerX, width, height).
   • Kısıtlamanın önceliği: Çakışmaları çözerken kısıtlamanın önemini belirten sayısal değer (1-1000).

   NSLayoutConstraint kullanımıyla örnek:

   let myView = UIView()
   myView.translatesAutoresizingMaskIntoConstraints = false
   superview.addSubview(myView)
   
   NSLayoutConstraint.activate([
       myView.leadingAnchor.constraint(equalTo: superview.leadingAnchor, constant: 20),
       myView.trailingAnchor.constraint(equalTo: superview.trailingAnchor, constant: -20),
       myView.topAnchor.constraint(equalTo: superview.topAnchor, constant: 80),
       myView.heightAnchor.constraint(equalToConstant: 100)
   ])
   

   Layout Anchors kullanımıyla örnek:

   let myView = UIView()
   myView.translatesAutoresizingMaskIntoConstraints = false
   superview.addSubview(myView)
   
   NSLayoutConstraint.activate([
       myView.centerXAnchor.constraint(equalTo: superview.centerXAnchor),
       myView.centerYAnchor.constraint(equalTo: superview.centerYAnchor),
       myView.widthAnchor.constraint(equalToConstant: 200),
       myView.heightAnchor.constraint(equalToConstant: 150)
   ])
   

   VFL (Visual Format Language) kullanımıyla örnek:

   let myView = UIView()
   myView.translatesAutoresizingMaskIntoConstraints = false
   superview.addSubview(myView)
   
   let views: [String: UIView] = ["myView": myView]
   let metrics: [String: CGFloat] = ["margin": 20]
   
   NSLayoutConstraint.activate(NSLayoutConstraint.constraints(withVisualFormat: "H:|-margin-[myView]-margin-|",
                                                              options: [],
                                                              metrics: metrics,
                                                              views: views))
   NSLayoutConstraint.activate(NSLayoutConstraint.constraints(withVisualFormat: "V:|-80-[myView(100)]",
                                                              options: [],
                                                              metrics: nil,
                                                              views: views))
   

3. Otomatik Yeniden Boyutlandırma Maskesi: Auto Layout’tan önce gelen basit hizalama sistemidir. View’un süperview boyutu değiştiğinde nasıl genişleyeceği veya daralacağına karar verir. Auto Layout kadar esnek değildir ve genellikle devre dışı bırakılır (translatesAutoresizingMaskIntoConstraints = false).

4. Stack Views (UIStackView UIKit'te, VStack/HStack/ZStack SwiftUI’da): Alt görünümlerinin (arrangedSubviews) düzenlenmesini ve boyutlandırılmasını otomatik yöneten kapsayıcılar. Özellikler (axis, alignment, distribution, spacing) temel alınarak düzenler.

   let stackView = UIStackView()
   stackView.axis = .vertical
   stackView.alignment = .center
   stackView.distribution = .equalSpacing
   stackView.spacing = 10
   
   let label = UILabel()
   label.text = "Hello"
   let button = UIButton(type: .system)
   button.setTitle("Tap Me", for: .normal)
   
   stackView.addArrangedSubview(label)
   stackView.addArrangedSubview(button)
   
   superview.addSubview(stackView)
   // StackView’i süperview’de konumlandırmak için constraints ekleyin
   

Hangi hizalama yönteminin kullanılacağı, düzenin karmaşıklığına ve uyarlanabilirlik gereksinimlerine bağlıdır. Günümüzde çoğu uygulamada Auto Layout ve Stack Views birlikte tercih edilir.