Trigger element (XAML) is not supported in a UWP p

问题:

I'm developing a Universal Windows application for Windows 10 and one of the first things I found is that the Trigger element (XAML) is not supported when styling images. Here is the code I am trying to implement:

Sorry I had to use an image here, I am getting it from my VM.

How is this type of trigger implemented now in a Universal Windows App?

回答1:

No, you don't have Trigger support in UWP.

A workaround is to use DataTriggerBehavior with a ChangePropertyAction to accomplish the exact same thing.

  xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
  xmlns:Core="using:Microsoft.Xaml.Interactions.Core" 

<Button x:Name="MyButton" Width="140" Height="80" IsEnabled="False">
    <Image x:Name="MyImage" Source="Assets/xxx.jpg">
        <Interactivity:Interaction.Behaviors>
            <Core:DataTriggerBehavior Binding="{Binding IsEnabled, ElementName=MyButton}" Value="False">
                <Core:ChangePropertyAction TargetObject="{Binding ElementName=MyImage}" PropertyName="Opacity" Value="0.5" />
            </Core:DataTriggerBehavior>
        </Interactivity:Interaction.Behaviors>
    </Image>
</Button>

Note that you will need to include BehaviorsXamlSDKManaged from C:\Program Files (x86)\Microsoft SDKs\Windows\v8.1\ExtensionSDKs\BehaviorsXamlSDKManaged\12.0\. You will get a warning when you add the reference but just ignore it.

Update: You should be getting an updated Behavior SDK from nuget now.

---

Option 2

You can always do the same thing in VisualStateManager. Open Blend and right click on your Button and select Edit Template, Edit a Copy and then specify the resource name you want and hit OK.

Then look for the Disabled VisualState and replace it with

<VisualState x:Name="Disabled">
    <VisualState.Setters>
        <Setter Target="RootGrid.(UIElement.Opacity)" Value="0.5" />
    </VisualState.Setters>
</VisualState>

回答2:

Alternatively you can use the namespaces

xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:Core="using:Microsoft.Xaml.Interactions.Core"

with

<ToggleButton Content="Execute"
              IsChecked="{Binding ButtonIndicator}"
              FontSize="8">
   <Interactivity:Interaction.Behaviors>
        <Core:EventTriggerBehavior EventName="Checked">
            <Core:InvokeCommandAction Command="{Binding ExecuteCommand}" />
        </Core:EventTriggerBehavior>
   </Interactivity:Interaction.Behaviors>
</ToggleButton>