XAML - การจัดการเหตุการณ์

แนวคิดทั่วไปของเหตุการณ์ใน XAML คล้ายกับเหตุการณ์ในภาษาโปรแกรมยอดนิยมอื่น ๆ เช่น. NET และ C ++ ใน XAML การควบคุมทั้งหมดจะเปิดเผยเหตุการณ์บางอย่างเพื่อให้สามารถสมัครรับข้อมูลตามวัตถุประสงค์เฉพาะได้

เมื่อใดก็ตามที่เกิดเหตุการณ์ขึ้นแอปพลิเคชันจะได้รับการแจ้งเตือนและโปรแกรมสามารถตอบสนองต่อเหตุการณ์นั้นได้เช่นปุ่มปิดใช้เพื่อปิดกล่องโต้ตอบ

มีเหตุการณ์หลายประเภทที่สามารถสมัครได้สำหรับพฤติกรรมที่แตกต่างกันของแอปพลิเคชันตามข้อกำหนดของแอปพลิเคชันนั้น ๆ แต่เหตุการณ์ที่ใช้บ่อยที่สุดคือเหตุการณ์ที่เกี่ยวข้องกับเมาส์และคีย์บอร์ดเช่น

• Click
• MouseDown
• MouseEnter
• MouseLeave
• MouseUp
• KeyDown
• KeyUp

ในบทนี้เราจะใช้เหตุการณ์พื้นฐานและใช้บ่อยที่สุดเพื่อทำความเข้าใจว่าเหตุการณ์ของการควบคุมที่เฉพาะเจาะจงสามารถเชื่อมโยงกับโค้ดที่อยู่เบื้องหลังการทำงานได้อย่างไรโดยขึ้นอยู่กับสิ่งที่ผู้ใช้ต้องการทำเมื่อเกิดเหตุการณ์เฉพาะ เกิดขึ้น

มาดูตัวอย่างง่ายๆของเหตุการณ์การคลิกปุ่ม ด้านล่างนี้คือการใช้งาน XAML สำหรับปุ่มควบคุมซึ่งสร้างและเริ่มต้นด้วยคุณสมบัติบางอย่างและเหตุการณ์คลิก (Click = "OnClick")

<Window x:Class = "XAMLEventHandling.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "MainWindow" Height = "350" Width = "604"> 
	
   <Grid> 
      <Button x:Name = "button1" Content = "Click" Click = "OnClick" 
         Width = "150" Height = "30" HorizontalAlignment = "Center" /> 
   </Grid>
   
</Window>

เมื่อใดก็ตามที่คลิกปุ่มนี้ปุ่มนี้จะเริ่มการทำงาน OnClickและคุณสามารถเพิ่มพฤติกรรมประเภทใดก็ได้เพื่อตอบสนองต่อการคลิก มาดูการใช้งานเหตุการณ์ OnClick ซึ่งจะแสดงข้อความเมื่อคลิกปุ่มนี้

using System; 
using System.Windows; 
using System.Windows.Controls;  

namespace XAMLEventHandling {
   /// <summary> 
      /// Interaction logic for MainWindow.xaml 
   /// </summary> 
	
   public partial class MainWindow : Window {
      public MainWindow() { 
         InitializeComponent(); 
      }
      private void OnClick(object sender, RoutedEventArgs e) { 
         MessageBox.Show("Button is clicked!"); 
      } 
   }
}

เมื่อคุณคอมไพล์และรันโค้ดด้านบนโค้ดดังกล่าวจะให้ผลลัพธ์ดังต่อไปนี้ -

เมื่อคุณคลิกที่ปุ่มเหตุการณ์คลิก (OnClick) จะเริ่มทำงานและข้อความต่อไปนี้จะปรากฏขึ้น

ตอนนี้เรามาดูตัวอย่างที่ซับซ้อนเล็กน้อยซึ่งมีการจัดการหลายเหตุการณ์

ตัวอย่าง

ตัวอย่างต่อไปนี้มีกล่องข้อความที่มี ContextMenu ซึ่งจัดการกับข้อความภายในกล่องข้อความ

โค้ด XAML ต่อไปนี้จะสร้างกล่องข้อความ, ContextMenu และ MenuItems ที่มีคุณสมบัติและเหตุการณ์บางอย่างเช่น Checked, Unchecked และ Click

<Window x:Class = "XAMLContextMenu.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "MainWindow" Height = "350" Width = "604"> 
	
   <Grid> 
      <TextBox Name = "textBox1" TextWrapping = "Wrap" Margin = "10" Grid.Row = "7"> 
         Hi, this is XAML tutorial. 
         <TextBox.ContextMenu>
         
            <ContextMenu>
               <MenuItem Header = "_Bold" IsCheckable = "True" 
                  Checked = "Bold_Checked" Unchecked = "Bold_Unchecked" /> 
               <MenuItem Header = "_Italic" IsCheckable = "True" 
                  Checked = "Italic_Checked" Unchecked = "Italic_Unchecked" /> 
               <Separator /> 
               <MenuItem Header = "Increase Font Size" Click = "IncreaseFont_Click" />
               <MenuItem Header = "_Decrease Font Size" Click = "DecreaseFont_Click" /> 
            </ContextMenu> 
				
         </TextBox.ContextMenu>
      </TextBox>
   </Grid> 
	
</Window>

นี่คือการนำไปใช้งานใน C # สำหรับเหตุการณ์ต่างๆซึ่งจะเริ่มทำงานเมื่อใดก็ตามที่มีการเลือกรายการเมนูไม่เลือกหรือคลิก

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data;  

namespace XAMLContextMenu { 
   /// <summary> 
      /// Interaction logic for MainWindow.xaml 
   /// </summary>
	
   public partial class MainWindow : Window {
      public MainWindow() { 
         InitializeComponent(); 
      }
      private void Bold_Checked(object sender, RoutedEventArgs e) { 
         textBox1.FontWeight = FontWeights.Bold; 
      }
      private void Bold_Unchecked(object sender, RoutedEventArgs e) { 
         textBox1.FontWeight = FontWeights.Normal; 
      }
      private void Italic_Checked(object sender, RoutedEventArgs e) { 
         textBox1.FontStyle = FontStyles.Italic; 
      }
      private void Italic_Unchecked(object sender, RoutedEventArgs e) { 
         textBox1.FontStyle = FontStyles.Normal; 
      }
      private void IncreaseFont_Click(object sender, RoutedEventArgs e) { 
         if (textBox1.FontSize < 18) { 
            textBox1.FontSize += 2; 
         } 
      }
      private void DecreaseFont_Click(object sender, RoutedEventArgs e) { 
         if (textBox1.FontSize > 10) { 
            textBox1.FontSize -= 2; 
         } 
      }
   }
}

เมื่อคุณคอมไพล์และรันโค้ดด้านบนโค้ดดังกล่าวจะให้ผลลัพธ์ดังต่อไปนี้ -

เราขอแนะนำให้คุณรันโค้ดตัวอย่างด้านบนและทดลองกับเหตุการณ์อื่น ๆ

เหตุการณ์

นี่คือเหตุการณ์ที่ใช้กันทั่วไปสำหรับการควบคุมต่างๆ

ซีเนียร์	การควบคุมและคำอธิบาย
1	Checked เริ่มทำงานเมื่อมีการเลือก ToggleButton (รับมาจาก ToggleButton)
2	Click เกิดขึ้นเมื่อคลิกปุ่มควบคุม (สืบทอดมาจาก ButtonBase)
3	ContextMenuClosing เกิดขึ้นก่อนเมนูบริบทใด ๆ ในองค์ประกอบจะปิด (สืบทอดมาจาก FrameworkElement)
4	ContextMenuOpening เกิดขึ้นเมื่อเมนูบริบทใด ๆ บนองค์ประกอบถูกเปิดขึ้น (สืบทอดมาจาก FrameworkElement)
5	DataContextChanged เกิดขึ้นเมื่อค่าของคุณสมบัติ FrameworkElement.DataContext เปลี่ยนแปลง (สืบทอดจาก FrameworkElement)
6	DragEnter เกิดขึ้นเมื่อระบบอินพุตรายงานเหตุการณ์ลากพื้นฐานโดยมีองค์ประกอบนี้เป็นเป้าหมาย (สืบทอดมาจาก UIElement)
7	DragLeave เกิดขึ้นเมื่อระบบอินพุตรายงานเหตุการณ์ลากพื้นฐานที่มีองค์ประกอบนี้เป็นต้นกำเนิด (รับมาจาก UIElement)
8	DragOver เกิดขึ้นเมื่อระบบอินพุตรายงานเหตุการณ์ลากที่อยู่ภายใต้องค์ประกอบนี้เป็นเป้าหมายการดร็อปที่เป็นไปได้ (รับมาจาก UIElement)
9	DragStarting เกิดขึ้นเมื่อเริ่มดำเนินการลาก (รับมาจาก UIElement)
10	DropCompleted เกิดขึ้นเมื่อการดำเนินการลากและวางสิ้นสุดลง (รับมาจาก UIElement)
11	DropDownClosed เกิดขึ้นเมื่อส่วนแบบเลื่อนลงของ ComboBox ปิดลง
12	DropDownOpened เกิดขึ้นเมื่อส่วนแบบเลื่อนลงของ ComboBox เปิดขึ้น
13	GotFocus เกิดขึ้นเมื่อ UIElement ได้รับโฟกัส (รับมาจาก UIElement)
14	Holding เกิดขึ้นเมื่อการโต้ตอบ Hold ที่ไม่ได้จัดการเกิดขึ้นในพื้นที่ทดสอบ Hit ขององค์ประกอบนี้ (รับมาจาก UIElement)
15	Intermediate จะเริ่มทำงานเมื่อสถานะของ ToggleButton ถูกเปลี่ยนเป็นสถานะไม่แน่นอน (รับมาจาก ToggleButton)
16	IsEnabledChanged เกิดขึ้นเมื่อคุณสมบัติ IsEnabled เปลี่ยนแปลง (สืบทอดมาจากการควบคุม)
17	KeyDown เกิดขึ้นเมื่อกดแป้นคีย์บอร์ดในขณะที่ UIElement มีโฟกัส (รับมาจาก UIElement)
18	KeyUp เกิดขึ้นเมื่อปล่อยปุ่มคีย์บอร์ดในขณะที่ UIElement มีโฟกัส (รับมาจาก UIElement)
19	LostFocus เกิดขึ้นเมื่อ UIElement สูญเสียโฟกัส (รับมาจาก UIElement)
20	ManipulationCompleted เกิดขึ้นเมื่อการจัดการบน UIElement เสร็จสมบูรณ์ (รับมาจาก UIElement)
21	ManipulationDelta เกิดขึ้นเมื่ออุปกรณ์อินพุตเปลี่ยนตำแหน่งระหว่างการปรับแต่ง (รับมาจาก UIElement)
22	ManipulationInertiaStarting เกิดขึ้นเมื่ออุปกรณ์อินพุตสูญเสียการติดต่อกับออบเจ็กต์ UIElement ระหว่างการปรับแต่งและความเฉื่อยเริ่มต้นขึ้น (รับมาจาก UIElement)
23	ManipulationStarted เกิดขึ้นเมื่ออุปกรณ์อินพุตเริ่มการจัดการกับ UIElement (รับมาจาก UIElement)
24	ManipulationStarting เกิดขึ้นเมื่อตัวประมวลผลการจัดการถูกสร้างขึ้นครั้งแรก (รับมาจาก UIElement)
25	SelectionChanged เกิดขึ้นเมื่อการเลือกข้อความมีการเปลี่ยนแปลง
26	SizeChanged เกิดขึ้นเมื่อคุณสมบัติ ActualHeight หรือ ActualWidth เปลี่ยนค่าบน FrameworkElement (สืบทอดจาก FrameworkElement)
27	Unchecked เกิดขึ้นเมื่อไม่ได้เลือก ToggleButton (รับมาจาก ToggleButton)
28	ValueChanged เกิดขึ้นเมื่อค่าช่วงเปลี่ยนไป (รับมาจาก RangeBase)