हास्केल

Question

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

क्या कोई भी एक साधारण दृष्टिकोण की सिफारिश कर सकता है? फिर, मैं सामान प्रस्तुत करने के लिए एक त्वरित और आसान तरीका पसंद करेंगे। मेरा ध्यान है हास्केल मूल बातें सीखने पर, वेब प्रोग्रामिंग नहीं।

Answer 1

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

यहां तीन "प्रारंभ करना" उदाहरण हैं जो रिफ्लेक्स/svg का उपयोग करते हैं। इनमें से प्रत्येक में एक कार्यशील डेमो शामिल है (रीडेमे फ़ाइल में लिंक किया गया है)।

Render circles in locations determined by the circle-packing package

Interactive knight's tour animation.

Rotating 3D cube

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

उदाहरण के लिए, नाइट के टूर और घूर्णन घन दोनों में कोड के रिकर्सिव-डू ब्लॉक होते हैं जिसमें केवल कॉल देखने और अपडेट होते हैं।

rec 
    view modelOrientation 
    modelOrientation <- foldDyn update initialOrientation tick 

नाइट के दौरे उदाहरण से:: दोनों मामलों में, कोड के इस ब्लॉक को देखने से प्रतिक्रिया स्थिति परिवर्तन के संचय (foldDyn अद्यतन)

के घूर्णन घन उदाहरण से सक्षम बनाता है

rec 
    startEvent <- view width height rowCount colCount board tour 
    tour <- foldDyn (update board) [] $ leftmost [startEvent, advanceEvent] 

रिफ्लेक्स के साथ शुरू करने के लिए मुझे सबसे आसान तरीका मिल गया है reflex-platform github repository क्लोनिंग और उस भंडार में निहित प्रयास-रिफ्लेक्स स्क्रिप्ट चला रहा है - जैसा कि रिफ्लेक्स-प्लेटफ़ॉर्म

के लिए रीडेमे पर निर्दिष्ट है

सर्कल पैकिंग उदाहरण के लिए circle-packing package की आवश्यकता है। घूर्णन 3 डी घन उदाहरण के लिए matrix package की आवश्यकता होती है। इन संकुलों के उपयोग को सक्षम करने के लिए, उन्हें रिफ्लेक्स-प्लेटफॉर्म रीडेमे पर निर्दिष्ट अनुसार, कोशिश-रिफ्लेक्स चलाने से पहले संकल्प.निक्स में रिफ्लेक्स-प्लेटफ़ॉर्म में शामिल करें।