स्टेटिक जेनेरिक टेबल्स

हम सभी को अक्सर स्थिर तालिकाओं से निपटना पड़ता है, वे हमारे एप्लिकेशन, प्राधिकरण स्क्रीन, "हमारे बारे में" स्क्रीन, और कई अन्य की सेटिंग्स हो सकती हैं। लेकिन अक्सर नौसिखिए डेवलपर्स ऐसी तालिकाओं के लिए कोई विकास पैटर्न लागू नहीं करते हैं और सभी को एक वर्ग में एक गैर-स्केलेबल, अनम्य प्रणाली में लिखते हैं।

कट के नीचे - मैं इस समस्या को कैसे हल करता हूं।

क्या बात कर रहे हो

इससे पहले कि आप स्थिर तालिकाओं की समस्या को हल करें, आपको समझना चाहिए कि यह क्या है। स्टैटिक टेबल वे टेबल होते हैं जहां आप पहले से ही पंक्तियों की संख्या और उनमें मौजूद सामग्री को जानते हैं। नीचे दिए गए समान तालिकाओं के उदाहरण।

समस्या

शुरू करने के लिए, यह समस्या की पहचान करने के लायक है: हम सिर्फ एक ViewController क्यों नहीं बना सकते हैं जो UITableViewDelegate और UITableViewDatasource होगा और आपको उन सभी कक्षों का वर्णन करना होगा जिनकी आपको आवश्यकता है? कम से कम - हमारी तालिका के साथ 5 समस्याएं हैं:

1. मुश्किल से पैमाना
2. सूचकांक निर्भर
3. लचीला नहीं है
4. पुन: उपयोग में कमी
5. आरंभ करने के लिए बहुत सारे कोड की आवश्यकता होती है

निर्णय

समस्या को हल करने की विधि निम्नलिखित आधार पर आधारित है:

1. एक अलग वर्ग ( कंस्ट्रक्टर ) में तालिका के विन्यास की जिम्मेदारी को हटाना
2. UITableViewDelegate और UITableViewDataSource पर कस्टम आवरण
3. पुन: उपयोग के लिए कस्टम प्रोटोकॉल में कोशिकाओं को जोड़ना
4. प्रत्येक तालिका के लिए अपने स्वयं के डेटा मॉडल बनाना

पहले मैं यह दिखाना चाहता हूं कि व्यवहार में इसका उपयोग कैसे किया जाता है - फिर मैं दिखाऊंगा कि कैसे यह सब हुड के तहत लागू किया जाता है।

कार्यान्वयन

कार्य दो पाठ कोशिकाओं और उनके बीच एक खाली के साथ एक तालिका बनाना है।

सबसे पहले, मैंने एक नियमित TextTableViewCell UILabel के साथ बनाया।
अगला, एक स्थिर तालिका वाले प्रत्येक UIViewController को अपने स्वयं के कंस्ट्रक्टर की आवश्यकता होती है, आइए इसे बनाएं:

class ViewControllerConstructor: StaticConstructorContainer { typealias ModelType = <#type#> } 

जब हमने इसे StaticConstructorContainer से विरासत में प्राप्त किया, तो सबसे पहले, जेनेरिक प्रोटोकॉल को हमें मॉडल ( ModelType ) टाइप करने की आवश्यकता है - यह सेल मॉडल का प्रकार है जिसे हमें भी बनाने की आवश्यकता है, चलो इसे करते हैं।

मैं इसके लिए एनम का उपयोग करता हूं, क्योंकि यह हमारे कार्यों के लिए अधिक उपयुक्त है और यहां से मज़ा शुरू होता है। हम इस तरह के रूप में प्रोटोकॉल का उपयोग कर सामग्री के साथ हमारी मेज को भरने जाएगा: शीर्षक, उपशीर्षक, रंगीन, फ़ॉन्ट और इतने पर। जैसा कि आप अनुमान लगा सकते हैं, ये प्रोटोकॉल पाठ प्रदर्शित करने के लिए जिम्मेदार हैं। कहो शीर्षक प्रोटोकॉल शीर्षक की आवश्यकता है : स्ट्रिंग? , और यदि हमारा सेल शीर्षक प्रदर्शनों का समर्थन करता है, तो यह उसे भर देगा। आइए देखें कि यह कैसा दिखता है:

 protocol Fonted { var font: UIFont? { get } } protocol FontedConfigurable { func configure(by model: Fonted) } protocol Titled { var title: String? { get } } protocol TitledConfigurable { func configure(by model: Titled) } protocol Subtitled { var subtitle: String? { get } } protocol SubtitledConfigurable { func configure(by model: Subtitled) } protocol Imaged { var image: UIImage? { get } } protocol ImagedConfigurable { func configure(by model: Imaged) } 

तदनुसार, इस तरह के प्रोटोकॉल का केवल एक छोटा सा हिस्सा यहां प्रस्तुत किया गया है, आप इसे स्वयं बना सकते हैं, जैसा कि आप देखते हैं - यह बहुत सरल है। मैं आपको याद दिलाता हूं कि हम उन्हें 1 बार 1 उद्देश्य के लिए बनाते हैं और फिर उन्हें भूल जाते हैं और शांति से उनका उपयोग करते हैं।

हमारा सेल ( पाठ के साथ ) अनिवार्य रूप से निम्नलिखित चीजों का समर्थन करता है: पाठ का फ़ॉन्ट, पाठ स्वयं, पाठ का रंग, सेल का पृष्ठभूमि रंग और आम तौर पर मन में आने वाली कोई भी चीज़।

हमें अब तक केवल शीर्षक चाहिए। इसलिए, हम अपने मॉडल को शीर्षक से विरासत में लेते हैं। मामले में मॉडल के अंदर, हम इंगित करते हैं कि हमारे पास किस प्रकार की कोशिकाएं होंगी।

 enum CellModel: Titled { case firstText case emptyMiddle case secondText var title: String? { switch self { case .firstText: return " - " case .secondText: return " - " default: return nil } } } 

चूंकि मध्य (खाली सेल) में कोई लेबल नहीं है, तो आप शून्य वापस कर सकते हैं।
हमने C सेल को समाप्त कर दिया है और आप इसे हमारे कंस्ट्रक्टर में डाल सकते हैं।

 class ViewControllerConstructor: StaticConstructorContainer { typealias ModelType = CellModel var models: [CellModel] //        ,    func cellType(for model: CellModel) -> Self.StaticTableViewCellClass.Type { //      ,    } func configure(cell: UITableViewCell, by model: CellModel) { //      ,   ,      } func itemSelected(item: CellModel) { //  didSelect,     } } 

और वास्तव में, यह हमारा सभी कोड है। हम कह सकते हैं कि हमारी तालिका तैयार है। आइए डेटा भरें और देखें कि क्या होता है।

अरे हाँ, मैं लगभग भूल गया था। हमें अपने सेल को TitledConfigurable प्रोटोकॉल से इनहेरिट करने की आवश्यकता है ताकि यह अपने आप में एक शीर्षक सम्मिलित कर सके। कोशिकाएं गतिशील ऊंचाइयों का भी समर्थन करती हैं।

 extension TextTableViewCell: TitledConfigurable { func configure(by model: Titled) { label.text = model.title } } 

भरा हुआ निर्माण कैसा दिखता है:

 class ViewControllerConstructor: StaticConstructorContainer { typealias ModelType = CellModel var models: [CellModel] = [.firstText, .emptyMiddle, .secondText] func cellType(for model: CellModel) -> StaticTableViewCellClass.Type { switch model { case .emptyMiddle: return EmptyTableViewCell.self case .firstText, .secondText: return TextTableViewCell.self } } func configure(cell: UITableViewCell, by model: CellModel) { cell.selectionStyle = .none } func itemSelected(item: CellModel) { switch item { case .emptyMiddle: print("  ") default: print("  ...") } } } 

बहुत कॉम्पैक्ट लगता है, है ना?

दरअसल, आखिरी चीज जिसे हमने करना छोड़ दिया है, वह सभी को ViewController'e से जोड़ता है:

 class ViewController: UIViewController { private let tableView: UITableView = { let tableView = UITableView() return tableView }() private let constructor = ViewControllerConstructor() private lazy var delegateDataSource = constructor.delegateDataSource() override func viewDidLoad() { super.viewDidLoad() constructor.setup(at: tableView, dataSource: delegateDataSource) } } 

सब कुछ तैयार है, हमें डेलिगेटडॉर्स सोर्स को अपनी कक्षा में एक अलग संपत्ति के रूप में बनाना होगा ताकि कमजोर लिंक किसी भी फ़ंक्शन के अंदर टूट न जाए।

हम चला सकते हैं और परीक्षण कर सकते हैं:



जैसा कि आप देख सकते हैं, सब कुछ काम करता है।

अब संक्षेप में बताएं और समझें कि हमने क्या हासिल किया है:

1. यदि हम एक नया सेल बनाते हैं और इसके साथ वर्तमान को बदलना चाहते हैं, तो हम एक चर को बदलकर ऐसा करते हैं। हमारे पास बहुत लचीली टेबल प्रणाली है
2. हम सभी कोशिकाओं का पुन: उपयोग करते हैं। आप इस तालिका से जितनी अधिक कोशिकाएँ जोड़ते हैं, यह उसके साथ काम करना उतना ही आसान और आसान होता है। बड़ी परियोजनाओं के लिए महान।
3. हमने तालिका बनाने के लिए कोड की मात्रा कम कर दी है। और हमें इसे तब भी कम लिखना होगा जब हमारे पास परियोजना में कई प्रोटोकॉल और स्थिर कोशिकाएं हों।
4. हम UIViewController से कंस्ट्रक्टर में स्थिर तालिकाओं के निर्माण को लाए
5. हमने सूचकांकों पर निर्भर रहना बंद कर दिया है, हम सुरक्षित रूप से सरणी में कोशिकाओं को स्वैप कर सकते हैं और तर्क नहीं टूटेगा।

लेख के अंत में एक परीक्षण परियोजना के लिए कोड।

यह अंदर से बाहर कैसे काम करता है?

प्रोटोकॉल कैसे काम करते हैं, हम पहले ही चर्चा कर चुके हैं। अब हमें यह समझने की जरूरत है कि पूरा कंस्ट्रक्टर और उससे जुड़ी कक्षाएं कैसे काम करती हैं।

आइए निर्माणकर्ता के साथ ही शुरुआत करें:

 protocol StaticConstructorContainer { associatedtype ModelType var models: [ModelType] { get } func cellType(for model: ModelType) -> StaticTableViewCellClass.Type func configure(cell: UITableViewCell, by model: ModelType) func itemSelected(item: ModelType) } 

यह एक सामान्य प्रोटोकॉल है जिसमें ऐसे कार्यों की आवश्यकता होती है जो पहले से ही हमारे परिचित हैं।

अधिक दिलचस्प इसका विस्तार है :

 extension StaticConstructorContainer { typealias StaticTableViewCellClass = StaticCell & NibLoadable func delegateDataSource() -> StaticDataSourceDelegate<Self> { return StaticDataSourceDelegate<Self>.init(container: self) } func setup<T: StaticConstructorContainer>(at tableView: UITableView, dataSource: StaticDataSourceDelegate<T>) { models.forEach { (model) in let type = cellType(for: model) tableView.register(type.nib, forCellReuseIdentifier: type.name) } tableView.delegate = dataSource tableView.dataSource = dataSource dataSource.tableView = tableView } } 

सेटअप फ़ंक्शन जिसे हमने अपने ViewController में बुलाया था, हमारे लिए सभी कोशिकाओं को पंजीकृत करता है और डेटा स्रोत और प्रतिनिधि को सौंपता है ।

और डेलिगेटडाटा सोर्स () हमारे लिए एक रैपर UITableViewDataSource और UITableViewDelegate बनाता है। आइए इसे देखें:

 class StaticDataSourceDelegate<Container: StaticConstructorContainer>: NSObject, UITableViewDelegate, UITableViewDataSource { private let container: Container weak var tableView: UITableView? init(container: Container) { self.container = container } func reload() { tableView?.reloadData() } func tableView(_ tableView: UITableView, estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat { let type = container.cellType(for: container.models[indexPath.row]) return type.estimatedHeight ?? type.height } func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { let type = container.cellType(for: container.models[indexPath.row]) return type.height } func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return container.models.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let model = container.models[indexPath.row] let type = container.cellType(for: model) let cell = tableView.dequeueReusableCell(withIdentifier: type.name, for: indexPath) if let typedCell = cell as? TitledConfigurable, let titled = model as? Titled { typedCell.configure(by: titled) } if let typedCell = cell as? SubtitledConfigurable, let subtitle = model as? Subtitled { typedCell.configure(by: subtitle) } if let typedCell = cell as? ImagedConfigurable, let imaged = model as? Imaged { typedCell.configure(by: imaged) } container.configure(cell: cell, by: model) return cell } func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { let model = container.models[indexPath.row] container.itemSelected(item: model) } } 

मुझे लगता है कि फ़ंक्शंस ऊँचाई के बारे में कोई सवाल नहीं है फ़ोरऑरोअट , नम्बरऑफर्सइन्सेक्शन , डेडइलेक्ट्रोआट , वे बस स्पष्ट कार्यक्षमता को लागू करते हैं। यहां सबसे दिलचस्प तरीका सेलफोररॉव है ।

इसमें, हम सबसे सुंदर तर्क को लागू नहीं करते हैं। हम यहां कोशिकाओं को प्रत्येक नए प्रोटोकॉल को लिखने के लिए मजबूर हैं, लेकिन हम इसे एक बार करते हैं - इसलिए यह इतना डरावना नहीं है। यदि मॉडल हमारे सेल की तरह ही प्रोटोकॉल का अनुपालन करता है, तो हम इसे कॉन्फ़िगर करेंगे। अगर किसी के पास इसे स्वचालित करने के बारे में विचार हैं, तो मुझे टिप्पणियों में सुनने में खुशी होगी।

इससे तर्क समाप्त होता है। मैंने इस प्रणाली में तृतीय-पक्ष उपयोगितावादी वर्गों को नहीं छुआ, आप यहां पूरा कोड पढ़ सकते हैं ।

आपका ध्यान के लिए धन्यवाद!