XAML - Trình kích hoạt

Về cơ bản, trình kích hoạt cho phép bạn thay đổi giá trị thuộc tính hoặc thực hiện các hành động dựa trên giá trị của thuộc tính. Vì vậy, về cơ bản, nó cho phép bạn thay đổi động diện mạo và / hoặc hành vi của điều khiển của bạn mà không cần phải tạo mới.

Trình kích hoạt được sử dụng để thay đổi giá trị của bất kỳ thuộc tính nhất định nào, khi một số điều kiện được thỏa mãn. Các trình kích hoạt thường được xác định trong một kiểu hoặc trong thư mục gốc của tài liệu được áp dụng cho điều khiển cụ thể đó. Có ba loại trình kích hoạt -

Kích hoạt thuộc tính
Kích hoạt dữ liệu
Trình kích hoạt sự kiện

Kích hoạt thuộc tính

Trong trình kích hoạt thuộc tính, khi một thay đổi xảy ra trong một thuộc tính, nó sẽ mang lại thay đổi ngay lập tức hoặc thay đổi động trong thuộc tính khác. Ví dụ: bạn có thể sử dụng trình kích hoạt thuộc tính nếu bạn muốn thay đổi giao diện của nút khi chuột ở trên nút.

Thí dụ

Ví dụ sau minh họa cách thay đổi màu nền trước của một nút khi chuột vào vùng của nó.

<Window x:Class = "XAMLPropertyTriggers.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">
	
   <Window.Resources>
      <Style x:Key = "TriggerStyle" TargetType = "Button">
         <Setter Property = "Foreground" Value = "Blue" />
         <Style.Triggers>
            <Trigger Property = "IsMouseOver" Value = "True">
               <Setter Property = "Foreground" Value = "Green" />
            </Trigger> 
         </Style.Triggers>
      </Style>
   </Window.Resources>
	
   <Grid>
      <Button Width = "100" Height = "70" Style = "{StaticResource TriggerStyle}" 
         Content = "Trigger"/>
   </Grid>
	
</Window>

Khi bạn biên dịch và thực thi đoạn mã trên, nó sẽ tạo ra kết quả sau:

Khi chuột vào vùng nút, màu nền trước sẽ chuyển thành màu xanh lục.

Kích hoạt dữ liệu

Trình kích hoạt dữ liệu thực hiện một số hành động khi dữ liệu liên kết thỏa mãn một số điều kiện. Hãy xem đoạn mã XAML sau, trong đó hộp kiểm và khối văn bản được tạo với một số thuộc tính. Khi hộp kiểm được chọn, nó sẽ thay đổi màu nền trước thành màu đỏ.

<Window x:Class = "XAMLDataTrigger.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   Title = "Data Trigger" Height = "350" Width = "604">
	
   <StackPanel HorizontalAlignment = "Center">
      <CheckBox x:Name = "redColorCheckBox" Content = "Set red as foreground color" Margin = "20"/>
		
      <TextBlock Name = "txtblock" VerticalAlignment = "Center" 
         Text = "Event Trigger" FontSize = "24" Margin = "20">
         <TextBlock.Style>
            <Style>
               <Style.Triggers>
                  <DataTrigger Binding = "{Binding ElementName = redColorCheckBox, Path = IsChecked}" 
                     Value = "true">
                     <Setter Property = "TextBlock.Foreground" Value = "Red"/>
                     <Setter Property = "TextBlock.Cursor" Value = "Hand" />
                  </DataTrigger>
               </Style.Triggers>
            </Style>
         </TextBlock.Style>
      </TextBlock>
   </StackPanel>
	
</Window>

Khi bạn biên dịch và thực thi đoạn mã trên, nó sẽ tạo ra kết quả sau:

Khi hộp kiểm được chọn, màu nền trước của khối văn bản sẽ chuyển thành màu đỏ.

Trình kích hoạt sự kiện

Trình kích hoạt sự kiện thực hiện một số hành động khi một sự kiện cụ thể được kích hoạt. Nó thường được sử dụng để thực hiện một số hoạt ảnh như DoubleAnimation, ColorAnimation, v.v. Khối mã sau tạo một nút đơn giản. Khi sự kiện nhấp chuột được kích hoạt, nó sẽ mở rộng chiều rộng và chiều cao của nút.

<Window x:Class = "XAMLEventTrigger.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 Content = "Click Me" Width = "60" Height = "30">
         <Button.Triggers>
            <EventTrigger RoutedEvent = "Button.Click">
               <EventTrigger.Actions>
                  <BeginStoryboard>
                     <Storyboard>
                     
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty = "Width" Duration = "0:0:4">
                           <LinearDoubleKeyFrame Value = "60" KeyTime = "0:0:0"/>
                           <LinearDoubleKeyFrame Value = "120" KeyTime = "0:0:1"/>
                           <LinearDoubleKeyFrame Value = "200" KeyTime = "0:0:2"/>
                           <LinearDoubleKeyFrame Value = "300" KeyTime = "0:0:3"/>
                        </DoubleAnimationUsingKeyFrames>
							
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty = "Height" Duration = "0:0:4">
                           <LinearDoubleKeyFrame Value = "30" KeyTime = "0:0:0"/>
                           <LinearDoubleKeyFrame Value = "40" KeyTime = "0:0:1"/>
                           <LinearDoubleKeyFrame Value = "80" KeyTime = "0:0:2"/>
                           <LinearDoubleKeyFrame Value = "150" KeyTime = "0:0:3"/>
                        </DoubleAnimationUsingKeyFrames>
							
                     </Storyboard>
                  </BeginStoryboard>
               </EventTrigger.Actions>
            </EventTrigger>
         </Button.Triggers>
      </Button>
   </Grid>
</Window>

Khi bạn biên dịch và thực thi đoạn mã trên, nó sẽ tạo ra kết quả sau:

Bây giờ, hãy nhấp vào nút và bạn sẽ thấy rằng nó sẽ bắt đầu mở rộng theo cả hai chiều.