Interface Builder: یہ کیا ہے، Xcode میں بصری ڈیزائن اور اسٹوری بورڈز

Interface Builder کیا ہے؟

Interface Builder — Xcode کا ایک جزو جو صارف انٹرفیس کے بصری ڈیزائن کے لیے ہے۔ IB کی تاریخ 1988 میں NeXT کمپنی میں شروع ہوئی، iOS کے ظہور سے بہت پہلے۔ Stefan Pope نے NeXTSTEP کے لیے پہلا ورژن تیار کیا — آپریٹنگ سسٹم جو macOS اور iOS کی بنیاد بنا۔ 1996 میں Apple نے NeXT خریدا اور Interface Builder کو Xcode میں ضم کیا۔

جدید Xcode میں Interface Builder تین فائل فارمیٹس کو سپورٹ کرتا ہے: Storyboard، XIB (Xcode Interface Builder) اور ٹیبل سیلز اور کسٹم ویوز کے لیے XIB فائلیں۔ ان میں سے ہر فارمیٹ UI عناصر کے درجہ بندی، ان کی خصوصیات، کنسٹرینٹس اور کوڈ سے روابط کی XML وضاحت کو محفوظ کرتا ہے۔

IB UIKit سطح پر کام کرتا ہے: بٹن، لیبل، ٹیکسٹ فیلڈز، ٹیبلز، کلیکشنز اور کنسٹرینٹس کو ماؤس سے کینوس پر گھسیٹا جاتا ہے۔ Xcode .storyboard اور .xib فائلوں کو بلڈ مرحلے پر nib آرکائیوز (compiled Interface Builder) میں کمپائل کرتا ہے، جس سے بنڈل کا سائز کم ہوتا ہے اور لوڈنگ تیز ہوتی ہے۔

Apple کے مطابق، UIKit پر iOS پروجیکٹس کا 70% سے زیادہ مختلف ڈیولپمنٹ مراحل میں Interface Builder استعمال کرتا ہے۔ SwiftUI کی بڑھوتری کے باوجود، IB تجارتی ایپلی کیشنز کے لیے معیار بنا ہوا ہے جو iOS 12 اور اس سے نیچے کو سپورٹ کرتی ہیں، اور پیچیدہ کسٹم انٹرفیس کے لیے جن کو Auto Layout کی باریک ترتیب کی ضرورت ہوتی ہے۔

Interface Builder Xcode میں کیسے آیا

Xcode 4 سے پہلے Interface Builder ایک علیحدہ ایپلی کیشن تھی جو کوڈ ایڈیٹر کے متوازی چلتی تھی۔ Xcode 4 (2011) میں Apple نے IB اور کوڈ ایڈیٹر کو ایک واحد IDE میں ضم کیا۔ اس سے کوڈ اور لے آؤٹ کے درمیان ونڈو تبدیل کیے بغیر سوئچ کرنا ممکن ہوا، نیز Attributes Inspector پینل کے ذریعے خصوصیات میں تبدیلیاں ریئل ٹائم میں دیکھنا ممکن ہوا۔

SwiftUI کی آمد کے ساتھ Apple نے اعلانیہ ڈیولپمنٹ پر توجہ مرکوز کی، تاہم Interface Builder UIKit پروجیکٹس کی حمایت کے لیے Xcode میں ضم رہتا ہے۔ ہزاروں موجودہ ایپلی کیشنز IB استعمال کرتی رہتی ہیں اور Apple نے اسے ہٹانے کا اعلان نہیں کیا۔

Storyboard اور XIB: IB فائل فارمیٹس

Interface Builder دو اہم فارمیٹس کو سپورٹ کرتا ہے: Storyboard (.storyboard) اور XIB (.xib)۔ ان کے درمیان فرق دائرہ کار اور استعمال کے منظر نامے میں ہے۔

Storyboard — وہ فائل جس میں ایپلی کیشن کا پورا منظر ہوتا ہے: متعدد اسکرینیں (UIViewController)، ان کے درمیان ٹرانزیشن (segues)، نیویگیشن کنٹرولرز، ٹیب بارز اور تمام UI عناصر۔ Storyboard Info.plist سے UIMainStoryboardFile (k) کلید کے ذریعے اسٹارٹ اپ پر ایک بار لوڈ ہوتا ہے۔ یہ اسکرینوں کے بہاؤ کو دیکھنے کے لیے آسان ہے، لیکن git میں merge تنازعات کا سبب بنتا ہے کیونکہ پوری ایپلی کیشن کی XML وضاحت ایک فائل میں محفوظ ہوتی ہے۔

XIB (Xcode Interface Builder کا مخفف) — ایک جزو کے لیے فائل: علیحدہ UIView، UITableViewCell، UICollectionViewCell یا ایک ViewController۔ XIB ضرورت پر UINib(nibName:bundle:) (k) یا Bundle.loadNibNamed (k) طریقہ کے ذریعے لوڈ ہوتا ہے۔ XIB فائلیں ضم کرنے میں آسان، زیادہ کمپیکٹ اور تیزی سے لوڈ ہوتی ہیں کیونکہ ان میں پوری ایپلیکیشن کی وضاحت نہیں ہوتی۔

Xcode 11 ورژن سے Apple انفرادی اجزاء کے لیے XIB استعمال کرنے اور یک سنگی Storyboard سے بچنے کی سفارش کرتا ہے۔ اسکرینوں کے درمیان نیویگیشن کے لیے UIStoryboardSegue (k) کے ذریعے دستی کوڈ پر مبنی نیویگیشن یا کوآرڈینیٹر ترجیح دی جاتی ہے۔

IB فائلوں میں XML کی ساخت

.storyboard اور .xib فائلیں XML کو Interface Builder Cocoa Touch XIB (dt) فارمیٹ میں محفوظ کرتی ہیں۔ آسان ساخت کی مثال:

<!-- UIView اور UILabel کے ساتھ XIB فائل -->
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB"
          version="3.0">
  <objects>
    <view id="abc-123"
          userLabel="CustomHeaderView"
          contentMode="scaleToFill">
      <subviews>
        <label id="def-456"
               text="عنوان"
               textColor="darkTextColor"
               fontDescription="title1"/>
      </subviews>
    </view>
  </objects>
</document>

ہر عنصر کا ایک منفرد id (an) ہوتا ہے، جس کے ذریعے IB XML نوڈ کو runtime آبجیکٹ سے جوڑتا ہے۔ کمپائلیشن کے دوران Xcode XML کو بائنری nib فارمیٹ (.nib) میں تبدیل کرتا ہے، فائل کا سائز تقریباً 40% کم کرتا ہے۔

Interface Builder میں Auto Layout اور Size Classes

Auto Layout — ریاضیاتی تعلقات (کنسٹرینٹس) کے ذریعے اسکرین پر عناصر کو پوزیشن کرنے کا نظام۔ Interface Builder کوڈ لکھے بغیر کنسٹرینٹس بنانے، ترمیم کرنے اور ڈیبگ کرنے کے لیے بصری انٹرفیس فراہم کرتا ہے۔ ہر کنسٹرینٹ ایک انحصار کو بیان کرتا ہے: view.leading = superview.leading + 16 (k) یا view.width = 2 * otherView.height (k)۔

IB میں کنسٹرینٹس Pin (مارجن، چوڑائی، اونچائی مقرر کرنا) اور Align (مرکز، کناروں، baseline پر سیدھ) مینیو کے ذریعے بنائے جاتے ہیں۔ Size Inspector پینل منتخب عنصر کے تمام کنسٹرینٹس، ان کی ترجیحات (required/high/low) دکھاتا ہے اور ضرب کنندگان اور مستقل میں ترمیم کی اجازت دیتا ہے۔

IB UIStackView کو بھی سپورٹ کرتا ہے — ایک کنٹینر جو خود بخود چائلڈ ویوز کی ترتیب کا انتظام کرتا ہے۔ عناصر کو کینوس پر اسٹیک ویو میں رکھنا کافی ہے اور IB ضروری کنسٹرینٹس خود بخود پیدا کر دے گا۔ یہ دستی کنسٹرینٹ پلیسمنٹ کے مقابلے میں لے آؤٹ کو نمایاں طور پر تیز کرتا ہے۔

Size Classes: آلات کے مطابق ڈھالنا

Size Classes — ایک تجرید جو آلات کو اسکرین کی چوڑائی اور اونچائی کے مطابق گروپ کرتی ہے: Compact اور Regular۔ امتزاج (iPhone پورٹریٹ کے لیے wC hR، iPad کے لیے wR hR) مختلف منظرناموں کے لیے مختلف کنسٹرینٹس اور عناصر کی ترتیب مقرر کرنے کی اجازت دیتے ہیں۔ Interface Builder میں size classes کے درمیان سوئچ کرنے سے کینوس پر فعال کنسٹرینٹس کا سیٹ بدل جاتا ہے۔

size class کے مطابق تغیر کے ساتھ کنسٹرینٹ کی مثال:

import UIKit

class AdaptiveViewController: UIViewController {

    @IBOutlet weak var titleLabel: UILabel!
    @IBOutlet weak var leadingConstraint: NSLayoutConstraint!

    private func updateConstraints() {
        let isRegular = traitCollection.horizontalSizeClass == .regular
        leadingConstraint.constant = isRegular ? 40 : 16
        titleLabel.font = isRegular
            ? UIFont.preferredFont(forTextStyle: .largeTitle)
            : UIFont.preferredFont(forTextStyle: .title1)
    }

    override func traitCollectionDidChange(
        _ previousTraitCollection: UITraitCollection?
    ) {
        super.traitCollectionDidChange(previousTraitCollection)
        if traitCollection.horizontalSizeClass != previousTraitCollection?.horizontalSizeClass {
            updateConstraints()
        }
    }
}

اوپر والے کوڈ میں traitCollectionDidChange size class کی تبدیلی پر رد عمل ظاہر کرتا ہے، کنسٹرینٹ اور فونٹ کو اپ ڈیٹ کرتا ہے۔ Interface Builder انسپکٹر کے ذریعے ہر size class کے لیے ڈیفالٹ ویلیوز سیٹ کرنے کی اجازت دیتا ہے، اور کوڈ متحرک منظرناموں کے لیے استعمال ہوتا ہے جنہیں جامد طور پر بیان نہیں کیا جا سکتا۔

IBOutlet، IBAction اور کوڈ کا UI سے تعلق

Interface Builder میں بصری انٹرفیس اور Swift/Objective-C کوڈ کے درمیان تعلق دو میکانزم کے ذریعے ہوتا ہے: IBOutlet (Interface Builder Outlet) اور IBAction (Interface Builder Action)۔ دونوں IB کینوس سے Ctrl دبائے ہوئے کنٹرولر فائل میں گھسیٹ کر بنائے جاتے ہیں۔

IBOutlet — ایک تشریح جو UI عنصر کا حوالہ دیتی ہے۔ Xcode اسے nib آرکائیو میں متعلقہ آبجیکٹ سے خود بخود لوڈ ہونے پر جوڑ دیتا ہے۔ اگر کنکشن ٹوٹ جائے (مثال کے طور پر، عنصر کا نام تبدیل کر دیا گیا)، تو ایپلیکیشن NSUnknownKeyException (k) کی غلطی کے ساتھ کریش ہو جاتی ہے۔ IBOutlet کو weak (k) کے طور پر نشان زد کیا جاتا ہے، کیونکہ nib آبجیکٹ کا مالک ہے اور کنٹرولر صرف ایک مبصر ہے۔

IBAction — ایک طریقہ جو UI عنصر کے کسی واقعے پر بلایا جاتا ہے: بٹن دبانا، متن تبدیل کرنا، سوئچر پلٹنا۔ IB UIControlEvent (k) کو طریقہ سے addTarget:action:forControlEvents: (k) کے ذریعے جوڑتا ہے۔ کوڈ میں IBAction ایک عام طریقہ کی طرح ظاہر ہوتا ہے جس کی واپسی کی قسم IBAction (dt) ہوتی ہے۔

import UIKit

final class LoginViewController: UIViewController {

    @IBOutlet weak var emailTextField: UITextField!
    @IBOutlet weak var passwordTextField: UITextField!
    @IBOutlet weak var loginButton: UIButton!
    @IBOutlet weak var spinner: UIActivityIndicatorView!

    @IBAction private func loginButtonTapped(_ sender: UIButton) {
        guard let email = emailTextField.text, !email.isEmpty,
              let password = passwordTextField.text, !password.isEmpty
        else {
            showAlert(message: "تمام فیلڈز پُر کریں")
            return
        }
        loginButton.isEnabled = false
        spinner.startAnimating()
        performLogin(email: email, password: password)
    }

    private func performLogin(email: String, password: String) {
        /// URLSession کے ذریعے API کال
        let request = LoginRequest(email: email, password: password)
        APIClient.shared.login(request) { [weak self] result in
            DispatchQueue.main.async {
                guard let self else { return }
                self.spinner.stopAnimating()
                self.loginButton.isEnabled = true
                switch result {
                case .success:
                    self.navigateToMainScreen()
                case .failure(let error):
                    self.showAlert(message: error.localizedDescription)
                }
            }
        }
    }

    private func showAlert(message: String) {
        let alert = UIAlertController(
            title: "خرابی",
            message: message,
            preferredStyle: .alert
        )
        alert.addAction(UIAlertAction(title: "OK", style: .default))
        present(alert, animated: true)
    }
}

مثال میں ایک معیاری کنکشن دکھایا گیا ہے: ٹیکسٹ فیلڈز، بٹن اور اسپنر کے لیے IBOutlet، بٹن دبانے کو ہینڈل کرنے کے لیے IBAction۔ یہ تمام کنکشن Interface Builder میں Ctrl+drag کے ذریعے قائم کیے جاتے ہیں۔ اگر کنکشن ترتیب نہیں دیا گیا تو IBOutlet runtime پر nil (v) ہو گا، جس سے رسائی پر کریش ہو گا — اس لیے IBOutlet کو implicit unwrap کے ساتھ weak var (k s) کے طور پر اعلان کیا جاتا ہے۔

@IBDesignable اور @IBInspectable: کسٹم اجزاء

@IBDesignable — Swift تشریح جو کسٹم UIView کو ریئل ٹائم میں براہ راست Interface Builder کینوس پر دکھانے کی اجازت دیتی ہے۔ ڈیولپر ایپلیکیشن چلائے بغیر کوڈ تبدیلیوں کا نتیجہ دیکھتا ہے۔ @IBInspectable — خصوصیات کے لیے تشریح جو انہیں IB کے Attributes Inspector پینل میں شامل کرتی ہے، جہاں اقدار کو انٹرایکٹیو طور پر تبدیل کیا جا سکتا ہے۔

یہ تشریحات UI اجزاء کی لائبریریاں بناتے وقت خاص طور پر مفید ہیں: کسٹم بٹن، ماسک والے ان پٹ فیلڈز، اینی میٹڈ انڈیکیٹرز۔ IBDesignable ایپلیکیشن کے مرکزی بائنری کو متاثر کیے بغیر علیحدہ بلڈ کوڈ کمپائلیشن کے لیے prepareForInterfaceBuilder() (fn) استعمال کرتا ہے۔

import UIKit

@IBDesignable
final class GradientButton: UIButton {

    @IBInspectable var startColor: UIColor = .systemBlue {
        didSet { updateGradient() }
    }

    @IBInspectable var endColor: UIColor = .systemPurple {
        didSet { updateGradient() }
    }

    @IBInspectable var cornerRadius: CGFloat = 12 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = true
        }
    }

    private let gradientLayer = CAGradientLayer()

    override init(frame: CGRect) {
        super.init(frame: frame)
        setupGradient()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)
        setupGradient()
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        gradientLayer.frame = bounds
    }

    private func setupGradient() {
        layer.insertSublayer(gradientLayer, at: 0)
        updateGradient()
    }

    private func updateGradient() {
        gradientLayer.colors = [startColor.cgColor, endColor.cgColor]
        gradientLayer.startPoint = CGPoint(x: 0, y: 0.5)
        gradientLayer.endPoint = CGPoint(x: 1, y: 0.5)
    }

    override func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
        setupGradient()
    }
}

اوپر والے کوڈ میں GradientButton ایک IBDesignable جزو ہے جس میں startColor (v)، endColor (v) اور cornerRadius (v) IBInspectable خصوصیات ہیں۔ IB کینوس پر UIView گھسیٹ کر Identity Inspector میں کلاس کو GradientButton میں تبدیل کرنے پر، کینوس پر ریئل ٹائم میں گریڈینٹ والا بٹن ظاہر ہو گا۔ تمام IBInspectable خصوصیات دائیں طرف Attributes Inspector پینل میں ظاہر ہوں گی۔

اہم: @IBDesignable IB میں دکھانے کے لیے کوڈ کو مکمل طور پر کمپائل کرتا ہے، اس لیے اس کے اندر نیٹ ورک کی درخواستیں یا لمبی کارروائیاں نہیں کی جانی چاہئیں۔ فرق کرنے کے لیے #if TARGET_INTERFACE_BUILDER (k) استعمال کیا جاتا ہے — مشروط کمپائلیشن جو IB کے لیے نہ بنائے گئے کوڈ کو خارج کرتی ہے۔

IB فائلوں کا کمپائلیشن کے دوران لائف سائیکل

Interface Builder فائلوں کے nib تخلیق سے اسکرین پر ظاہر ہونے تک تبدیلی کا عمل کئی مراحل پر مشتمل ہے۔ اس چکر کو سمجھنے سے IB کے ساتھ مسائل کی تشخیص میں مدد ملتی ہے۔

بلڈ مرحلے پر Xcode ibtool (k, fn) ٹول چلاتا ہے — .storyboard اور .xib فائلوں کو بائنری nib فارمیٹ میں کمپائل کرنے کے لیے کمانڈ لائن یوٹیلیٹی۔ ibtool توثیق بھی کرتا ہے: کنسٹرینٹس کی درستگی، تمام کلاسز کی موجودگی، IBOutlet/IBAction کنکشن کی اقسام کی جانچ کرتا ہے۔ توثیق کی غلطیاں Xcode کے Issue Navigator میں دکھائی جاتی ہیں۔

حتمی .nib آرکائیو ایپلیکیشن بنڈل میں .nib (s) فولڈر میں رکھا جاتا ہے۔ nib فائل کا سائز اصل XML سے نمایاں طور پر چھوٹا ہوتا ہے: بائنری فارمیٹ ٹوکن کے ساتھ سٹرنگز کی تبدیلی اور عددی اقدار کے کمپریشن کے ساتھ بہتر نمائندگی استعمال کرتا ہے۔ عام کمپریشن اصل XML سائز کا 50–60% ہے۔

runtime میں nib UINib(nibName:bundle:) (k) یا خود بخود UIStoryboard.instantiateViewController(withIdentifier:) (k) کے ذریعے لوڈ ہوتا ہے۔ لوڈنگ کے عمل میں شامل ہیں:

• ڈی سیریلائزیشن — بائنری nib کا Objective-C/Swift آبجیکٹ گراف میں تبدیل ہونا
• تخلیق — آرکائیو سے تمام UI عناصر کے نمونوں کی تخلیق
• بحالی — IBOutlet اور IBAction کنکشنز کی بحالی (گروپس کے لیے outletCollection)
• اطلاق — size class کو مدنظر رکھتے ہوئے آرکائیو سے Auto Layout کنسٹرینٹس کا اطلاق
• کال — ہر آبجیکٹ کے لیے awakeFromNib() (fn) کا بلایا جانا — پوسٹ لوڈ کنفیگریشن کے لیے داخلے کا نقطہ

awakeFromNib() (fn) طریقہ تمام IBOutlet سیٹ ہونے کے بعد، لیکن پہلے layoutSubviews سے پہلے بلایا جاتا ہے۔ یہ ابتدائی کنفیگریشن کے لیے آسان ہے: گولائی سیٹ کرنا، شیڈو شامل کرنا، متن کا لوکلائزیشن۔ تاہم، تمام IBOutlet awakeFromNib میں nil نہ ہونے کی ضمانت دی جاتی ہے۔

Interface Builder بمقابلہ SwiftUI Preview

2019 میں SwiftUI کی ریلیز کے ساتھ iOS ڈیولپرز کو Interface Builder کا متبادل ملا — ریئل ٹائم Canvas Preview کے ساتھ ایک اعلانیہ فریم ورک۔ دو طریقوں کے اہم فرق دیکھتے ہیں۔

Interface Builder nib میں کمپائل ہونے والی XML وضاحت پیدا کرتا ہے۔ انٹرفیس بصری طور پر بنایا جاتا ہے، کوڈ صرف منطق کے لیے ذمہ دار ہے۔ IB پروگرامنگ کی مہارت کے بغیر ڈیزائنرز کے لیے کم داخلے کی حد رکھتا ہے، لیکن کوڈ ریویو میں پیچیدہ ہے (XML تبدیلیاں diff میں نظر نہیں آتیں)۔

SwiftUI Preview — مکمل طور پر کوڈ پر مبنی ڈیولپمنٹ۔ انٹرفیس Swift میں بیان کیا جاتا ہے، پیش نظارہ ہر سیو پر اپ ڈیٹ ہوتا ہے۔ کوئی XML نہیں، کوئی nib نہیں، IBOutlet کنکشن ٹوٹنے کا کوئی خطرہ نہیں۔ SwiftUI Preview IB سے تیز کام کرتا ہے کیونکہ اسے علیحدہ فائل کمپائلیشن کی ضرورت نہیں ہوتی۔

عملی طور پر، IB اور SwiftUI Preview کے درمیان انتخاب پروجیکٹ کی ضروریات پر منحصر ہے۔ Interface Builder پرانے iOS کو سپورٹ کرنے والی UIKit ایپلی کیشنز کے لیے ناگزیر ہے، اور تجارتی پروجیکٹس کے لیے جہاں ڈیزائنرز Swift کی مہارت کے بغیر Xcode میں کام کرتے ہیں۔ SwiftUI نئے پروجیکٹس کے لیے ترجیح دی جاتی ہے جو iOS 17+ پر مرکوز ہوں، جہاں ڈیولپمنٹ کی رفتار اور رد عمل اہم ہو۔

Apple کا Interface Builder کو Xcode سے ہٹانے کا کوئی منصوبہ نہیں۔ مزید برآں، Xcode 16 میں کمپنی نے IB کینوس کی کارکردگی کو بہتر کیا اور UIViewRepresentable Bridge کے ذریعے SwiftUI اجزاء کے لیے سپورٹ شامل کیا۔ توقع ہے کہ IB کم از کم 2030 تک سپورٹ کیا جائے گا۔

Interface Builder کے ساتھ کام کرنے کے بہترین طریقے

iOS ڈیولپمنٹ کے کئی سالوں کے تجربے نے سفارشات کا ایک سیٹ تشکیل دیا ہے جو تجارتی پروجیکٹس میں Interface Builder استعمال کرتے وقت مسائل کو کم کرتا ہے۔

دوبارہ استعمال ہونے والے اجزاء کے لیے Storyboard کے بجائے XIB استعمال کریں۔ ہر کسٹم ٹیبل سیل، ہیڈر یا فوٹر علیحدہ XIB میں ہونا چاہیے۔ اس سے merge آسان ہوتا ہے، لوڈنگ تیز ہوتی ہے اور Swift Package Manager یا CocoaPods کے ذریعے اجزاء کو پروجیکٹس کے درمیان دوبارہ استعمال کرنے کی اجازت ملتی ہے۔

بڑے اسٹوری بورڈز کو ماڈیولز میں تقسیم کرنے کے لیے Storyboard References ترتیب دیں۔ 100 اسکرینوں والے ایک Main.storyboard کے بجائے ہر ماڈیول (Auth, Profile, Feed) کے لیے ایک اسٹوری بورڈ بنائیں اور انہیں Storyboard Reference کے ذریعے جوڑیں۔ اس سے ibtool کمپائلیشن کا وقت کم ہو گا اور ٹیم ورک آسان ہو جائے گا۔

بغیر جانچ کے File's Owner (k) سے IBOutlet کنکشن سے بچیں۔ ہر کنکشن weak (k) اور اختیاری ہونا چاہیے (implicitly unwrapped optional صرف playground میں اچھا ہے)۔ ویو میں IBOutlet کا نام تبدیل کرتے وقت Xcode خود بخود کنکشن اپ ڈیٹ کرتا ہے، لیکن XML کو دستی طور پر ایڈٹ کرتے وقت غلطی کرنا آسان ہے۔

• IB فائل میں ترمیم کے بعد ہمیشہ Show Connection Panel (k) چیک کریں — سرخ اشارے ٹوٹے ہوئے کنکشن کی نشاندہی کرتے ہیں
• کوڈ کے بغیر خصوصیات سیٹ کرنے کے لیے User Defined Runtime Attributes (k) استعمال کریں: layer.cornerRadius, layer.borderWidth, tintColor
• IB میں کنسٹرینٹس کو مقصد کے مطابق گروپ کریں: سائز کے لیے کنسٹرینٹس، مارجن کے لیے کنسٹرینٹس، تناسب کے لیے کنسٹرینٹس
• Size Inspector میں ہر کنسٹرینٹ کو ایک Identifier (k) تفویض کریں — تنازعات میں ڈیبگنگ میں مدد کرتا ہے
• awakeFromNib میں کاروباری منطق نہ رکھیں — صرف UI کنفیگریشن۔ منطق viewDidLoad یا علیحدہ سروسز میں رکھیں

import UIKit

final class ProfileHeaderView: UIView {

    @IBOutlet weak var avatarImageView: UIImageView!
    @IBOutlet weak var nameLabel: UILabel!
    @IBOutlet weak var bioLabel: UILabel!
    @IBOutlet weak var editButton: UIButton!

    override func awakeFromNib() {
        super.awakeFromNib()
        avatarImageView.layer.cornerRadius = avatarImageView.bounds.width / 2
        avatarImageView.layer.masksToBounds = true
        nameLabel.font = UIFont.preferredFont(forTextStyle: .headline)
        bioLabel.font = UIFont.preferredFont(forTextStyle: .subheadline)
    }

    func configure(with profile: UserProfile) {
        nameLabel.text = profile.fullName
        bioLabel.text = profile.bio
        /// SDWebImage یا Kingfisher کے ذریعے اوتار لوڈ کرنا
    }

    static func instantiateFromNib() -> ProfileHeaderView {
        let nib = UINib(nibName: String(describing: self), bundle: nil)
        return nib.instantiate(withOwner: nil).first as! ProfileHeaderView
    }
}

مثال میں XIB ویوز کے لیے بہترین طریقہ دکھایا گیا ہے: جامد طریقہ instantiateFromNib (fn) ویو کو کلاس کے برابر نام والے XIB سے لوڈ کرتا ہے۔ awakeFromNib (fn) طریقہ UI ترتیب دیتا ہے (گولائیاں، فونٹس) اور configure(with:) (fn) طریقہ بھرنے کے لیے ڈیٹا ماڈل قبول کرتا ہے۔ ذمہ داریوں کی علیحدگی جانچ اور دوبارہ استعمال کو آسان بناتی ہے۔