प्रतिक्रियाशील डेटा प्रदर्शन प्रबंधक। परिचय

यह ReactiveDataDisplayManager (RDDM) लाइब्रेरी पर लेखों की एक श्रृंखला का पहला भाग है। इस लेख में, मैं उन सामान्य समस्याओं का वर्णन करूँगा जिन्हें मुझे "नियमित" तालिकाओं के साथ काम करने के साथ-साथ RDDM का विवरण देना है।

समस्या 1. UITableViewDataSource

शुरुआत के लिए, जिम्मेदारियों, पुन: उपयोग और अन्य शांत शब्दों के आवंटन के बारे में भूल जाओ। आइए तालिकाओं के साथ सामान्य काम देखें:

class ViewController: UIViewController { ... } extension ViewController: UITableViewDelegate { ... } extension ViewController: UITableViewDataSource { ... } 

हम सबसे आम विकल्प का विश्लेषण करेंगे। हमें क्या लागू करने की आवश्यकता है? सही ढंग से, 3 UITableViewDataSource तरीके आमतौर पर लागू किए जाते हैं:

 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int func numberOfSections(in tableView: UITableView) -> Int func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) 

अभी के लिए, हम सहायक विधियों ( numberOfSection इत्यादि) पर ध्यान नहीं देंगे और सबसे दिलचस्प एक पर विचार करेंगे - func tableView(tableView: UITableView, indexPath: IndexPath)

मान लें कि हम उत्पादों के विवरण के साथ कोशिकाओं के साथ एक तालिका भरना चाहते हैं, तो हमारी विधि इस तरह दिखाई देगी:

 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) { let anyCell = tableView.dequeueReusableCell(withIdentifier: ProductCell.self, for: indexPath) guard let cell = anyCell as? ProductCell else { return UITableViewCell() } cell.configure(for: self.products[indexPath.row]) return cell } 

बहुत बढ़िया, यह मुश्किल नहीं है। अब, मान लें कि हमारे पास कई प्रकार की कोशिकाएँ हैं, उदाहरण के लिए, तीन:

• उत्पादों;
• शेयरों की सूची;
• विज्ञापन।

उदाहरण की सादगी के लिए, हम सेल को getCell विधि प्राप्त करते हैं:

 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) { switch indexPath.row { case 0: guard let cell: PromoCell = self.getCell() else { return UITableViewCell() } cell.configure(self.promo) return cell case 1: guard let cell: AdCell = self.getCell() else { return UITableViewCell() } cell.configure(self.ad) return cell default: guard let cell: AdCell = self.getCell() else { return UITableViewCell() } cell.configure(self.products[indexPath.row - 2]) return cell } } 

किसी तरह बहुत कोड। कल्पना करें कि हम सेटिंग्स स्क्रीन बनाना चाहते हैं। वहाँ क्या होगा?

• एक अवतार के साथ एक सेल कैप;
• संक्रमण के साथ कोशिकाओं का एक सेट "गहराई में";
• स्विच के साथ सेल (उदाहरण के लिए, पिन कोड द्वारा इनपुट को सक्षम / अक्षम करें);
• जानकारी के साथ सेल (उदाहरण के लिए, एक सेल, जिस पर एक फोन, ईमेल, जो भी होगा);
• व्यक्तिगत प्रस्ताव।

इसके अलावा, आदेश सेट है। एक बेहतरीन तरीका सामने आएगा ...

और अब एक और स्थिति - एक इनपुट फॉर्म है। इनपुट फॉर्म पर, समान कोशिकाओं का एक गुच्छा, जिनमें से प्रत्येक डेटा मॉडल में एक विशिष्ट क्षेत्र के लिए जिम्मेदार है। उदाहरण के लिए, फोन में प्रवेश करने के लिए सेल फोन और इतने पर जिम्मेदार है।
सब कुछ सरल है, लेकिन एक "BUT" है। इस मामले में, आपको अभी भी विभिन्न मामलों को पेंट करना होगा, क्योंकि आपको आवश्यक फ़ील्ड अपडेट करने की आवश्यकता है।

आप बैकेंड ड्रिवेन डिज़ाइन की कल्पना और कल्पना करना जारी रख सकते हैं, जिसमें हम 6 अलग-अलग प्रकार के इनपुट फ़ील्ड प्राप्त करते हैं, और फ़ील्ड की स्थिति (दृश्यता, इनपुट प्रकार, सत्यापन, डिफ़ॉल्ट मान, और इसी तरह) के आधार पर कोशिकाएँ इतनी बदल जाती हैं कि उनके एकल इंटरफ़ेस के लिए नेतृत्व नहीं कर सकते। इस मामले में, यह विधि बहुत अप्रिय दिखाई देगी। भले ही आप अलग-अलग तरीकों से कॉन्फ़िगरेशन को विघटित करते हैं।

वैसे, उसके बाद, कल्पना करें कि यदि आप काम करते हैं तो आप अपने कोड को क्या जोड़ना / हटाना चाहेंगे। यह बहुत अच्छा नहीं लगेगा क्योंकि हम ViewController और कोशिकाओं की संख्या में संग्रहीत डेटा की स्थिरता की स्वतंत्र रूप से निगरानी करने के लिए मजबूर होंगे।

समस्याएं:

• यदि विभिन्न प्रकार की कोशिकाएं हैं, तो कोड नूडल जैसा हो जाता है;
• कोशिकाओं से घटनाओं को संभालने के साथ कई समस्याएं हैं;
• मामले में बदसूरत कोड आपको तालिका की स्थिति को बदलने की आवश्यकता है।

समस्या 2. माइंडसेट

शांत शब्दों का समय अभी नहीं आया है।
आइए देखें कि एप्लिकेशन कैसे काम करता है, या बल्कि, स्क्रीन पर डेटा कैसे दिखाई देता है। हम हमेशा इस प्रक्रिया को क्रमिक रूप से प्रस्तुत करते हैं। ठीक है, कम या ज्यादा:

1. नेटवर्क से डेटा प्राप्त करें;
2. प्रक्रिया करने के लिए;
3. इस डेटा को स्क्रीन पर प्रदर्शित करें।

लेकिन क्या वास्तव में ऐसा है? नहीं! वास्तव में, हम यह करते हैं:

1. नेटवर्क से डेटा प्राप्त करें;
2. प्रक्रिया करने के लिए;
3. ViewController मॉडल के अंदर सहेजें;
4. कुछ स्क्रीन रिफ्रेश होने का कारण बनता है;
5. सहेजे गए मॉडल को कोशिकाओं में बदल दिया जाता है;
6. स्क्रीन पर डेटा प्रदर्शित होता है।

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

और UITableViewDelegate बारे में याद रखें, इसमें कोशिकाओं की ऊंचाई निर्धारित करने के तरीके भी शामिल हैं। आमतौर पर automaticDimension पर्याप्त है, लेकिन कभी-कभी यह पर्याप्त नहीं होता है और आपको खुद को ऊंचाई निर्धारित करने की आवश्यकता होती है (उदाहरण के लिए, एनिमेशन के मामले में या हेडर के लिए)
फिर हम आम तौर पर सेल सेटिंग्स साझा करते हैं, ऊंचाई कॉन्फ़िगरेशन वाला हिस्सा एक अन्य विधि में है।

समस्याएं:

• यूआई पर डेटा प्रसंस्करण और इसके प्रदर्शन के बीच स्पष्ट संबंध खो गया है;
• सेल कॉन्फ़िगरेशन विभिन्न भागों में टूट जाता है।

विचार

जटिल स्क्रीन पर सूचीबद्ध समस्याएं सिरदर्द और चाय के लिए जाने की तीव्र इच्छा का कारण बनती हैं।

सबसे पहले, मैं लगातार प्रतिनिधि विधियों को लागू नहीं करना चाहता। स्पष्ट समाधान एक वस्तु बनाना है जो इसे लागू करेगा। आगे हम कुछ ऐसा करेंगे:

 let displayManager = DisplayManager(self.tableView) 

बहुत बढ़िया। अब आपको किसी भी सेल के साथ काम करने में सक्षम होने के लिए ऑब्जेक्ट की आवश्यकता है, जबकि इन सेल के कॉन्फ़िगरेशन को कहीं और स्थानांतरित करने की आवश्यकता है।

यदि हम कॉन्फ़िगरेशन को एक अलग ऑब्जेक्ट में रखते हैं, तो हम एक ही स्थान पर इनकैप्सुलेट (स्मार्ट शब्दों के लिए समय) का कॉन्फ़िगरेशन करते हैं। इसी जगह में, हम डेटा को प्रारूपित करने के लिए तर्क को निकाल सकते हैं (उदाहरण के लिए, दिनांक प्रारूप को बदलना, स्ट्रिंग संघनन, आदि)। उसी ऑब्जेक्ट के माध्यम से, हम सेल में घटनाओं की सदस्यता ले सकते हैं।

इस मामले में, हमारे पास एक ऐसी वस्तु होगी जिसमें दो अलग-अलग इंटरफेस होंगे:

1. UITableView उदाहरण जनरेशन इंटरफ़ेस हमारे DisplayManager के लिए है।
2. प्रस्तुतिकरण, सदस्यता और कॉन्फ़िगरेशन इंटरफ़ेस - प्रस्तुतकर्ता या ViewController के लिए।

इस वस्तु को हम जनरेटर कहते हैं। तब मेज के लिए हमारा जनरेटर एक सेल है, और बाकी सब के लिए - एक यूआई और प्रक्रिया की घटनाओं पर डेटा पेश करने का एक तरीका।

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

कार्यान्वयन

 public protocol TableCellGenerator: class { var identifier: UITableViewCell.Type { get } var cellHeight: CGFloat { get } var estimatedCellHeight: CGFloat? { get } func generate(tableView: UITableView, for indexPath: IndexPath) -> UITableViewCell func registerCell(in tableView: UITableView) } public protocol ViewBuilder { associatedtype ViewType: UIView func build(view: ViewType) } 

ऐसे कार्यान्वयन के साथ, हम डिफ़ॉल्ट कार्यान्वयन कर सकते हैं:

 public extension TableCellGenerator where Self: ViewBuilder { func generate(tableView: UITableView, for indexPath: IndexPath) -> UITableViewCell { guard let cell = tableView.dequeueReusableCell(withIdentifier: self.identifier.nameOfClass, for: indexPath) as? Self.ViewType else { return UITableViewCell() } self.build(view: cell) return cell as? UITableViewCell ?? UITableViewCell() } func registerCell(in tableView: UITableView) { tableView.registerNib(self.identifier) } }<source lang="swift"> 

मैं एक छोटे जनरेटर का एक उदाहरण दूंगा:

 final class FamilyCellGenerator { private var cell: FamilyCell? private var family: Family? var didTapPerson: ((Person) -> Void)? func show(family: Family) { self.family = family cell?.fill(with: family) } func showLoading() { self.family = nil cell?.showLoading() } } extension FamilyCellGenerator: TableCellGenerator { var identifier: UITableViewCell.Type { return FamilyCell.self } } extension FamilyCellGenerator: ViewBuilder { func build(view: FamilyCell) { self.cell = view view.selectionStyle = .none view.didTapPerson = { [weak self] person in self?.didTapPerson?(person) } if let family = self.family { view.fill(with: family) } else { view.showLoading() } } } 

यहाँ हम विन्यास और सदस्यता दोनों को छिपाते हैं। ध्यान दें कि अब हमारे पास एक ऐसी जगह है जहां हम राज्य को एनकैप्सुलेट कर सकते हैं (क्योंकि सेल में राज्य को इनकैप्सुलेट करना असंभव है क्योंकि यह टेबल द्वारा पुन: उपयोग किया जाता है)। और उन्हें सेल में डेटा बदलने का अवसर भी मिला "मक्खी पर।"

self.cell = view ध्यान self.cell = view । self.cell = view । हमने सेल को याद किया और अब हम इस सेल को फिर से लोड किए बिना डेटा को अपडेट कर सकते हैं। यह एक उपयोगी विशेषता है।

लेकिन मैं विचलित था। चूँकि हमारे पास जनरेटर द्वारा प्रस्तुत कोई भी सेल हो सकता है, हम अपने DisplayManager के इंटरफ़ेस को थोड़ा और सुंदर बना सकते हैं।

 public protocol DataDisplayManager: class { associatedtype CollectionType associatedtype CellGeneratorType associatedtype HeaderGeneratorType init(collection: CollectionType) func forceRefill() func addSectionHeaderGenerator(_ generator: HeaderGeneratorType) func addCellGenerator(_ generator: CellGeneratorType) func addCellGenerators(_ generators: [CellGeneratorType], after: CellGeneratorType) func addCellGenerator(_ generator: CellGeneratorType, after: CellGeneratorType) func addCellGenerators(_ generators: [CellGeneratorType]) func update(generators: [CellGeneratorType]) func clearHeaderGenerators() func clearCellGenerators() } 

यह वास्तव में सभी नहीं है। हम जनरेटर को सही स्थानों पर सम्मिलित कर सकते हैं या उन्हें हटा सकते हैं।

वैसे, एक विशिष्ट सेल के बाद सेल सम्मिलित करना बहुत उपयोगी हो सकता है। विशेष रूप से यदि हम धीरे-धीरे डेटा लोड करते हैं (उदाहरण के लिए, उपयोगकर्ता ने टिन में प्रवेश किया, हमने टिन की जानकारी अपलोड की और टीआईएन क्षेत्र के बाद कई नई कोशिकाओं को जोड़कर प्रदर्शित किया)।

परिणाम

सेल का काम अब कैसे दिखेगा:

 class ViewController: UIViewController { func update(data: [Products]) { let gens = data.map { ProductCellGenerator($0) } self.ddm.addGenerators(gens) } } 

या यहाँ:

 class ViewController: UIViewController { func update(fields: [Field]) { let gens = fields.map { field switch field.type { case .phone: let gen = PhoneCellGenerator(item) gen.didUpdate = { self.updatePhone($0) } return gen case .date: let gen = DateInputCellGenerator(item) gen.didTap = { self.showPicker() } return gen case .dropdown: let gen = DropdownCellGenerator(item) gen.didTap = { self.showDropdown(item) } return gen } } let splitter = SplitterGenerator() self.ddm.addGenerator(splitter) self.ddm.addGenerators(gens) self.ddm.addGenerator(splitter) } } 

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

RDDM का उपयोग करने के नियम:

• सेल कॉन्फ़िगरेशन का एनकैप्सुलेशन;
• एडॉप्टर के लिए संग्रह से काम encapsulating द्वारा कोड दोहराव को कम करना;
• एक एडाप्टर ऑब्जेक्ट का चयन करें जो संग्रह के साथ काम करने के विशिष्ट तर्क को एन्क्रिप्ट करता है;
• कोड अधिक स्पष्ट और पढ़ने में आसान हो जाता है;
• तालिका जोड़ने के लिए जिस कोड की आवश्यकता होती है वह कम हो जाती है;
• कोशिकाओं से घटनाओं के प्रसंस्करण की प्रक्रिया सरल है।

यहां के सूत्र

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