XAML - wyzwalacze
Zasadniczo wyzwalacz umożliwia zmianę wartości właściwości lub podjęcie działań na podstawie wartości właściwości. Tak więc w zasadzie pozwala dynamicznie zmieniać wygląd i / lub zachowanie twojego elementu sterującego bez konieczności tworzenia nowego.
Wyzwalacze służą do zmiany wartości dowolnej właściwości, gdy spełnione są określone warunki. Wyzwalacze są zwykle definiowane w stylu lub w katalogu głównym dokumentu, które są stosowane do tej konkretnej kontrolki. Istnieją trzy rodzaje wyzwalaczy -
- Wyzwalacze właściwości
- Wyzwalacze danych
- Wyzwalacze zdarzeń
Wyzwalacze właściwości
W wyzwalaczach właściwości, gdy zmiana nastąpi w jednej właściwości, przyniesie natychmiastową lub animowaną zmianę w innej właściwości. Na przykład, możesz użyć wyzwalacza właściwości, jeśli chcesz zmienić wygląd przycisku, gdy wskaźnik myszy znajduje się nad przyciskiem.
Przykład
Poniższy przykład ilustruje, jak zmienić kolor pierwszego planu przycisku, gdy mysz przechodzi do jego regionu.
<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>
Kiedy kompilujesz i wykonujesz powyższy kod, wygeneruje on następujący wynik -
Gdy mysz wejdzie w obszar przycisku, kolor pierwszego planu zmieni się na zielony.
Wyzwalacze danych
Wyzwalacz danych wykonuje jakąś akcję, gdy powiązane dane spełniają jakiś warunek. Przyjrzyjmy się poniższemu kodowi XAML, w którym pole wyboru i blok tekstu są tworzone z niektórymi właściwościami. Zaznaczenie tego pola spowoduje zmianę koloru pierwszego planu na czerwony.
<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>
Kiedy kompilujesz i wykonujesz powyższy kod, wygeneruje on następujący wynik -
Gdy pole wyboru jest zaznaczone, kolor pierwszego planu bloku tekstu zmieni się na czerwony.
Wyzwalacze zdarzeń
Wyzwalacz zdarzenia wykonuje jakąś akcję, gdy uruchamiane jest określone zdarzenie. Zwykle jest używany do wykonywania niektórych animacji, takich jak DoubleAnimation, ColorAnimation itp. Poniższy blok kodu tworzy prosty przycisk. Uruchomione zdarzenie kliknięcia spowoduje rozszerzenie szerokości i wysokości przycisku.
<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>
Kiedy kompilujesz i wykonujesz powyższy kod, wygeneruje on następujący wynik -
Teraz kliknij przycisk, a zobaczysz, że zacznie się on rozszerzać w obu wymiarach.