Interface Builder iOS और macOS डेवलपमेंट के लिए Xcode में निर्मित एक विज़ुअल इंटरफ़ेस संपादक है। यह drag-and-drop के माध्यम से UI बनाने, Auto Layout कॉन्फ़िगर करने और IBOutlet और IBAction के माध्यम से कोड कनेक्ट करने की अनुमति देता है। आइए जानें कि IB कैसे काम करता है, Storyboard और XIB में क्या अंतर है, और @IBDesignable की क्यों आवश्यकता है।
मुख्य बिंदु
Interface Builder Xcode का एक घटक है जो उपयोगकर्ता इंटरफ़ेस के विज़ुअल डिज़ाइन के लिए डिज़ाइन किया गया है। IB का इतिहास 1988 में NeXT में शुरू हुआ, iOS के आगमन से बहुत पहले। स्टीफ़न पोप ने 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 आर्काइव (संकलित Interface Builder) में संकलित करता है, जो बंडल आकार को कम करता है और लोडिंग को गति देता है।
Apple के अनुसार, UIKit पर 70% से अधिक iOS प्रोजेक्ट विकास के विभिन्न चरणों में Interface Builder का उपयोग करते हैं। SwiftUI के विकास के बावजूद, IB iOS 12 और उससे नीचे का समर्थन करने वाले वाणिज्यिक अनुप्रयोगों के साथ-साथ जटिल कस्टम इंटरफ़ेस के लिए मानक बना हुआ है जिन्हें Auto Layout की सूक्ष्म ट्यूनिंग की आवश्यकता होती है।
Xcode 4 से पहले, Interface Builder कोड संपादक के समानांतर चलने वाला एक अलग एप्लिकेशन था। Xcode 4 (2011) में, Apple ने IB और कोड संपादक को एक एकल IDE में विलय कर दिया। इसने विंडो स्विच किए बिना कोड और लेआउट के बीच स्विच करने और Attributes Inspector पैनल के माध्यम से वास्तविक समय में गुण परिवर्तन देखने की अनुमति दी।
| Xcode संस्करण | वर्ष | Interface Builder में परिवर्तन |
|---|---|---|
| Xcode 3 | 2008 | IB — अलग एप्लिकेशन, iOS 2.0 समर्थन |
| Xcode 4 | 2011 | IB IDE में एकीकृत, Storyboard का आगमन |
| Xcode 5 | 2013 | बाधा मेनू के साथ Auto Layout, स्क्रीन पूर्वावलोकन |
| Xcode 6 | 2014 | Size Classes, @IBDesignable, Preview Assistant |
| Xcode 11 | 2019 | SwiftUI Canvas, IB UIKit के लिए बना रहा |
| Xcode 15 | 2023 | SwiftUI Preview मुख्य उपकरण के रूप में, IB लीगेसी मोड |
2019 में SwiftUI की शुरुआत के साथ, Apple ने घोषणात्मक विकास पर ध्यान केंद्रित किया, हालांकि Interface Builder UIKit प्रोजेक्ट्स का समर्थन करने के लिए Xcode में निर्मित बना हुआ है। हजारों मौजूदा एप्लिकेशन IB का उपयोग जारी रखते हैं, और Apple ने इसके हटाने की घोषणा नहीं की है।
Interface Builder दो मुख्य प्रारूपों का समर्थन करता है: Storyboard (.storyboard) और XIB (.xib)। उनके बीच अंतर दायरे और उपयोग के मामले में है।
Storyboard एक फ़ाइल है जिसमें संपूर्ण एप्लिकेशन दृश्य शामिल है: एकाधिक स्क्रीन (UIViewController), उनके बीच संक्रमण (segues), नेविगेशन नियंत्रक, टैब बार और सभी UI तत्व। Storyboard UIMainStoryboardFile (k) कुंजी के माध्यम से Info.plist से स्टार्टअप पर एक बार लोड होता है। यह स्क्रीन प्रवाह को विज़ुअलाइज़ करने के लिए सुविधाजनक है, लेकिन git में मर्ज विरोध के साथ समस्याएँ पैदा करता है, क्योंकि संपूर्ण एप्लिकेशन का XML विवरण एक ही फ़ाइल में संग्रहीत होता है।
XIB (Xcode Interface Builder का संक्षिप्त रूप) एक घटक के लिए एक फ़ाइल है: एक व्यक्तिगत UIView, UITableViewCell, UICollectionViewCell, या एक ViewController। XIB UINib(nibName:bundle:) (k) या Bundle.loadNibNamed (k) विधि के माध्यम से आवश्यकतानुसार लोड किया जाता है। XIB फ़ाइलें मर्ज करने में आसान, अधिक कॉम्पैक्ट और तेज़ी से लोड होती हैं क्योंकि उनमें संपूर्ण एप्लिकेशन का विवरण नहीं होता है।
| मानदंड | Storyboard | XIB |
|---|---|---|
| दायरा | एकाधिक स्क्रीन + संक्रमण | एक स्क्रीन या घटक |
| Segues | समर्थन करता है (push, modal, unwind) | समर्थन नहीं करता |
| Git मर्ज | कठिन (एक बड़ा XML) | आसान (कई छोटी फ़ाइलें) |
| लोडिंग | एप्लिकेशन स्टार्ट पर | आवश्यकतानुसार (आलसी) |
| पुन: उपयोग | केवल storyboard संदर्भों के माध्यम से | उच्च (कोशिकाएँ, हेडर, व्यू) |
| Apple अनुशंसा | बड़े प्रोजेक्ट के लिए अनुशंसित नहीं | घटकों के लिए अनुशंसित |
Xcode 11 के बाद से, Apple व्यक्तिगत घटकों के लिए XIB का उपयोग करने और मोनोलिथिक Storyboard से बचने की अनुशंसा करता है। स्क्रीन के बीच नेविगेशन के लिए, मैन्युअल रूप से UIStoryboardSegue (k) या कोऑर्डिनेटर के माध्यम से कोड-आधारित नेविगेशन पसंद किया जाता है।
.storyboard और .xib फ़ाइलें Interface Builder Cocoa Touch XIB (dt) प्रारूप में XML संग्रहीत करती हैं। सरलीकृत संरचना का उदाहरण:
<!-- XIB file with UIView and UILabel -->
<?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="Title"
textColor="darkTextColor"
fontDescription="title1"/>
</subviews>
</view>
</objects>
</document>प्रत्येक तत्व में एक अद्वितीय id (an) होता है, जिसके द्वारा IB XML नोड को रनटाइम ऑब्जेक्ट से जोड़ता है। संकलन के दौरान, Xcode XML को बाइनरी nib प्रारूप (.nib) में परिवर्तित करता है, जिससे फ़ाइल का आकार लगभग 40% कम हो जाता है।
Auto Layout गणितीय संबंधों (बाधाओं) के माध्यम से स्क्रीन पर तत्वों को स्थापित करने की एक प्रणाली है। Interface Builder कोड लिखे बिना बाधाओं को बनाने, संपादित करने और डीबग करने के लिए एक विज़ुअल इंटरफ़ेस प्रदान करता है। प्रत्येक बाधा एक निर्भरता का वर्णन करती है: view.leading = superview.leading + 16 (k) या view.width = 2 * otherView.height (k)।
IB में, बाधाएँ Pin मेनू (मार्जिन, चौड़ाई, ऊँचाई निर्धारित करना) और Align मेनू (केंद्रित करना, किनारे, बेसलाइन) के माध्यम से बनाई जाती हैं। Size Inspector पैनल चयनित तत्व की सभी बाधाओं, उनकी प्राथमिकताओं (required/high/low) को दिखाता है और गुणकों और स्थिरांकों को संपादित करने की अनुमति देता है।
IB UIStackView का भी समर्थन करता है — एक कंटेनर जो स्वचालित रूप से चाइल्ड व्यू के लेआउट का प्रबंधन करता है। बस कैनवास पर स्टैक व्यू में तत्व रखें, और IB स्वचालित रूप से आवश्यक बाधाएँ उत्पन्न करेगा। यह मैन्युअल बाधा प्लेसमेंट की तुलना में लेआउट को काफी गति देता है।
Size Classes एक अमूर्तता है जो उपकरणों को स्क्रीन चौड़ाई और ऊँचाई के अनुसार समूहित करती है: Compact और Regular। संयोजन (iPhone पोर्ट्रेट के लिए wC hR, iPad के लिए wR hR) विभिन्न परिदृश्यों के लिए अलग-अलग बाधाएँ और तत्व लेआउट निर्दिष्ट करने की अनुमति देते हैं। Interface Builder में, size classes के बीच स्विच करने से कैनवास पर सक्रिय बाधाओं का सेट बदल जाता है।
| उपकरण | ओरिएंटेशन | Width Class | Height Class |
|---|---|---|---|
| iPhone (Max/Plus को छोड़कर) | पोर्ट्रेट | Compact | Regular |
| iPhone (Max/Plus को छोड़कर) | लैंडस्केप | Compact | Compact |
| iPhone Plus/Max | लैंडस्केप | Regular | Compact |
| iPad | कोई भी | Regular | Regular |
| iPad Split View | 1/3 स्क्रीन | Compact | Regular |
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 के लिए डिफ़ॉल्ट मान सेट करने की अनुमति देता है, जबकि कोड का उपयोग गतिशील परिदृश्यों के लिए किया जाता है जिन्हें स्थिर रूप से वर्णित नहीं किया जा सकता है।
Interface Builder में विज़ुअल इंटरफ़ेस और Swift/Objective-C कोड के बीच कनेक्शन दो तंत्रों के माध्यम से किया जाता है: IBOutlet (Interface Builder Outlet) और IBAction (Interface Builder Action)। दोनों IB कैनवास से नियंत्रक फ़ाइल में Ctrl+drag करके बनाए जाते हैं।
IBOutlet एक एनोटेशन है जो UI तत्व के संदर्भ की घोषणा करता है। Xcode लोड होने पर इसे स्वचालित रूप से nib आर्काइव में संबंधित ऑब्जेक्ट से जोड़ता है। यदि कनेक्शन टूट जाता है (उदाहरण के लिए, किसी तत्व का नाम बदल दिया जाता है), तो एप्लिकेशन NSUnknownKeyException (k) त्रुटि के साथ क्रैश हो जाता है। IBOutlet को weak (k) के रूप में चिह्नित किया जाता है, क्योंकि nib ऑब्जेक्ट का मालिक है और नियंत्रक केवल एक पर्यवेक्षक है।
IBAction एक विधि है जो UI तत्व की घटना पर कॉल की जाती है: बटन दबाना, टेक्स्ट बदलना, स्विच टॉगल करना। IB addTarget:action:forControlEvents: (k) के माध्यम से UIControlEvent (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: "Fill in all fields")
return
}
loginButton.isEnabled = false
spinner.startAnimating()
performLogin(email: email, password: password)
}
private func performLogin(email: String, password: String) {
/// API call via URLSession
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: "Error",
message: message,
preferredStyle: .alert
)
alert.addAction(UIAlertAction(title: "OK", style: .default))
present(alert, animated: true)
}
}उदाहरण एक मानक सेटअप दिखाता है: टेक्स्ट फ़ील्ड, बटन और स्पिनर के लिए IBOutlet, टैप को संभालने के लिए IBAction। ये सभी कनेक्शन Interface Builder में Ctrl+drag के माध्यम से सेट किए जाते हैं। यदि कनेक्शन कॉन्फ़िगर नहीं किया गया है, तो IBOutlet रनटाइम पर nil (v) होगा, जिससे एक्सेस करने पर क्रैश होगा — इसलिए IBOutlet को अंतर्निहित अनरैप के साथ weak var (k s) के रूप में घोषित किया जाता है।
@IBDesignable एक Swift एनोटेशन है जो वास्तविक समय में सीधे Interface Builder कैनवास पर कस्टम UIView प्रदर्शित करने की अनुमति देता है। डेवलपर एप्लिकेशन चलाए बिना कोड परिवर्तन देखता है। @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 घटक है जिसमें IBInspectable गुण startColor (v), endColor (v) और cornerRadius (v) हैं। IB कैनवास पर UIView खींचते समय और Identity Inspector में क्लास को GradientButton में बदलते समय, कैनवास पर वास्तविक समय में एक ग्रेडिएंट बटन प्रदर्शित होगा। सभी IBInspectable गुण दाईं ओर Attributes Inspector पैनल में दिखाई देंगे।
महत्वपूर्ण: @IBDesignable IB में प्रदर्शन के लिए पूरे कोड को संकलित करता है, इसलिए इसके अंदर नेटवर्क अनुरोध या लंबे संचालन निष्पादित नहीं होने चाहिए। पृथक्करण के लिए, #if TARGET_INTERFACE_BUILDER (k) का उपयोग किया जाता है — सशर्त संकलन जो 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% है।
रनटाइम पर, nib UINib(nibName:bundle:) (k) या स्वचालित रूप से UIStoryboard.instantiateViewController(withIdentifier:) (k) के माध्यम से लोड किया जाता है। लोडिंग प्रक्रिया में शामिल हैं:
awakeFromNib() (fn) — पोस्ट-लोड कॉन्फ़िगरेशन के लिए प्रवेश बिंदुawakeFromNib() (fn) विधि सभी IBOutlet सेट होने के बाद लेकिन पहले layoutSubviews से पहले कॉल की जाती है। यह प्रारंभिक कॉन्फ़िगरेशन के लिए सुविधाजनक है: गोल कोने सेट करना, छाया जोड़ना, टेक्स्ट स्थानीयकरण। हालांकि, awakeFromNib में सभी IBOutlet के nil नहीं होने की गारंटी है।
2019 में SwiftUI की रिलीज़ के साथ, iOS डेवलपर्स को Interface Builder का एक विकल्प मिला — वास्तविक समय के Canvas Preview के साथ एक घोषणात्मक फ्रेमवर्क। आइए दोनों दृष्टिकोणों के बीच मुख्य अंतर देखें।
Interface Builder एक XML विवरण उत्पन्न करता है जो nib में संकलित होता है। इंटरफ़ेस दृश्य रूप से बनाया जाता है; कोड केवल तर्क को संभालता है। IB को प्रोग्रामिंग कौशल के बिना डिज़ाइनरों के लिए कम प्रवेश सीमा की आवश्यकता होती है, लेकिन कोड समीक्षा के लिए कठिन है (XML परिवर्तन diff में दिखाई नहीं देते हैं)।
SwiftUI Preview पूरी तरह से कोड-आधारित विकास है। इंटरफ़ेस Swift में वर्णित है, पूर्वावलोकन प्रत्येक सेव पर अपडेट होता है। कोई XML नहीं, कोई nib नहीं, कोई टूटा हुआ IBOutlet कनेक्शन जोखिम नहीं। SwiftUI Preview IB से तेज़ काम करता है क्योंकि इसे अलग फ़ाइल संकलित करने की आवश्यकता नहीं होती है।
| मानदंड | Interface Builder (UIKit) | SwiftUI Preview |
|---|---|---|
| फ़ाइल प्रारूप | XML (.storyboard / .xib) → बाइनरी nib | Swift कोड (कोई मध्यवर्ती फ़ाइल नहीं) |
| पूर्वावलोकन | जटिल व्यू के लिए देरी के साथ IB कैनवास | वास्तविक समय में Canvas Preview |
| iOS संस्करण समर्थन | iOS 2.0+ (सभी संस्करण) | iOS 13+ |
| Git मर्ज | समस्याग्रस्त (एक XML फ़ाइल) | सरल (सामान्य Swift कोड) |
| गतिशील डेटा | IBOutlet + कोड के माध्यम से | @State (k), @Observable (k) |
| कस्टम व्यू | @IBDesignable (संकलन) | PreviewProvider के साथ SwiftUI View |
| प्रदर्शन | तेज़ nib लोडिंग | ऑन-द-फ़्लाई Swift संकलन |
व्यवहार में, IB और SwiftUI Preview के बीच चुनाव परियोजना की आवश्यकताओं पर निर्भर करता है। Interface Builder पुराने iOS संस्करणों के समर्थन वाले UIKit अनुप्रयोगों के साथ-साथ वाणिज्यिक परियोजनाओं के लिए अपरिहार्य है जहाँ डिज़ाइनर Swift कौशल के बिना Xcode में काम करते हैं। SwiftUI नई परियोजनाओं के लिए पसंद किया जाता है जो iOS 17+ को लक्षित करती हैं, जहाँ विकास गति और प्रतिक्रियाशीलता मायने रखती है।
Apple Xcode से Interface Builder को हटाने की योजना नहीं बनाता है। इसके अलावा, Xcode 16 में, कंपनी ने IB कैनवास के प्रदर्शन में सुधार किया और UIViewRepresentable Bridge के माध्यम से SwiftUI घटकों का समर्थन जोड़ा। उम्मीद है कि IB कम से कम 2030 तक समर्थित रहेगा।
iOS विकास के वर्षों के अनुभव ने सिफारिशों का एक सेट बनाया है जो वाणिज्यिक परियोजनाओं में Interface Builder का उपयोग करते समय समस्याओं की संख्या को कम करता है।
पुन: प्रयोज्य घटकों के लिए Storyboard के बजाय XIB का उपयोग करें। प्रत्येक कस्टम तालिका कोशिका, हेडर या फुटर एक अलग XIB में होना चाहिए। यह मर्ज को आसान बनाता है, लोडिंग को गति देता है, और Swift Package Manager या CocoaPods के माध्यम से परियोजनाओं के बीच घटकों के पुन: उपयोग की अनुमति देता है।
बड़े स्टोरीबोर्ड को मॉड्यूल में विभाजित करने के लिए Storyboard References कॉन्फ़िगर करें। 100 स्क्रीन वाले एक Main.storyboard के बजाय, प्रत्येक मॉड्यूल (Auth, Profile, Feed) के लिए एक स्टोरीबोर्ड बनाएँ और उन्हें Storyboard Reference के माध्यम से जोड़ें। इससे ibtool संकलन समय कम होगा और टीम वर्क सरल होगा।
बिना सत्यापन के File's Owner (k) से IBOutlet कनेक्शन से बचें। प्रत्येक कनेक्शन weak (k) और वैकल्पिक होना चाहिए (अंतर्निहित रूप से अनरैप किया गया वैकल्पिक केवल playgrounds में बढ़िया है)। किसी व्यू में IBOutlet का नाम बदलते समय, Xcode स्वचालित रूप से कनेक्शन अपडेट करता है, लेकिन मैन्युअल XML संपादन आसानी से त्रुटियाँ उत्पन्न कर सकता है।
Show Connection Panel (k) जाँचें — लाल संकेतक टूटे हुए कनेक्शन दर्शाते हैंUser Defined Runtime Attributes (k) का उपयोग करें: layer.cornerRadius, layer.borderWidth, tintColorIdentifier (k) निर्दिष्ट करें — यह विरोधों को डीबग करने में मदद करता है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
/// Loading avatar via SDWebImage or 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) विधि भरने के लिए डेटा मॉडल स्वीकार करती है। जिम्मेदारियों का पृथक्करण परीक्षण और पुन: उपयोग को सरल बनाता है।
अक्सर पूछे जाने वाले प्रश्न
Interface Builder UIKit के लिए Storyboard/XIB प्रारूप के साथ एक विज़ुअल संपादक है, जो drag-and-drop के माध्यम से काम करता है। SwiftUI Preview एक घोषणात्मक वास्तविक समय पूर्वावलोकन है जहाँ इंटरफ़ेस Swift कोड में वर्णित है। दोनों उपकरण Xcode में निर्मित हैं, लेकिन IB XML उत्पन्न करता है जबकि SwiftUI सीधे Swift संकलित करता है। IB iOS 2.0+ का समर्थन करता है, SwiftUI iOS 13+ का समर्थन करता है।
नहीं, Interface Builder सीधे SwiftUI के साथ संगत नहीं है। SwiftUI अपने स्वयं के घोषणात्मक सिंटैक्स और Canvas Preview का उपयोग करता है। हालांकि, IB के माध्यम से बनाई गई UIKit परियोजनाओं को UIViewRepresentable के माध्यम से SwiftUI में एकीकृत किया जा सकता है, और SwiftUI व्यू को UIHostingController के माध्यम से UIKit में एम्बेड किया जा सकता है। यह धीरे-धीरे IB से SwiftUI में माइग्रेट करने की अनुमति देता है।
@IBDesignable एक Swift एनोटेशन है जो एप्लिकेशन चलाए बिना वास्तविक समय में सीधे Interface Builder में कस्टम UIView प्रदर्शित करता है। @IBInspectable गुणों के लिए एक एनोटेशन है, जो उन्हें IB Attributes Inspector पैनल में जोड़ता है। दोनों एनोटेशन कस्टम UI घटक विकास को गति देते हैं: बस इंस्पेक्टर में गुण बदलें और परिवर्तन तुरंत कैनवास पर दिखाई देता है।
Interface Builder में Auto Layout Pin मेनू (मार्जिन, चौड़ाई, ऊँचाई) और Align मेनू (केंद्रित करना, बेसलाइन) के माध्यम से बाधाएँ निर्धारित करता है। प्रत्येक बाधा व्यू के बीच एक गणितीय संबंध है। IB त्रुटियों को लाल रेखाओं और विरोधों को पीली चेतावनियों के साथ प्रदर्शित करता है। IB में Size Classes कोड लिखे बिना विभिन्न उपकरणों और ओरिएंटेशन के लिए अलग-अलग बाधाएँ निर्दिष्ट करने की अनुमति देती हैं।
IBOutlet कोड से UI तत्व के संदर्भ के लिए एक एनोटेशन है (जैसे @IBOutlet weak var label: UILabel!)। IBAction एक घटना पर कॉल की जाने वाली विधि के लिए एक एनोटेशन है (जैसे @IBAction func buttonTapped(_ sender: UIButton))। कनेक्शन IB कैनवास से नियंत्रक फ़ाइल में Ctrl+drag करके बनाया जाता है। माउस छोड़ने पर Xcode स्वचालित रूप से कनेक्शन कोड उत्पन्न करता है।
सारांश
हम एक मोबाइल एप्लिकेशन टर्नकी विकसित करेंगे
IT Sectr 2017 से स्टार्टअप और व्यवसायों के लिए iOS और Android एप्लिकेशन बनाता है। हम आपको सलाह देंगे और सर्वोत्तम समाधान प्रस्तावित करेंगे।
यह भी पढ़ें