🕴🏽 👈 👩🏽‍🤝‍👨🏾 ActionScript3 में MVC टेम्पलेट का उपयोग करना 🏂🏻 👁️ 👩🏽‍💼

प्रस्तावना

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

अनुकूलन पर विचार

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

ActionScript3 के साथ MVC का उपयोग करना

और अब हम एक स्पेसशिप के बारे में एक साधारण गेम के उदाहरण से प्रोग्रामिंग की ओर मुड़ते हैं।

आदर्श

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

राय

वर्ग में हमारे खिलौनों के सभी दृश्य भाग होते हैं, साथ ही खिलाड़ी के कार्यों के लिए श्रोता भी होते हैं।

नियंत्रक

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

एक कोड लिखना

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

क्लास मेन

 //......imports...... public class Main extends Sprite { private var m_model:Model; private var m_view:View; private var m_controller:Controller; public function Main() { m_model = new Model(); m_controller = new Controller(m_model); m_view = new View(m_model, m_controller); addChild(m_view); } }

//......imports...... public class Main extends Sprite { private var m_model:Model; private var m_view:View; private var m_controller:Controller; public function Main() { m_model = new Model(); m_controller = new Controller(m_model); m_view = new View(m_model, m_controller); addChild(m_view); } }

यहां, मुख्य वर्ग में, हम सभी टेम्पलेट कक्षाओं को "परिभाषित" करते हैं। डिस्प्ले क्लास पर ध्यान देना - मॉडल और कंट्रोलर क्लास ऑब्जेक्ट्स को तुरंत इसे स्थानांतरित कर दिया जाता है, क्योंकि यह एक ही समय में दोनों के साथ इंटरैक्ट करता है। मेरे खिलौने में, क्लास कंट्रोलर केवल "मॉडल" ही बदल सकता है।

वर्ग दृश्य

 //......imports...... public class View extends Sprite { [Embed(source="my_small_spaceship_image.jpg")] public var m_image:Class; public var m_spaceShip:Bitmap = new m_image(); private var m_model:Object; private var m_controller:Object; public function View(model:Object, controller:Object):void { m_model = model; m_model.addEventListener(Event.CHANGE, changed); m_controller = controller; m_spaceShip.x = 200; m_spaceShip.y = 200; addChild(m_spaceShip); addEventListener(Event.ADDED_TO_STAGE, addedToStage); } public function addedToStageHandler(event:Event):void { stage.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed); } public function keyPressed(event:KeyboardEvent):void { m_controller.key_Pressed(event); } public function changed(event:Event):void { m_spaceShip.x = m_model.direction[0] m_spaceShip.y = m_model.direction[1]; } }

//......imports...... public class View extends Sprite { [Embed(source="my_small_spaceship_image.jpg")] public var m_image:Class; public var m_spaceShip:Bitmap = new m_image(); private var m_model:Object; private var m_controller:Object; public function View(model:Object, controller:Object):void { m_model = model; m_model.addEventListener(Event.CHANGE, changed); m_controller = controller; m_spaceShip.x = 200; m_spaceShip.y = 200; addChild(m_spaceShip); addEventListener(Event.ADDED_TO_STAGE, addedToStage); } public function addedToStageHandler(event:Event):void { stage.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed); } public function keyPressed(event:KeyboardEvent):void { m_controller.key_Pressed(event); } public function changed(event:Event):void { m_spaceShip.x = m_model.direction[0] m_spaceShip.y = m_model.direction[1]; } }

यहां दो महत्वपूर्ण बिंदु हैं:
पहले - m_model परिवर्तनों के लिए सुनी जाती है, और फिर प्राप्त विधि के माध्यम से मॉडल वर्ग जहाज के नए निर्देशांक को वापस करने में सक्षम होगा।
वास्तव में लाइन m_spaceShip.x = m_model.direction[0] और कॉल विधि प्राप्त करता है।
दूसरा बिंदु - एक कीप ईवेंट को सुना जाता है, और नियंत्रक वर्ग की विधि को कहा जाता है।
फिर सेट विधि (रिकॉर्डिंग कंट्रोलर वर्ग से है) का उपयोग करके मॉडल के लिए नए निर्देशांक लिखे गए हैं।

कक्षा नियंत्रक

 public class Controller public class Controller { private var m_model:Object; public function Controller(model:Object):void { m_model = model; } public function key_Pressed(event:KeyboardEvent):void { switch (event.keyCode) { case Keyboard.LEFT: m_model.direction = new Array(m_model.direction[0] - 5, m_model.direction[1]); break; case Keyboard.RIGHT: m_model.direction = new Array(m_model.direction[0] + 5, m_model.direction[1]); break; case Keyboard.UP: m_model.direction = new Array(m_model.direction[0], m_model.direction[1] - 5); break; case Keyboard.DOWN: m_model.direction = new Array(m_model.direction[0], m_model.direction[1] + 5); break; } } }

public class Controller public class Controller { private var m_model:Object; public function Controller(model:Object):void { m_model = model; } public function key_Pressed(event:KeyboardEvent):void { switch (event.keyCode) { case Keyboard.LEFT: m_model.direction = new Array(m_model.direction[0] - 5, m_model.direction[1]); break; case Keyboard.RIGHT: m_model.direction = new Array(m_model.direction[0] + 5, m_model.direction[1]); break; case Keyboard.UP: m_model.direction = new Array(m_model.direction[0], m_model.direction[1] - 5); break; case Keyboard.DOWN: m_model.direction = new Array(m_model.direction[0], m_model.direction[1] + 5); break; } } }

यहां हमने मॉडल वर्ग के ऑब्जेक्ट को पास किया और मॉडल क्लास के सेट विधि के माध्यम से इसकी स्थिति बदल दी।
तब चर m_direction m_model.direction = new Array (m_model.direction [0] - 5, m_model.direction [1]) संचालन को कॉल करने के बाद इसका मान बदल देगा।
और अंत में, मॉडल वर्ग का एक उदाहरण:

क्लास मॉडल

 public class Model extends EventDispatcher { private var m_direction:Array = new Array(); public function Model() { m_direction.push(200, 200); } public function get direction():Array { return m_direction; } public function set direction(m_values:Array):void { m_direction[0] = m_values[0]; m_direction[1] = m_values[1]; dispatchEvent(new Event(Event.CHANGE)); } }

public class Model extends EventDispatcher { private var m_direction:Array = new Array(); public function Model() { m_direction.push(200, 200); } public function get direction():Array { return m_direction; } public function set direction(m_values:Array):void { m_direction[0] = m_values[0]; m_direction[1] = m_values[1]; dispatchEvent(new Event(Event.CHANGE)); } }

यहां, सेट विधि मॉडल की स्थिति डेटा को अपडेट करती है, दृश्य में परिभाषित श्रोता को कहा जाता है - हमारे नाव के निर्देशांक तदनुसार बदलते हैं।

परिणामस्वरूप, मैंने ActionScript3 में MVC टेम्पलेट का उपयोग करने के सबसे सरल उदाहरण की जांच की। यदि आपके कोई प्रश्न हैं, तो मुझे उत्तर देने में खुशी होगी।

ActionScript3 में MVC टेम्पलेट का उपयोग करना