पणजी, भारत १२ जुलै, २०२६ ALN: या लेखात खालील तंत्रज्ञानांचा समावेश आहे: C#, PRISM 4, Silverlight 4

प्रत्यक्ष उदाहरण पाहण्यासाठी येथे क्लिक करा

परिचय

जे प्रोग्रामर MVVM वापरत नाहीत त्यांच्यासाठी वापरकर्त्यास संवाद प्रदर्शित करण्याचे सोपे आणि प्रभावी मार्ग आहेत (संदेश बॉक्स संवाद, पुष्टीकरण संवाद, कस्टम संवाद). परंतु MVVM सह संवाद प्रदर्शित करण्याचा सर्वोत्तम मार्ग कोणता आहे? दुसऱ्या शब्दांत: आपण UI कडे दुर्लक्ष न करता दृश्य-मॉडेलमधून संवाद कसा ट्रिगर करू शकता?

हे कसे करायचे नाही:

MessageBox.Show("हे संदेश आहे", "हे शीर्षक आहे",MessageBoxButton.OK);

वरील कोडचा समस्या म्हणजे नियमित MessageBox c# प्रकार UI दृश्य ठरवतो आणि दृश्याद्वारे बदलला जाऊ शकत नाही. हे नेहमी एक ब्लॉकिंग पॉपअप दर्शवेल. विकासक संवादाचे दृश्य कस्टमाइझ करू शकत नाही, असिंक्रोनस बनवू शकत नाही किंवा युनिट चाचणीच्या परिस्थितींसाठी ते अनुकरण करू शकत नाही. योग्य कोडिंगसाठी तुम्हाला संवादाचे दृश्य व्यवसाय तत्त्वज्ञानापासून वेगळे करणे आवश्यक आहे.

सोप्या भाषेत, मी लेखात दर्शविलेल्या कोड नमुन्यात 'PropertyChanged' इव्हेंटला ट्रिगर केले नाही. संपूर्ण कोड मिळवण्यासाठी कृपया डेमो पहा.

डेमो

या लेखात वापरलेला डेमो तुम्ही खालील लिंकवरून डाउनलोड करू शकता.

लेखाची रचना

हा लेख खालील मुद्द्यांवर आधारित आहे:

• अध्याय 1 – वापरकर्त्यास संदेश बॉक्स प्रदर्शित करणे.
• अध्याय 2 - वापरकर्त्यास पुष्टीकरण संवाद प्रदर्शित करणे.
• अध्याय 3 (भाग 2) - डिफॉल्ट संदेश बॉक्स / पुष्टीकरण संवादाची दृश्यता बदलणे.
• अध्याय 4 (भाग 2) - कस्टम संवाद प्रदर्शित करणे (चाइल्ड विंडोचा वापर करून).

लेखाचे उद्दिष्ट

• PRISM फ्रेमवर्कचा वापर करून संवाद प्रदर्शित करणे आणि वापरकर्त्याशी संवाद साधणे.
• MVVM पद्धतीचा वापर करून दृश्य आणि तत्त्वज्ञान वेगळे करणे.
• ‘Messagebox’ किंवा ‘Confirmation’ सारख्या JavaScript ऑब्जेक्टचा वापर टाळा.
• 3rd पार्टी साधनांचा वापर टाळा (PRISM वगळता, जे मोफत आहे).

आवश्यकता

कुठलाही संवाद प्रदर्शित करण्यापूर्वी तुम्हाला खालील गोष्टी करणे आवश्यक आहे.

p.1 जर तुम्ही हे आधी केले नसेल, तर PRISM 4 डाउनलोड करा.

p.2 तुम्ही संवाद लागू करणार असलेल्या Silverlight प्रकल्पात खालील संदर्भ जोडा.

• System.Windows.Interactivity.dll (नेट फ्रेमवर्कचा भाग)
• Microsoft.Expression.Interactions.dll (नेट फ्रेमवर्कचा भाग)
• Microsoft.Practices.Prism (Prism 4 चा भाग)
• Microsoft.Practices.Prism.Interactivity (Prism 4 चा भाग)

अध्याय 1 – संदेश बॉक्स संवाद प्रदर्शित करणे

खालील विभाग वापरकर्त्यास साधा संदेश बॉक्स संवाद कसा प्रदर्शित करायचा हे दर्शवेल.

दृश्य-मॉडेलमध्ये बदल करणे

संवाद प्रदर्शित करण्यासाठी तुम्ही ‘InteractionRequest<Notification>’ प्रकार वापराल. हा प्रकार दृश्य-मॉडेल आणि दृश्यादरम्यान प्रॉक्सी म्हणून वापरला जाईल आणि संवादाबद्दल माहिती समाविष्ट करेल जसे की शीर्षक आणि संदेश.

कोडिंग नियम

s1.1 कोडिंग नियमांचे पालन करण्यासाठी तुमच्या वर्गाचे नाव खालील पद्धतीचा वापर करून ठरवा ‘{View model name}ViewModel’, उदाहरणार्थ – ‘UsersViewModel’.

संवादाचे प्रतिनिधित्व करणारी संपत्ती उघडणे

s1.2 ‘InteractionRequest<Notification>’ प्रकाराची संपत्ती उघडा. नंतर तुम्ही UI पॉपअप संवादाला या संपत्तीवर बाइंड कराल. खालील कोड नमुना वापरा:

public InteractionRequest<Notification> ShowMessagebox { get; set; }

जिथे:

• लेखाच्या सुरुवातीला नमूद केल्याप्रमाणे – गोष्टी साध्या ठेवण्यासाठी, मी कोड नमुन्यात ‘PropertyChanged’ इव्हेंटला ट्रिगर केले नाही.

s1.3 दृश्य-मॉडेल कन्स्ट्रक्टरमध्ये, संपत्तीला एक ठोस उदाहरणासह प्रारंभ करा. खालील कोड नमुना वापरा:

ShowMessagebox = new InteractionRequest<Notification>;

जेव्हा आवश्यक असेल तेव्हा संवाद प्रदर्शित करणे

s1.4 शेवटी, वापरकर्त्यास संवाद प्रदर्शित करण्यासाठी खालील कोड नमुना वापरा:

ShowMessagebox.Raise(new Notification { Content = "हा संदेश बॉक्स दृश्य-मॉडेलमधून ट्रिगर झाला", Title = "सुंदर शीर्षक" }, arg =>
{
 // वैकल्पिक - वापरकर्त्याने संदेश बॉक्स स्वीकारल्यानंतर काहीतरी करा
});

जिथे:

• पहिला तर्क (‘Notification’) वापरकर्त्यास प्रदर्शित केले जाणारे माहिती समाविष्ट करतो.
  • या उदाहरणात मी ‘सामग्री’ म्हणून एक स्ट्रिंग वापरली आहे. परंतु सामग्री प्रत्यक्षात काहीही असू शकते जे डेटा टेम्पलेट वापरून प्रदर्शित केले जाऊ शकते.
• दुसरा तर्क (‘Callback’) वैकल्पिक आहे. वापरकर्ता संवाद बंद केल्यानंतर वापरकर्ता संवादानंतर कार्यान्वित करण्यासाठी या कॉलबॅकचा वापर करा.
• तुम्ही पहिल्या तर्कासह पास केलेला ‘Notification’ उदाहरण UI पॉपअपचा डेटा संदर्भ म्हणून वापरला जाईल.

तुम्ही दृश्य-मॉडेलमध्ये बदल करणे संपवले आहे, परंतु तुम्हाला कोड चाचणी करण्यासाठी दृश्यामध्ये बदल करणे आवश्यक आहे.

दृश्यामध्ये बदल करणे

या भागात तुम्ही दृश्य-मॉडेलमध्ये जोडलेल्या संपत्तीला बाइंड करून संवादाचे दृश्य भाग जोडणार आहात.

कोडिंग नियम

s1.5 कोडिंग नियमांचे पालन करण्यासाठी तुमच्या वर्गाचे नाव खालील पद्धतीचा वापर करून ठरवा ‘{View name}View’, उदाहरणार्थ – ‘UsersView’.

आवश्यक नामस्थान जोडा

s1.6 XAML मध्ये खालील नामस्थान जोडा:

xmlns:ei="" 
xmlns:prism=""

InteractionRequestTrigger वर्तन जोडा

s1.7 ‘InteractionRequestTrigger’ दृश्य-मॉडेल उघडलेल्या संपत्ती आणि दृश्यातील दृश्य घटक यांच्यात बाइंड करण्यासाठी वापरला जातो.

खालील कोड नमुना वापरा, तो ग्रिड घटक ‘LayoutRoot’ च्या पहिल्या चाइल्ड म्हणून जोडा:

<ei:Interaction.Triggers>
 <prism:InteractionRequestTrigger SourceObject="{Binding ShowMessagebox}">
 <prism:PopupChildWindowAction/>
 </prism:InteractionRequestTrigger>
</ei:Interaction.Triggers>

जिथे:

• लाइन 2 – ‘SourceObject’ संपत्ती त्या संपत्तीला बाइंड केले जाते जी तुम्ही दृश्य-मॉडेलमध्ये उघडली आहे. या प्रकरणात ‘ShowMessagebox’ संपत्ती.
• लाइन 3-5 – प्रिझम फ्रेमवर्कचा भाग असलेल्या दृश्य घटकाची व्याख्या करा.
• नोटिस – जर तुमच्या xaml मध्ये आधीच ‘Interacation.Triggers’ संलग्न संपत्ती (लाइन 1) असेल तर तुम्ही दुसरे एक जोडू नका. लाइन 3-5 विद्यमान संपत्तीत जोडा.

तुम्ही PRISM मार्गदर्शक तत्त्वे आणि MVVM तत्त्वज्ञानाचा वापर करून संदेश बॉक्स संवाद कार्यान्वित करणे पूर्ण केले आहे.

अध्याय 2 – पुष्टीकरण संवाद प्रदर्शित करणे

पुष्टीकरण संवाद प्रदर्शित करणे संदेश बॉक्स प्रदर्शित करण्याच्या कार्यान्वयनासारखेच आहे. या विभागात मी फरकांवर लक्ष केंद्रित करेन त्यामुळे तुम्हाला पुढे जाण्यापूर्वी अध्याय 1 वाचावा लागेल.

दृश्य-मॉडेलमध्ये बदल करणे

संवादाचे प्रतिनिधित्व करणारी संपत्ती उघडणे

s2.1 ‘InteractionRequest<Confirmation>’ प्रकाराची संपत्ती उघडा. लक्षात ठेवा की सामान्य प्रकार ‘Confirmation’ आहे आणि ‘Notification’ नाही. खालील कोड नमुना वापरा:

public InteractionRequest<Confirmation> ShowConfirmation { get; set; }

s2.2 कन्स्ट्रक्टरमध्ये, संपत्तीला ठोस उदाहरणासह प्रारंभ करा. खालील कोड नमुना वापरा:

ShowConfirmation = new InteractionRequest<Confirmation>;

जेव्हा आवश्यक असेल तेव्हा संवाद प्रदर्शित करणे

s2.3 वापरकर्त्यास संवाद प्रदर्शित करण्यासाठी खालील कोड नमुना वापरा:

ShowConfirmation.Raise(new Confirmation { Content = "हा पुष्टीकरण संवाद दृश्य-मॉडेलमधून ट्रिगर झाला. तुम्ही स्वीकारता का?", Title = "पुष्टीकरण शीर्षक" }, confirmation =>
{
 if (confirmation.Confirmed)
 {
 // वापरकर्त्याने विनंती स्वीकारली (‘ok’ बटणावर क्लिक केले)
 }
 else
 {
 // वापरकर्त्याने विनंती नाकारली (‘cancel’ बटणावर क्लिक केले)
 }
});

दृश्यामध्ये बदल करणे

हा भाग अध्याय 1 मधील संबंधित भागासारखा आहे. एकमेव फरक म्हणजे ‘SourceObject’ बाइंड केलेल्या संपत्तीचे नाव.

आवश्यक नामस्थान जोडा

s2.4 XAML मध्ये खालील नामस्थान जोडा:

xmlns:ei="" 
xmlns:prism=""

InteractionRequestTrigger वर्तन जोडा

s2.5 खालील कोड नमुना वापरा, तो ग्रिड घटक ‘LayoutRoot’ च्या पहिल्या चाइल्ड म्हणून जोडा:

<ei:Interaction.Triggers>
 <prism:InteractionRequestTrigger SourceObject="{Binding ShowConfirmation}">
 <prism:PopupChildWindowAction/>
 </prism:InteractionRequestTrigger>
</ei:Interaction.Triggers> 

लेखाची पुनरावृत्ती

या लेखात मी सामान्य संवाद जसे की संदेश बॉक्स आणि पुष्टीकरण कसे प्रदर्शित करायचे हे दर्शवले. पुढील लेखात मी कस्टम संवाद प्रदर्शित करणे आणि शैली बदलणे यासारख्या अधिक प्रगत वापरावर लक्ष केंद्रित करेन. तुम्ही लेखाच्या सुरुवातीला प्रकल्प डाउनलोड करू शकता.

प्रत्यक्ष उदाहरण पाहण्यासाठी येथे क्लिक करा