हमारे विंडोज फोन ट्यूटोरियल श्रृंखला के एक हिस्से के रूप में, अब हम यूआई तत्वों को बनाने के लिए सीखेंगे HelloPhone आवेदन। आवेदन बहुत आसान है। पूरा होने पर, एप्लिकेशन यूआई में एक कैप्शन, एक टेक्स्ट बॉक्स और एक बटन होगा।
एप्लिकेशन का उपयोग करने के लिए, आप टेक्स्ट बॉक्स में कुछ टेक्स्ट डालते हैं और फिर, जब आप बटन पर क्लिक करते हैं, तो एप्लिकेशन आपके द्वारा लिखे गए पाठ के साथ बैनर प्रदर्शित करता है। यह निम्नलिखित आकृति की तरह कुछ दिखाई देगा।
में 1 समाधान खोजी, डबल क्लिक करें MainPage.xaml डिजाइनर में इस फाइल को खोलने के लिए।
डिजाइनर XAML फ़ाइलों को संपादित करने के लिए दो अलग-अलग दृश्य प्रदान करता है, डिज़ाइन तथा XAML राय। डिज़ाइन मोड में, आपके पास एक एमुलेटर डिज़ाइन होता है जहां आप टूलबॉक्स से नियंत्रण खींच सकते हैं और छोड़ सकते हैं, साथ ही मौजूदा नियंत्रणों के लिए चयन, आकार बदल सकते हैं, और सेट कर सकते हैं। एक्सएएमएल मोड में, आपके पास एक मार्कअप संपादक है जो आपको पृष्ठ में एक्सएएमएल कोड संपादित करने देता है। आप किसी भी मोड के साथ काम कर सकते हैं। आपके पास एक स्प्लिट मोड भी है, जिसमें संपादक विंडो एक साथ दोनों दृश्य दिखाती है।
2. इस कार्य में हम मुख्य रूप से XAML को मैन्युअल रूप से संपादित करने पर ध्यान केंद्रित कर रहे हैं। एक बार कोडिंग भाग पूरा हो जाने के बाद आप परिणामों को देखने के लिए डिजाइनर दृश्य पर वापस आ सकते हैं। आप एक पूर्ण स्क्रीन एक्सएएमएल दृश्य भी प्राप्त कर सकते हैं।
3. डिफ़ॉल्ट विंडोज फोन एप्लिकेशन टेम्पलेट द्वारा जेनरेट किए गए एक्सएएमएल मार्कअप में, का पता लगाएं ग्रिड नामक कंटेनर तत्व LayoutRoot । इसका उद्देश्य पृष्ठ पर तत्वों की व्यवस्था करना है। इसके अंदर RowDefinition संपत्ति, दो मौजूदा पंक्तियों के बीच एक अतिरिक्त पंक्ति डालें और इसके मूल्य को निर्धारित करें ऊंचाई संपत्ति के लिए ऑटो । इस पंक्ति में जल्द ही एक टेक्स्टबॉक्स और एक बटन शामिल होगा।
4. रूट ग्रिड तत्व में कुछ घोंसले वाले तत्व भी होते हैं जिनमें प्रत्येक को बाहरी ग्रिड की एक अलग पंक्ति में निर्दिष्ट किया जाता है Grid.Row संपत्ति। अब नामित ग्रिड तत्व का पता लगाएं TitleGrid और आंतरिक ग्रिड के अंदर पहले टेक्स्ट ब्लॉक तत्व की टेक्स्ट प्रॉपर्टी को " विंडोज फोन 7 श्रृंखला "। उसी प्रकार हैलो फोन अगले पाठ ब्लॉक में जोड़ा गया है।
5. अब, खोजें ग्रिड तत्व का नाम ContentGrid, इसे पंक्ति में असाइन करें 1, जो आमतौर पर प्रारंभ में खाली होता है, और इस तत्व के अंदर निम्न XAML मार्कअप पेस्ट करें।
6. पृष्ठ के डिज़ाइन को पूरा करने के लिए, उपयोगकर्ता द्वारा दर्ज किए गए संदेश के साथ बैनर रखने के लिए एक तीसरी पंक्ति जोड़ें। इस पंक्ति को बनाने के लिए, बाहरी ग्रिड के अंतिम टैग से पहले निम्नलिखित XAML मार्कअप डालें।
7. क्लिक करें डिज़ाइन पृष्ठ पर नियंत्रण के लेआउट को देखें और जांचें।
हमारे अगले ट्यूटोरियल में हम सीखेंगे कि कैसे करें "यूजर इंटरफेस से घटनाओं को संभालें"।
