एक्सयूआर आरपी - उन्नत इंटरैक्शन
अब तक, हमने खुद को बातचीत के लिए एक्सुर की बुनियादी विशेषताओं से परिचित कराया है। हालांकि, कई वास्तविक दुनिया के परिदृश्य होंगे, जहां प्रोटोटाइप को बुद्धिमान होना होगा। बुद्धिमान शब्द से, प्रोटोटाइप को एक निश्चित कार्य करने के लिए एक निश्चित विजेट की स्थिति का पता लगाने / ट्रिगर करने की आवश्यकता होगी।
इस तरह की बातचीत का एक विशिष्ट उदाहरण एक बटन का रंग निर्धारित कर रहा है। इसके लिए UX इंजीनियर को सोच की टोपी पहनना और प्रोटोटाइप डिजाइनिंग को अगले स्तर पर ले जाना आवश्यक है।
अक्ष में चर का उपयोग करना
Variable, परिभाषा के अनुसार, एक ऐसे कारक के लिए खड़ा है जो भिन्न या परिवर्तन के लिए उत्तरदायी है। Axure में, हम एक विजेट / इंटरैक्शन की स्थिति का प्रतिनिधित्व या पहचान करने के लिए चर का उपयोग कर सकते हैं।
एक पेज से दूसरे पेज पर डेटा ट्रांसफर करते समय एक विशिष्ट उदाहरण एक डेटा वैल्यू स्टोर करेगा। उदाहरण को सरल और स्पष्ट रखने के लिए, हम एक परिदृश्य पर विचार करते हैं जहाँ हमें एक विशेष विजेट की स्थिति को दिखाने की आवश्यकता होती है।
अपने अंतिम उदाहरण के साथ आगे बढ़ते हुए, आइए विचार करें कि हम यह दिखाना चाहते हैं कि छवि कितनी बार दिखाई गई थी।
यहाँ हम इसे कैसे करेंगे -
हम गिनती 0 को शुरू करने के लिए एक चर बनाएंगे।
बटन शो छवि के क्लिक पर, हम इस चर के मूल्य में वृद्धि करेंगे।
पाठ लेबल में मान प्रदर्शित करें।
इस उदाहरण के लिए, हम डायनामिक पैनल के नीचे एक टेक्स्ट बनाएंगे। पाठ पढ़ा जाएगा - छवि 0 बार दिखाया गया है।
Critical- यह महत्वपूर्ण है कि लेबल तीन में टूट गए हैं। कृपया तालिका में सूचीबद्ध लेबल नाम और पाठ का अनुसरण करें।
लेबल का नाम | लेबल पाठ |
---|---|
imageLabel | छवि दिखाई गई है |
countLabel | 0 (अंकों में शून्य) |
timesLabel | टाइम्स |
यह आवश्यक है क्योंकि हम प्रत्येक Show Image बटन क्लिक के लिए countLabel मान को नियंत्रित करना चाहते हैं।
हमें पहले एक वैरिएबल परिभाषित करें।
हमें एक चर की आवश्यकता होगी, जिसे बटन क्लिक करने पर नियंत्रित किया जाएगा। एक्स्यूर की शब्दावली में यह चर है - ग्लोबल वेरिएबल। वैश्विक चर को परिभाषित करने के लिए, मेनू बार में प्रोजेक्ट पर क्लिक करें और फिर वैश्विक चर पर क्लिक करें। निम्न स्क्रीनशॉट में दिखाए अनुसार एक डायलॉग बॉक्स खुलेगा।
वैश्विक चर जोड़ने के लिए हरे रंग के प्लस (+) आइकन पर क्लिक करें। आइए हम अपने वैश्विक चर को कहते हैं -varDynamicPanel। इसका डिफ़ॉल्ट मान होगा0।
शो इमेज बटन इंटरैक्शन के साथ, केस 1 पर डबल-क्लिक करें। एक और एक्शन जोड़ें। जैसा कि निम्नलिखित स्क्रीनशॉट में दिखाया गया है, क्रिया हैSet Text on countLabel to [[varDynamicPanel + 1]]।
एक पाठ लेबल को एक मान पर चयन करना बहुत सरल है। आइए देखें कि डायनेमिक पैनल से वैल्यू कैसे प्राप्त करें।
जैसा कि उपरोक्त स्क्रीनशॉट में चरण 4 द्वारा इंगित किया गया है, क्लिक करें fx बटन और निम्न संवाद बॉक्स खुल जाएगा।
पहले पाठ क्षेत्र के तहत, निम्न स्ट्रिंग दर्ज करें।
[[varDynamicPanel + 1]]
ओके पर क्लिक करें।
अब, हमें यह सुनिश्चित करने की आवश्यकता है कि प्रत्येक बटन पर क्लिक करने के बाद चर को अपडेट किया जाए।
क्रिया संपादक डायलॉग बॉक्स में, क्रियाओं के तहत, चर का चयन करें → चर मान सेट करें।
चर के रूप में varDynamicPanel का चयन करें।
उपलब्ध विकल्पों में से काउंटेलबेल के रूप में विजेट पर पाठ से मान लाने के लिए चर सेट करें।
ओके पर क्लिक करके केस एडिटर को बंद करें। फिर, पूर्वावलोकन बटन पर क्लिक करें।
चार बार छवि दिखाने / छिपाने के बाद, यहाँ पूर्वावलोकन स्क्रीन पर परिणाम है।