WPF - Trigger

Fondamentalmente, un trigger consente di modificare i valori delle proprietà o eseguire azioni in base al valore di una proprietà. Quindi, ti consente di modificare dinamicamente l'aspetto e / o il comportamento del tuo controllo senza doverne creare uno nuovo.

I trigger vengono utilizzati per modificare il valore di una determinata proprietà, quando determinate condizioni sono soddisfatte. I trigger sono generalmente definiti in uno stile o nella radice di un documento che vengono applicati a quel controllo specifico. Esistono tre tipi di trigger:

• Trigger di proprietà
• Trigger di dati
• Trigger di eventi

Trigger di proprietà

Nei trigger di proprietà, quando si verifica una modifica in una proprietà, verrà apportata una modifica immediata o animata in un'altra proprietà. Ad esempio, è possibile utilizzare un trigger di proprietà per modificare l'aspetto di un pulsante quando il mouse passa sopra il pulsante.

Il codice di esempio seguente mostra come modificare il colore di primo piano di un pulsante quando il mouse passa sopra il pulsante.

<Window x:Class = "WPFPropertyTriggers.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>

Quando compili ed esegui il codice sopra, produrrà la seguente finestra:

Quando il mouse passa sopra il pulsante, il colore di primo piano diventerà verde.

Trigger di dati

Un trigger di dati esegue alcune azioni quando i dati associati soddisfano alcune condizioni. Diamo un'occhiata al seguente codice XAML in cui vengono creati una casella di controllo e un blocco di testo con alcune proprietà. Quando la casella di controllo è selezionata, cambierà il colore di primo piano in rosso.

<Window x:Class = "WPFDataTrigger.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>

Quando il codice precedente viene compilato ed eseguito, produrrà il seguente output:

Quando spunti la casella di controllo, il blocco di testo cambierà il suo colore di primo piano in rosso.

Trigger di eventi

Un trigger di evento esegue alcune azioni quando viene generato un evento specifico. Di solito viene utilizzato per realizzare alcune animazioni su controlli come DoubleAnumatio, ColorAnimation, ecc. Nell'esempio seguente, creeremo un semplice pulsante. Quando viene generato l'evento clic, espanderà la larghezza e l'altezza del pulsante.

<Window x:Class = "WPFEventTrigger.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>

Quando compili ed esegui il codice sopra, produrrà la seguente finestra:

Facendo clic sul pulsante, osserverai che inizierà ad espandersi in entrambe le dimensioni.

Si consiglia di compilare ed eseguire gli esempi precedenti e di applicare i trigger anche ad altre proprietà.