TOC

This article is currently in the process of being translated into Lao (~98% done).

XAML:

Basic XAML

ໃນບົດທີ່ຜ່ານມາ, ພວກເຮົາໄດ້ເວົ້າເຖິງ XAML ແມ່ນຫຍັງແລະຈະໃຊ້ມັນເພື່ອຫຍັງ, ແຕ່ວ່າເຈົ້າຈະສ້າງການຄວບຄຸມໃນ XAML ໄດ້ແນວໃດ? ດັ່ງທີ່ທ່ານຈະເຫັນໄດ້ຈາກຕົວຢ່າງຕໍ່ໄປ, ການສ້າງການຄວບຄຸມໃນ XAML ແມ່ນງ່າຍພຽງຂຽນຊື່ມັນ, ລ້ອມຮອບດ້ວຍເຄື່ອງໝາຍ <>. ຕົວຢ່າງ, ປຸ່ມໃນລັກສະນະດັ່ງນີ້:

<Button>

tags XAML ຕ້ອງໄດ້ສິ້ນສຸດລົງດັວຍ, ໂດຍການຂຽນ end tag ຫຼືໂດຍການວາງແຖບສະແລຊ "/" ທີ່ຢູ່ໃນຕອນທ້າຍຂອງ Tag ເລີ່ມຕົ້ນ:

<Button></Button>

ຫຼື

<Button />

Control ຈໍານວນຫຼາຍຊ່ວຍໃຫ້ທ່ານສາມາດເຮັດໃຫ້ເນື້ອຫາລະຫວ່າງ ເລີ່ມຕົ້ນແລະສິ້ນສຸດ tags , ຊຶ່ງເປັນເນື້ອໃນຂອງ Control. ຕົວຢ່າງ, Button control ຊ່ວຍໃຫ້ທ່ານສາມາດລະບຸຂໍ້ຄວາມທີ່ສະແດງຢູ່ໃນລະຫວ່າງ ເລີ່ມຕົ້ນແລະສິ້ນສຸດ tags :

<Button>A button</Button>

HTML ບໍ່ເປັນ case-sensitive, ແຕ່ XAML ເປັນ, ເພາະວ່າຊື່ຂອງ Control ຕ້ອງສອດຄ່ອງກັບປະເພດຂອງ .NET framework. ເຊັ່ນດຽວກັນສໍາລັບຊື່ຂອງ attribute, ເຊິ່ງກົງກັນກັບ Properties ຂອງ Control. ນີ້ແມ່ນປຸ່ມທີ່ພວກເຮົາກໍານົດຄູ່ຂອງ properties ໂດຍການເພີ່ມ attributes ຂອງແທັກ:

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

ພວກເຮົາກໍານົດຄຸນສົມບັດ FontWeight, ໃຫ້ເປັນຂໍ້ຄວາມຫນາ, ແລະຫຼັງຈາກນັ້ນພວກເຮົາກໍານົດຄຸນສົມບັດເນື້ອຫາ, ເຊິ່ງຄືກັນກັບການຂຽນຂໍ້ຄວາມລະຫວ່າງ ເລີ່ມຕົ້ນແລະສິ້ນສຸດ tags. ຢ່າງໃດກໍຕາມ, attributes ທັງຫມົດຂອງ Control ອາດຈະຖືກກໍານົດເຊັ່ນນີ້, ບ່ອນທີ່ພວກເຂົາກຳນົດ ວ່າເປັນ Tags ລູກຂອງ Control ຫຼັກ, ການນໍາໃຊ້ Control-Dot-Property notation:

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

ຜົນໄດ້ຮັບແມ່ນຄືກັບຂ້າງເທິງເລີຍ, ດັ່ງນັ້ນໃນກໍລະນີນີ້, ມັນແມ່ນທັງຫມົດກ່ຽວກັບ syntax ແລະບໍ່ມີຫຍັງອີກ. ຢ່າງໃດກໍຕາມ, ຫຼາຍ Control ອະນຸຍາດໃຫ້ເນື້ອຫາທີ່ບໍ່ແມ່ນຂໍ້ຄວາມ, ເຊັ່ນການຄວບຄຸມອື່ນໆ. ນີ້ແມ່ນຕົວຢ່າງທີ່ພວກເຮົາມີຂໍ້ຄວາມໃນສີທີ່ແຕກຕ່າງກັນພາຍໃນປຸ່ມດຽວກັນໂດຍໃຊ້ TextBlock Control ຫຼາຍອັນພາຍໃນປຸ່ມ:

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

property ຂອງເນື້ອຫາອະນຸຍາດໃຫ້ມີ child element ດຽວເທົ່ານັ້ນ, ດັ່ງນັ້ນພວກເຮົາໃຊ້ WrapPanel ເພື່ອບັນຈຸຂໍ້ຄວາມທີ່ມີສີແຕກຕ່າງກັນ. Panels, ເຊັ່ນ: WrapPanel, ມີບົດບາດສໍາຄັນໃນ WPF ແລະພວກເຮົາຈະປຶກສາຫາລືໃຫ້ພວກເຂົາໃນຫຼາຍລາຍລະອຽດຕໍ່ມາ - ໃນປັດຈຸບັນ, ໃຫ້ພິຈາລະນາໃຫ້ພວກເຂົາເປັນບ່ອນເກັບມ້ຽນສໍາລັບ Control ອື່ນໆ.

ຜົນໄດ້ຮັບດຽວກັນສາມາດເຮັດໄດ້ດ້ວຍ markup ດັ່ງຕໍ່ໄປນີ້, ເຊິ່ງແມ່ນພຽງອີກວິທີ ຂອງການຂຽນສິ່ງດຽວກັນ:

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

Code ປະທະກັບ XAML

ຫວັງວ່າຕົວຢ່າງຂ້າງເທິງສະແດງໃຫ້ເຈົ້າເຫັນວ່າ XAML ແມ່ນງ່າຍຕໍ່ການຂຽນແຕ່ວ່າມັນມີຫຼາຍວິທີທີ່ແຕກຕ່າງກັນໃນການເຮັດ ແລະ ຖ້າທ່ານຄິດວ່າຕົວຢ່າງຂ້າງເທິງນັ້ນມີຫຼາຍເຄື່ອງຫມາຍເພື່ອເຮັດໃຫ້ປຸ່ມມີຂໍ້ຄວາມໃນສີທີ່ແຕກຕ່າງກັນ, ຈາກນັ້ນ ລອງມາປຽບທຽບມັນກັບການເຮັດສິ່ງດຽວກັນໃນ 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);

ແນ່ນອນຕົວຢ່າງຂ້າງເທິງນີ້ອາດຈະຖືກຂຽນຫນ້ອຍລົງຢ່າງຊັດເຈນແລະນໍາໃຊ້ syntactical sugar ຫຼາຍຂຶ້ນ, ແຕ່ຂ້ອຍຄິດວ່າຈຸດຢືນຂອງ: XAML ແມ່ນສັ້ນແລະຊັດເຈນສໍາລັບການອະທິບາຍການໂຕ້ຕອບ.