اساسيات XAML

في الفصل السابق تحدثنا عن ما هي لغة XAML وفيما تستخدمها، لكن كيف تقوم بإنشاء أداة في لغة XAML؟ كما سوف ترى في المثال التالي، إنشاء أداة في لغة XAML هو بمقدار سهولة كتابة اسم تلك الأداة، ولكن محاطة بعلامة قوس الزاوية (علامة أكبر من وأصغر من). مثلا الزر سوف يبدو كالتالي:

<Button>

يجب أن تنتهي علامات XAML ، إما عن طريق كتابة علامة النهاية أو بوضع شرطة مائلة للأمام في نهاية علامة البدء:

<Button></Button>

أو

<Button />

تسمح لك الكثير من عناصر التحكم بوضع المحتوى بين علامتي البدء والانتهاء ، وهو ما يمثل محتوى عنصر التحكم. على سبيل المثال ، يتيح لك زر التحكم تحديد النص الذي يظهر عليه بين علامتي البدء والانتهاء:

<Button>A button</Button>

HTML غير حساس لحالة الأحرف ، ولكن XAML ، لأنه يجب أن يتوافق اسم عنصر التحكم مع نوع في .NET framework. وينطبق نفس الشيء على أسماء السمات ، التي تتوافق مع خصائص عنصر التحكم. في ما يلي زر يتم من خلاله تحديد نوعين من الخصائص عن طريق إضافة سمات للعلامة:

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

قمنا بتعيين الخاصية FontWeight ، مما يتيح لنا النص الغامق ، ثم قمنا بتعيين خاصية المحتوى ، وهي نفس كتابة النص بين علامة البداية والنهاية. ومع ذلك ، قد يتم أيضًا تعريف جميع سمات عنصر التحكم على هذا النحو ، حيث تظهر كعلامات تابعة لعنصر التحكم الرئيسي ، باستخدام تدوين Control-Dot-Property:

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

والنتيجة هي نفسها تمامًا كما هو مذكور أعلاه ، لذا في هذه الحالة ، يتعلق الأمر كله بالبناء وأي شيء آخر. ومع ذلك ، فإن الكثير من عناصر التحكم تسمح بمحتوى بخلاف النص ، على سبيل المثال عناصر التحكم الأخرى. في ما يلي مثال حيث يوجد لدينا نص بألوان مختلفة على نفس الزر باستخدام عدة عناصر تحكم TextBlock داخل الزر:

<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>

تسمح خاصية المحتوى فقط بعنصر فرعي واحد ، لذلك نستخدم WrapPanel لاحتواء كتل النص المختلفة الألوان. تلعب الأفرقة ، مثل WrapPanel ، دورًا مهمًا في WPF وسنناقشها بتفاصيل أكثر لاحقًا - وفي الوقت الحالي ، اعتبرها مجرد حاويات للضوابط الأخرى.

النتيجة نفسها يمكن أن تنجز باستخدام الترميز التالي، وهي ببساطة طريقة أخرى لكتابة نفس الأمر:

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

الكود × XAML

لحسن الحظ، المثال السابق الذي يعرض الـ XAML ، سهل الكتابة، لكن بعدة طرق، فإذا كنت ترى أن المثال السابق فيه الكثير من الترميز للحصول على زر مع نص بألوان مختلفة ، إذن قارنه بفعل نفس الأمر باستخدام سي شارب.

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 هو قصير جدا وموجز لوصف الواجهات.