डेल्फी में उपयोगकर्ता इंटरफेस विकसित करने के लिए एमवीसी दृष्टिकोण। भाग 1. चेकमार्क

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


क्लासिक अनुप्रयोगों द्वारा, मेरा मतलब है कि वीसीएल पर आधारित विंडोज के लिए डेस्कटॉप जीयूआई अनुप्रयोग। FireMonkey ढांचे के बारे में, जो डेल्फी के नए संस्करणों में दिखाई दिया, किसी और को एक लेख लिखने दें।
उपयोगकर्ता इंटरफ़ेस बहुत विविध हैं। और अगर वेब पर वे आम तौर पर एक पूरी तरह से मेनेजर हैं, तो डेस्कटॉप अनुप्रयोगों में सब कुछ अधिक रूढ़िवादी रूप से होता है। बेशक, कुछ अनुप्रयोगों के डेवलपर्स (स्काइप, मिकोगो, कार्यालय 2010 देखें) सभी प्रकार के दृश्य चाल के साथ आते हैं जो प्रयोज्यता को और बेहतर बनाने के लिए डिज़ाइन किए गए हैं, लेकिन हममें से अधिकांश (पुराने स्कूल के लोग) मानक विंडोज और वीसीएल नियंत्रण का आविष्कार किया है शायद विंडोज 3.1 के दिनों में वापस:
- बटन (TButton)
- चेकमार्क (TCheckBox)
- स्विच (रेडियो बटन, TRadioButton)
- सिंगल लाइन इनपुट फील्ड (TEdit)
- मल्टी-लाइन इनपुट फ़ील्ड (TMemo या TRichEdit)
- सभी प्रकार के संयुक्त नियंत्रण (TSpinEdit, TDateTimeEdit)
- बहु-पृष्ठ नियंत्रण (TPageControl, TTabControl)
- ग्रिड
- पैनल, ग्रुपबॉक्स, बेवेल, शेप, इमेजबॉक्स, आदि।

उपयोगकर्ता इंटरफ़ेस बनाते समय, मुख्य कार्य उपरोक्त तत्वों का उपयोग करके प्रोग्राम के आंतरिक डेटा के ऐसे प्रतिनिधित्व के साथ आना है, ताकि उपयोगकर्ता के लिए इस डेटा के साथ काम करना सुविधाजनक हो। ठीक है, या दूसरी ओर, ऐसे तत्वों का एक सेट है, जिसके साथ उपयोगकर्ता प्रोग्राम को बता सकता है कि प्रोग्राम को उससे क्या सुनना चाहिए।
तत्वों के लेआउट के दृष्टिकोण से एक इंटरफ़ेस डिज़ाइन करना अपने आप में एक जटिल और महत्वपूर्ण कार्य है। इंटरफ़ेस आपके प्रोग्राम के साथ उपयोगकर्ता इंटरैक्शन के लिए चेहरा और मुख्य तरीका है (Ctrl + Alt + Del :) द्वारा इसे हटाने की गणना नहीं करता है)। यही कारण है कि हमेशा इंटरफ़ेस को डिज़ाइन करना आवश्यक होता है, उपयोगकर्ताओं से हर बार प्रतिक्रिया प्राप्त करना, क्या उनके लिए आपके कार्यक्रम के साथ काम करना सुविधाजनक है, क्या आपको 200 बार माउस पर क्लिक करना होगा, उप विंडो में जाएं (जो कि अंतिम समय में भी मोडल है), 10 एक ही डेटा एक बार दर्ज करें क्योंकि जब आप विंडो आदि को फिर से दर्ज करते हैं तो वे सहेजे नहीं जाते हैं। आदि (मुझे यकीन है कि एक परिष्कृत पाठक उपयोगकर्ता इंटरफ़ेस क्या नहीं होना चाहिए के कई और उदाहरण दे सकता है :))।

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

आइए आदिम से शुरू करते हैं। चेकमार्क।

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

cbNeedDeleteFiles: TCheckBox; 

वैसे, नियंत्रण के प्रकार के आधार पर नामों को नियंत्रित करने के लिए उपसर्ग देना बहुत सुविधाजनक है। उदाहरण के लिए, TCheckBox के लिए सीबी, TRadioButton के लिए आरबी, TButton के लिए बीटी। यदि आप डेल्फी में cnPack एक्सटेंशन पैकेज स्थापित करते हैं, तो जब आप प्रपत्र पर अगला नियंत्रण रखते हैं, तो एक विंडो आपके नियमों के अनुसार इस नियंत्रण को तुरंत नाम बदलने के प्रस्ताव के साथ पॉप अप करती है। यह प्रपत्र पर चारों ओर पड़ी Button87, CheckBox32, आदि के प्रभुत्व से बचा जाता है।

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

 if cbNeedDeleteFiles.Checked then ... if Something then cbNeedDeleteFiles.Checked := True; if SomethingElse then cbNeedDeleteFiles.Checked := False; 

पहली नज़र में, इसमें कुछ भी गलत नहीं है। लेकिन लंबी अवधि के अभ्यास से पता चलता है, यह भयानक है। इसे यूजर इंटरफेस को टाइट लिंकिंग कहा जाता है। मान लीजिए कि आपको बाद में दो रेडियो बटनों के साथ TCheckBox को बदलना है: "आयातित फ़ाइलें हटाएं" और "आयातित फ़ाइलों को न हटाएं।" यह बहुत मायने नहीं रखता है, लेकिन आप इसे बेहतर विज़ुअलाइज़ेशन के लिए कर सकते हैं या इस सेटिंग की तीसरी स्थिति को जोड़ने से पहले रिफैक्टरिंग के हिस्से के रूप में कर सकते हैं जैसे कि "फ़ाइलें हटाएं यदि कोई आयात त्रुटियां नहीं हैं"। और उस समय आपको उन स्थानों के ढेर में RadioButton के साथ काम करने के लिए कुछ कोड डालना होगा जहां आप cbNeedDeleteFiles.Checked से संपर्क करते थे।

इससे कैसे बचा जाए?

लंबे समय तक नेटवर्क पर और एमवीसी , एमवीपी , एमवीवीएम के बारे में बहुत ट्रम्पेटिंग। जैसे कि ये ऐसी चमत्कारी तकनीकें हैं, जिनका अनुसरण करके आप यूजर इंटरफेस "सही ढंग से" प्रोग्राम कर सकते हैं और ऊपर वर्णित बकवास नहीं है। वास्तव में, ये केवल दृष्टिकोण हैं जो वास्तव में मदद करते हैं, लेकिन जिसे पूरी तरह से अलग-अलग प्रोग्रामिंग भाषाओं में और यहां तक ​​कि एक भाषा में भी लागू किया जा सकता है। यानी ये बजाय उपयोगकर्ता इंटरफ़ेस प्रोग्रामिंग के लिए किस तरफ सबसे अच्छा सुझाव हैं।
यदि आप एक बार फिर से संक्षिप्तीकरण को देखते हैं, तो आप देख सकते हैं कि तीनों में M (मॉडल, मॉडल) और V (व्यू, व्यू) अक्षर हैं। बहुत ही सरल भाषा में बोलते हुए, मॉडल कार्यक्रम का आंतरिक डेटा है, और प्रस्तुति बाहरी (उपयोगकर्ता इंटरफ़ेस) है। चेक मार्क पर वापस लौटना, यह स्पष्ट है कि बुलियन मूल्य इस चेक मार्क का आंतरिक प्रतिनिधित्व है। इस मूल्य को किस वर्ग की विशेषता के रूप में संग्रहित किया जाए, इसका निर्णय प्रत्येक मामले में व्यक्तिगत रूप से लिया जाता है। उदाहरण के लिए, यह एक टीसीऑनफिग क्लास हो सकता है जो प्रोग्राम सेटिंग्स तक पहुंच प्रदान करता है। हालाँकि, साधारण मामलों में, यह फॉर्म क्लास के लिए संबंधित विशेषता बनाने के लिए पर्याप्त है:

 TfmImport = class(TForm) ... private ... FNeedDeleteFiles: Boolean; public ... property NeedDeleteFiles: Boolean read FNeedDeleteFiles write SetNeedDeleteFiles; end; 

अगला, आपको दृश्य घटक की स्थिति (TCheckBox) cbNeedDeleteFiles के साथ NeedDeleteFiles संपत्ति की स्थिति को संबद्ध करने की आवश्यकता है। यह आसानी से सेट संपत्ति विधि के माध्यम से किया जाता है:

 procedure TfmImport.SetNeedDeleteFiles(const Value: Boolean); begin if FNeedDeleteFiles <> Value then begin FNeedDeleteFiles := Value; cbNeedDeleteFiles.Checked := FNeedDeleteFiles; end; end; 

क्यों FNeedDeleteFiles <> मूल्य स्थिति की आवश्यकता है मैं थोड़ा बाद में समझाऊंगा। मुख्य बात यह है कि अब, NeedDeleteFiles संपत्ति का मान निर्दिष्ट करते समय, हम स्वचालित रूप से टिक हो जाएंगे (यह लगभग एक MVC मॉडल है - हम मॉडल तत्व के मूल्य को बदलते हैं, और दृश्य स्वचालित रूप से बदल जाता है)। लेकिन यह कनेक्शन केवल एक ही तरीका है - आंतरिक डेटा से इंटरफ़ेस तक। प्रतिक्रिया प्राप्त करना आवश्यक है - दृश्य से (यानी चेकमार्क से) मॉडल पर। ऐसा करने के लिए, हमारे चेकबॉक्स के OnClick हैंडलर में निम्नलिखित कोड लिखें:

 procedure TfmImport.cbNeedDeleteFilesClick(Sender: TObject); begin NeedDeleteFiles := cbNeedDeleteFiles.Checked; end; 

यानी दृश्य पर कार्रवाई (इस मामले में, चेकमार्क पर क्लिक करके) मॉडल को वर्तमान स्थिति के अनुरूप लाएगी। हालाँकि, मॉडल कभी भी दृश्य पर भरोसा नहीं करता है और इसलिए दृश्य की स्थिति को मॉडल की स्थिति में वापस लाने का कारण बनेगा (बल cbNeedDeleteFiles.Checked: = FNeedDeleteFiles। कुछ भी गलत नहीं है। और हमने FNeedDeleteFiles <> स्थिति का मान रखने वाले स्थिति से स्वयं का बीमा किया है। OnClick हैंडलर फिर से कॉल करेगा, वास्तव में, यह नहीं होगा, क्योंकि एक समान चेक है:

 procedure TCustomCheckBox.SetChecked(Value: Boolean); begin if Value then State := cbChecked else State := cbUnchecked; end; procedure TCustomCheckBox.SetState(Value: TCheckBoxState); begin if FState <> Value then begin FState := Value; ... end; end; 

अब हमारे पास TfmImport.NeedDeleteFiles संपत्ति की स्थिति है जो कि daw स्थिति cbNeedDeleteFiles के साथ सिंक्रनाइज़ है। दोनों दिशाओं में जांच की गई। कार्यक्रम के सभी स्थानों में जहां हम cbNeedDeleteFiles.Checked का उपयोग करते थे, अब आपको NeedDeleteFiles संपत्ति का उपयोग करना चाहिए। यह हमें पूरी तरह से यह भूलने की अनुमति देता है कि NeedDeleteFiles तत्व का प्रतिनिधित्व एक चेकबॉक्स है। आप सोच भी नहीं सकते कि यह कितना अद्भुत है। इसके बाद, हम चेकबॉक्स को दो रेडियो बटन या किसी भी चीज़ से बदल सकते हैं, और हमें इसे केवल SetNeedDeleteFiles सेट-मेथड (मॉडल -> दिशा देखें) और एक हैंडलर से बदलना होगा, जो देखने के समय में बदलाव करता है, अर्थात दृश्य घटक (देखें -> मॉडल दिशा)।

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

 procedure TfmImport.FormCreate(Sender: TObject); begin FNeedDeleteFiles := False; //   ,   ,   ,   set- NeedDeleteFiles := True; //   set-   GUI    ( ) end; 

लेख के अगले भाग में मैं और अधिक जटिल मामलों के बारे में बात करने की कोशिश करूंगा: तत्वों की सूची (TListBox, TCheckListBox, TComboBox) के साथ MVC शैली में काम करना और बंद होने पर एक खिड़की के दृश्य तत्वों की स्थिति को याद करते समय नुकसान के बारे में।

युपीडी। लेख का दूसरा भाग जोड़ा जाता है ।
युपीडी। लेख का तीसरा भाग जोड़ा जाता है ।