डार्ट स्ट्रीम बेसिक्स

यह स्पंदन वास्तुकला पर मेरी श्रृंखला का दूसरा भाग है:

• परिचय
• डार्ट स्ट्रीम बेसिक्स (यह पोस्ट)
• RxDart: प्रवाह के जादुई रूपांतरण
• RxVMS मूल बातें: RxCommand और GetIt
• RxVMS: सेवाएं और प्रबंधक
• RxVMS: स्व-निहित विजेट
• RxVMS के साथ उपयोगकर्ता प्रमाणीकरण

धाराएँ RxVMS के मुख्य भवन खंड हैं, उनकी समझ इस पुस्तकालय के साथ काम करने के लिए नितांत आवश्यक है, इसलिए हम इस पोस्ट में उनके बारे में अधिक विस्तार से जानकारी देंगे।

यह पता चला कि इस पोस्ट में आरएक्स सहित यह बहुत लंबा हो जाएगा, इसलिए मैंने इसे दो भागों में विभाजित किया।

इसे बहने दो

मैंने बहुत सारी टिप्पणियाँ पढ़ीं जो वे कहते हैं कि प्रवाह, और विशेष रूप से आरएक्स, समझने के लिए बहुत जटिल हैं और, परिणामस्वरूप, उपयोग करने के लिए।

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

धागे क्या हैं?

मेरी राय में, थ्रेड्स का सबसे अच्छा सादृश्य कन्वेयर बेल्ट है। आप इसके एक छोर पर कुछ रख सकते हैं और यह "कुछ" स्वचालित रूप से दूसरे में स्थानांतरित हो जाएगा। भौतिक पाइपलाइन के विपरीत, थ्रेड्स डेटा ऑब्जेक्ट्स में हेरफेर करते हैं, उन्हें स्वचालित रूप से शुरुआत से स्थानांतरित करते हैं - लेकिन कहां? जैसा कि वास्तविक पाइपलाइन में, यदि दूसरे छोर पर डेटा को पकड़ने के लिए कुछ भी नहीं है, तो वे बस "गिर" जाएंगे और गायब हो जाएंगे (यह, निश्चित रूप से, डार्ट धाराओं के लिए बिल्कुल सही नहीं है, लेकिन धाराओं को संभालना सबसे अच्छा है जैसे कि मामला है ।

डेटा हानि से बचने के लिए, आप स्ट्रीम आउटपुट पर "ट्रैप" सेट कर सकते हैं। इस तरह आप डेटा पर कब्जा कर सकते हैं और इसके साथ आवश्यक जोड़तोड़ कर सकते हैं जब भी डेटा ऑब्जेक्ट स्ट्रीम के अंत तक पहुंचते हैं।

याद रखें:

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

Rx क्या है?

Rx, रिएक्टिव एक्सटेंशन्स के लिए छोटा, स्टेरॉयड स्ट्रीम हैं। यह स्ट्रीम के समान एक अवधारणा है जिसे Microsoft टीम द्वारा .Net ढांचे के लिए आविष्कार किया गया था। चूंकि .Net में पहले से ही स्ट्रीम प्रकार था, जिसका उपयोग फ़ाइल I / O के लिए किया जाता है, उन्होंने Rx स्ट्रीम ऑब्जर्वबल्स को कॉल किया और उनके माध्यम से गुजरने वाले डेटा में हेरफेर करने के लिए कई फ़ंक्शन बनाए। डार्ट में अपनी भाषा विनिर्देश में निर्मित धाराएँ हैं जो पहले से ही अधिकांश कार्यक्षमता प्रदान करती हैं, लेकिन सभी नहीं। यही कारण है कि आरएक्सडार्ट पैकेज विकसित किया गया था; यह डार्ट स्ट्रीम पर आधारित है, लेकिन उनकी कार्यक्षमता बढ़ाता है। मैं इस श्रृंखला के अगले भाग में Rx और RxDart को शामिल करूंगा।

कुछ शर्तें

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

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

स्ट्रीम निर्माण

यदि आप विषय का अध्ययन जारी रखना चाहते हैं, तो कृपया इस परियोजना को उदाहरणों के साथ क्लोन करें । मैं डार्ट / स्पंदन परीक्षण प्रणाली का उपयोग करूंगा।

एक स्ट्रीम बनाने के लिए, आप एक स्ट्रीमकंट्रोलर बनाएँ

var controller = new StreamController<String>(); controller.add("Item1"); //      

स्ट्रीमकंट्रोलर बनाते समय टेम्प्लेट टाइप (इस मामले में स्ट्रिंग) पास हो जाता है जो उस प्रकार के ऑब्जेक्ट को निर्धारित करता है जिसे हम स्ट्रीम में भेज सकते हैं। यह किसी भी प्रकार हो सकता है! यदि आप चाहें तो एक StreamController<List<MyObject>>() बना सकते हैं और स्ट्रीम एकल ऑब्जेक्ट के बजाय पूरी शीट को स्थानांतरित कर देगा।

ट्रैप सेटिंग

यदि आप निर्दिष्ट परीक्षण चलाते हैं, तो आप कुछ भी नहीं देख सकते हैं, क्योंकि स्ट्रीम के आउटपुट पर हमारी लाइन ने कुछ भी नहीं पकड़ा है। अब जाल सेट करें:

 var controller = new StreamController<String>(); controller.stream.listen((item) => print(item)); //  controller.add("Item1"); controller.add("Item2"); controller.add("Item3"); 

अब जाल को .listen() विधि का उपयोग करके सेट किया गया है। रिकॉर्ड controller.stream.listen की तरह दिखता है, लेकिन अगर आप इसे पीछे की तरफ स्क्रॉल करते हैं, जैसे 60 के दशक के किसी प्रकार के एल्बम, तो जो लिखा गया है उसका सही अर्थ दिखाई देगा: "इस नियंत्रक की धारा को सुनें"

किसी भी तरह से आने वाले डेटा में हेरफेर करने के लिए .listen() विधि के लिए एक निश्चित फ़ंक्शन पास करना होगा। स्ट्रीमकंट्रोलर को बनाते समय फ़ंक्शन को निर्दिष्ट प्रकार के पैरामीटर को स्वीकार करना चाहिए, इस मामले में, स्ट्रिंग।

यदि आप उपरोक्त कोड चलाते हैं, तो आप देखेंगे

 Item1 Item2 Item3 

मेरी राय में, धाराओं के लिए नए लोगों के लिए सबसे बड़ी समस्या यह है कि आप पहले तत्व को धारा में डालने से पहले उत्सर्जित तत्व के लिए प्रतिक्रिया का निर्धारण कर सकते हैं, इस प्रतिक्रिया के लिए एक कॉल ट्रिगर करता है।

सुनते हुए अंत

ऊपर दिया गया कोड छोटा लेकिन महत्वपूर्ण हिस्सा छूट गया। listen() एक StreamSubscription लौटाता है - एक स्ट्रीम सदस्यता ऑब्जेक्ट। उसकी .cancel() पद्धति की कॉल सदस्यता को समाप्त कर देती है, संसाधनों को मुक्त कर देती है, और आपके सुनने के कार्य को अनावश्यक होने के बाद कहने से .cancel() ।

 var controller = new StreamController<String>(); StreamSubscription subscription = controller.stream.listen((item) => print(item)); // This is the Trap controller.add("Item1"); controller.add("Item2"); controller.add("Item3"); //    ,        //  ,     Stream   await Future.delayed(Duration(milliseconds: 500)); subscription.cancel; 

श्रोता का विवरण

listen() लिए फ़ंक्शन listen() या तो एक लैम्ब्डा या एक साधारण फ़ंक्शन हो सकता है।

 void myPrint(String message) { print(message); } StreamSubscription subscription = controller.stream.listen((item) => print(item)); //  - StreamSubscription subscription2 = controller.stream.listen(myPrint); //    StreamSubscription subscription3 = controller.stream.listen((item) { print(item); print(item.toUpperCase); }); // - 

महत्वपूर्ण नोट: अधिकांश डार्ट धाराएँ केवल एक बार की सदस्यता की अनुमति देती हैं, अर्थात, सदस्यता पूरी होने के बाद उन्हें फिर से सदस्यता नहीं दी जा सकती - यह एक अपवाद फेंक देगा। यह अन्य आरएक्स कार्यान्वयन से उनका अंतर है।

listen() का पूरा हस्ताक्षर listen() इस तरह दिखता है:

  /* excerpt from the API doc * The [onError] callback must be of type `void onError(error)` or * `void onError(error, StackTrace stackTrace)`. If [onError] accepts * two arguments it is called with the error object and the stack trace * (which could be `null` if the stream itself received an error without * stack trace). * Otherwise it is called with just the error object. * If [onError] is omitted, any errors on the stream are considered unhandled, * and will be passed to the current [Zone]'s error handler. * By default unhandled async errors are treated * as if they were uncaught top-level errors. * * If this stream closes and sends a done event, the [onDone] handler is * called. If [onDone] is `null`, nothing happens. * * If [cancelOnError] is true, the subscription is automatically canceled * when the first error event is delivered. The default is `false`. */ StreamSubscription<T> listen(void onData(T event), {Function onError, void onDone(), bool cancelOnError}); 

इसका मतलब है कि आप भेजे गए डेटा के लिए केवल एक हैंडलर से अधिक कर सकते हैं। आपके पास त्रुटियों के लिए एक हैंडलर भी हो सकता है, और नियंत्रक पक्ष ( onDone ) पर स्ट्रीम को बंद करने के लिए एक और। स्ट्रीम के भीतर से आने वाले onError() जाएगा यदि आप इसे प्रदान करते हैं, अन्यथा वे बस निगल जाते हैं और आपको कभी भी पता नहीं चलेगा कि कुछ गलत हुआ।

स्पंदन धागा उदाहरण

निम्नलिखित अध्यायों को समझने की सुविधा के लिए, मैंने एक अलग भंडार शाखा बनाई।
कृपया उसे क्लोन करें

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

 class Model { int _counter = 0; StreamController _streamController = new StreamController<int>(); Stream<int> get counterUpdates => _streamController.stream; void incrementCounter() { _counter++; _streamController.add(_counter); } } 

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

UI के लिए मॉडल उपलब्ध करने के लिए, मैंने इसे ऐप ऑब्जेक्ट में एक स्थिर क्षेत्र बना दिया क्योंकि मैं InheritedWidget या ServiceLocator दर्ज नहीं करना चाहता था। एक साधारण उदाहरण के लिए, यह इसके साथ दूर हो जाएगा, लेकिन मैं इसे इस एप्लिकेशन में नहीं करूंगा!

main.dart जोड़ें:

 class _MyHomePageState extends State<MyHomePage> { int _counter = 0; StreamSubscription streamSubscription; @override void initState() { streamSubscription = MyApp.model.counterUpdates.listen((newVal) => setState(() { _counter = newVal; })); super.initState(); } //   State   ,   , //       @override void dispose() { streamSubscription?.cancel(); super.dispose(); } 

initState() श्रोता को सेट करने के लिए initState() अच्छी जगह है, और डार्ट्स के अच्छे नागरिकों के रूप में, हम हमेशा सदस्यता को initState() जारी करते हैं, है ना?

विजेट ट्री में, हमें बस FAB बटन के ऑनप्रेन्ड हैंडलर (फ्लोटिंग एक्शन वाला बटन) को अनुकूलित करने की आवश्यकता है।

 floatingActionButton: new FloatingActionButton( onPressed: MyApp.model.incrementCounter, tooltip: 'Increment', child: new Icon(Icons.add), ), 

इस तरह, हमने स्ट्रीम का उपयोग करके व्यू और मॉडल के बीच एक साफ अलगाव बनाया।

StreamBuilder लागू करें

स्रोत

हमारी आवश्यकताओं के लिए initState() और setState() का उपयोग करने के बजाय, initState() एक सुविधाजनक StreamBuilder विजेट के साथ आता है। जैसा कि आप अनुमान लगा सकते हैं, यह एक स्ट्रीम फ़ंक्शन और एक कंस्ट्रक्टर विधि लेता है जिसे कहा जाता है जब भी स्ट्रीम एक नया मूल्य देता है। और अब हमें स्पष्ट आरंभ और रिलीज़ की आवश्यकता नहीं है:

 body: new Center( child: new Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ new Text( 'You have pushed the button this many times:', ), StreamBuilder<int>( initialData: 0, stream: MyApp.model.counterUpdates, builder: (context, snappShot) { String valueAsString = 'NoData'; if (snappShot != null && snappShot.hasData) { valueAsString = snappShot.data.toString(); } return Text( valueAsString, style: Theme.of(context).textTheme.display1, ); }), ], ), ), 

हम लगभग पूरा कर चुके हैं, मैं वादा करता हूं। यहां तीन बातें बताई जानी चाहिए:

• पहले समाधान पर StreamBuilder का उपयोग करने का महान लाभ यह है कि कॉलिंग setState() इन listen() हमेशा पूरे पृष्ठ को फिर से व्यवस्थित करता है, जबकि StreamBuilder केवल अपने builder बुलाएगा
• snapShot चर में सबसे हालिया डेटा स्ट्रीम से प्राप्त होता है। हमेशा सत्यापित करें कि इसमें उपयोग करने से पहले वैध डेटा है।

• के दौरान प्रारंभ के सिद्धांतों के आधार पर, स्ट्रीमब्यूलर को पहले फ्रेम के दौरान एक मूल्य नहीं मिल सकता है। इसके चारों ओर जाने के लिए, हम initialData लिए मान पास करते हैं, जिसका उपयोग पहली असेंबली के लिए किया जाता है, यानी स्क्रीन के पहले फ्रेम के लिए। यदि हम initialData पास नहीं करते हैं, तो हमारे बिल्डर को पहली बार अमान्य डेटा के साथ बुलाया जाएगा। initialData का उपयोग करने का एक विकल्प एक प्लेसहोल्डर विजेट को वापस करना है यदि snapShot अमान्य है, जो तब तक प्रदर्शित किया जाता है जब तक कि हमें वैध डेटा नहीं मिलता है, उदाहरण के लिए:

  
  

   // ,           StreamBuilder<int>( stream: MyApp.model.databaseUpdates, builder: (context, snappShot) { if (snappShot != null && snappShot.hasData) { return Text( snappShot.data.toString(), style: Theme.of(context).textTheme.display1, ); } //      ,   Spinner return CircularProgressIndicator (); }) 

  
  

अगली पोस्ट में हम देखेंगे कि डेटा को हमारी स्ट्रीम में कैसे कन्वर्ट किया जाए और इसे फ्लाई पर किया जाए। सबूत और महत्वपूर्ण प्रतिक्रिया पढ़ने के लिए स्कॉट स्टोल को बहुत धन्यवाद।