UWP style trigger missing

Question

It seems that UWP XAML doesn't support triggers in styles. What is the common workaround to accomplish triggers like the following?

<Style TargetType="Button">
    <Style.Triggers>
        <Trigger Property="Visibility" Value="Collapsed">
            <Setter Property="Text" Value="" />
        </Trigger>
    </Style.Triggers>
</Style>

At the moment I see the following options to accomplish triggers in UWP:

Use Animations or VisualStateTriggers. Both seem to be wrong if I use them not to adjust the controls to the screen.

---

I think I found the correct way to implement Triggers in general for Controls. See the below code as demonstration:

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

<Border x:Name="BackgroundElement" Tag="Text">
    <Interactivity:Interaction.Behaviors>
        <Core:DataTriggerBehavior Binding="{Binding Tag, ElementName=BackgroundElement}" Value="Text">
            <Core:ChangePropertyAction PropertyName="BorderBrush" Value="AliceBlue" />
        </Core:DataTriggerBehavior>
    </Interactivity:Interaction.Behaviors>
</Border>

It would be awesome if there is a solution without ElementName. I would have done this in WPF with AncestorType, but that's missing in UWP too. Anyway, it seems that you can't use the Core:DataTriggerBehavior in styles.

Answer 1

In WinRT, RelativeSourceMode only support Self and TemplatedParent mode, FindAncestor is not available. So when you use XAML Behaviors, you need to use ElementName as a workaround. And if you are using DataContext or ViewModel in your project, you can bind to the DataContext or ViewModel to avoid using ElementName. For example:

<Page ...>
    <Page.Resources>
        <local:MyViewModel x:Key="ViewModel" />
    </Page.Resources>
    ...
    <Border x:Name="BackgroundElement" DataContext="{Binding Source={StaticResource ViewModel}}">
        <Interactivity:Interaction.Behaviors>
            <Core:DataTriggerBehavior Binding="{Binding Tag}" Value="Text">
                <Core:ChangePropertyAction PropertyName="Background" Value="Red" />
            </Core:DataTriggerBehavior>
        </Interactivity:Interaction.Behaviors>
    </Border>
    ...
</Page>

And the ViewModel used above:

public class MyViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private string _tag;

    public string Tag
    {
        get
        {
            return _tag;
        }

        set
        {
            _tag = value;
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs("Tag"));
            }
        }
    }
}