Basic XAML

पिछले चैप्टर में हमने यह पढ़ा की XAML क्या है और इसका क्या उपयोग है, और अब हम देखेंगे कि आप XAML में कंट्रोल (control) कैसे बना सकते हैं? जैसा कि आप अगले उदाहरण में देखेंगे कि XAML में कंट्रोल(control) बनाना वैसा ही आसान है जैसे दो कोण कोष्ठक (angle brackets "<>") में उसका नाम लिखना | उदाहरण के लिए एक बटन कुछ इस तरह से दिखेगा :

<Button>

XAML टैग का समाप्त(end) होना आवश्यक है, XAML टैग का समापन या तो समापन टैग (end tad) लिखकर अथवा आरम्भ टैग (start tag) के अंत में स्लैश (/) लिखकर कर सकते हैं |

<Button></Button>

अथवा

<Button />

बहुत से कन्ट्रोल (controls) आपको आरम्भ टैग (start tag) और समापन टैग (end tag) के बीच में सामग्री लिखने की अनुमति देते हैं | उधाहरण के लिए बटन टैग बटन के ऊपर दिखाए जाने वाले टेक्स्ट को आरम्भ टैग (start tag) और समापन टैग (end tag) के बीच में लिखने की अनुमति देता है |

<Button>A button</Button>

HTML केस-संवेदी (case-sensitive) नहीं है, लेकिन XAML है, क्योंकि कन्ट्रोल के नाम को .NET फ्रेमवर्क के टाइप के अनुरूप होना आवश्यक है। यही नियम विशेषता नामों (attribute names) के लिए भी लागू होते है, जो कन्ट्रोल की गुणों (properties) से मेल खाते है। यहां एक बटन है जहां हम टैग में विशेषताओं (attribute) को जोड़कर कुछ गुणों (properties) को परिभाषित कर रहे हैं:

<Button FontWeight="Bold" Content="A button" />

हम फ़ॉन्ट वेट (Font Weight) प्रॉपर्टी सेट करते हैं, जो हमें मोटे टेक्स्ट (bold text) देते हैं, और फिर हम कंटेंट प्रॉपर्टी सेट करते हैं, जो कि आरम्भ टैग (start tag) और समापन टैग (end tag) के बीच में टेक्स्ट लिखने के समान है। हालांकि, कन्ट्रोल की सभी विशेषताओं(attributes) को इस तरह भी परिभाषित किया जा सकता है, जहां वे कंट्रोल-डॉट-प्रॉपर्टी नोटेशन का उपयोग करते हुए मुख्य नियंत्रण के चाइल्ड टैग के रूप में दिखाई देते हैं:

<Button>
    <Button.FontWeight>Bold</Button.FontWeight>
    <Button.Content>A button</Button.Content>
</Button>

परिणाम बिल्कुल ऊपर जैसा है, इसलिए इस मामले में, यह सब सिंटैक्स (syntax) के बारे में है और कुछ नहीं। हालाँकि, बहुत सारे कन्ट्रोल टेक्स्ट के अलावा अन्य सामग्री की अनुमति देते हैं | यहाँ एक उदाहरण है जहाँ हमने एक बटन के अंदर कुछ टेक्स्टब्लॉक कन्ट्रोल का उपयोग करके एक ही बटन पर अलग-अलग रंग के टेक्स्ट लिखे हैं:

<Button>
    <Button.FontWeight>Bold</Button.FontWeight>
    <Button.Content>
        <WrapPanel>
            <TextBlock Foreground="Blue">Multi</TextBlock>
            <TextBlock Foreground="Red">Color</TextBlock>
            <TextBlock>Button</TextBlock>
        </WrapPanel>
    </Button.Content>
</Button>

Content property केवल एक Child element के लिए अनुमति देती है, इसलिए हम पाठ के अलग-अलग रंग के ब्लॉक को शामिल करने के लिए एक WrapPanel का उपयोग करते हैं। WrapPanel की तरह Panel, WPF में एक महत्वपूर्ण भूमिका निभाता है। हम बाद में उन पर और अधिक विवरण में चर्चा करेंगे - अभी के लिए, उन्हें अन्य Control के लिए कंटेनर के रूप में मानेंगे।

ठीक उसी परिणाम को निम्नलिखित मार्कअप के साथ पूरा किया जा सकता है, जो कि समान लिखने का एक और तरीका है:

<Button FontWeight="Bold">
    <WrapPanel>
        <TextBlock Foreground="Blue">Multi</TextBlock>
        <TextBlock Foreground="Red">Color</TextBlock>
        <TextBlock>Button</TextBlock>
    </WrapPanel>
</Button>

कोड बनाम XAML

उम्मीद है कि उपरोक्त उदाहरण आपको दिखाते हैं कि XAML लिखना बहुत आसान है, लेकिन इसे करने के विभिन्न तरीकों के साथ। और यदि आप सोचते हैं कि उपरोक्त उदाहरण विभिन्न रंगों में text के साथ एक बटन प्राप्त करने के लिए बहुत अधिक मार्कअप है, तो इसकी तुलना C# में सटीक यही काम करने के लिए प्रयास कर करें

Button btn = new Button();
btn.FontWeight = FontWeights.Bold;

WrapPanel pnl = new WrapPanel();

TextBlock txt = new TextBlock();
txt.Text = "Multi";
txt.Foreground = Brushes.Blue;
pnl.Children.Add(txt);

txt = new TextBlock();
txt.Text = "Color";
txt.Foreground = Brushes.Red;
pnl.Children.Add(txt);

txt = new TextBlock();
txt.Text = "Button";
pnl.Children.Add(txt);

btn.Content = pnl;
pnlMain.Children.Add(btn);

बेशक उपरोक्त उदाहरण को कम स्पष्ट रूप से लिखा जा सकता है और अधिक अर्थपूर्ण किया जा सकता है, लेकिन मुझे लगता है कि बिंदु अभी भी बाकी है: इंटरफेस का वर्णन करने के लिए XAML बहुत छोटा और संक्षिप्त है।