Question

I am trying to create a simple (I think) animation effect based on a property change in my ViewModel. I would like the target to be a specific textblock in the control template of a custom control, which inherits from Window.

From the article examples I’ve seen, a DataTrigger is the easiest way to accomplish this. It appears that Window.Triggers doesn’t support DataTriggers, which led me to try to apply the trigger in the style. The problem I am currently having is that I can’t seem to target the TextBlock (or any other child control)–what happens is which the code below is that the animation is applied to the background of the whole window.

If I leave off StoryBoard.Target completely, the effect is exactly the same.

Is this the right approach with the wrong syntax, or is there an easier way to accomplish this?

<Style x:Key="MyWindowStyle" TargetType="{x:Type Window}">
    <Setter Property="Template" Value="{StaticResource MyWindowTemplate}"/>
    <Style.Triggers>
        <DataTrigger Binding="{Binding ChangeOccurred}" Value="True">
            <DataTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard BeginTime="00:00:00" Duration="0:0:2" Storyboard.Target="{Binding RelativeSource={RelativeSource AncestorType=TextBlock}}"
                                    Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
                        <ColorAnimation FillBehavior="Stop" From="Black" To="Red" Duration="0:0:0.5" AutoReverse="True"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>
    </Style.Triggers>
</Style>

Update

Should have also mentioned that I tried to name the TextBlock and reference it via StoryBoard.TargetName (as Timores suggested), and got the error “TargetName property cannot be set on a Style Setter.”

Answer 1

EDIT: I have overseen the fact that the TextBlock is in the ControlTemplate of your custom Window/Control. I do not think that it is possible to target a control within the ControlTemplate from a Storyboard outside of this ControlTemplate. You could however define a property on your custom Window which you then databind to your ChangeOccurred property, and then add the trigger to your ControlTemplate which will now get triggered by the custom Control’s property rather than the Window’s ViewModel’s property (of course, indirectly it is triggered by the ViewModel because ChangeOccurred is bound to the property of the custom Window which in turn triggers the animation – uh, complex sentence, hope you understand). Is this an option? Could you follow? 😉

Maybe some code helps:

public class MyCustomWindow : Window
{
    public static readonly DependencyProperty ChangeOccurred2 = DependencyProperty.Register(...);

    public bool ChangeOccurred2 { ... }

    // ...
}

And some XAML:

<local:MyCustomWindow ChangeOccurred2="{Binding ChangeOccurred}" ... >
    <!-- Your content here... -->
</local:MyCustomWindow>

<!-- Somewhere else (whereever your ControlTemplate is defined) -->
<ControlTemplate TargetType="{x:Type local:MyCustomWindow}">

    <!-- your template here -->

    <ControlTemplate.Triggers>
        <Trigger Property="ChangeOccurred2" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard BeginTime="00:00:00" Duration="0:0:2"
                                Storyboard.TargetName="txtWhatever"
                                Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
                        <ColorAnimation FillBehavior="Stop"
                                        From="Black" To="Red"
                                        Duration="0:0:0.5"
                                        AutoReverse="True"/>
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

Note: I named the Window’s property ChangeOccurred2 because I wanted it to be distinguishable from the ViewModel’s ChangeOccurred property. Of course, you should choose a better name for this property. However, I am missing the background for such a decision.

---

My old answer:

So, you want to animate a TextBlock which is in the content of a (custom) Window?!

Why do you want to set the style on the Window, and not on the TextBlock itself? Maybe you should try something like this (did not test this!):

<local:MyCustomWindow ... >
    <!-- ... -->
    <TextBlock x:Name="textBlockAnimated" ... >
        <TextBlock.Style>
            <Style TargetType="{x:Type TextBlock}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ChangeOccurred}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard BeginTime="00:00:00" Duration="0:0:2"
                                            Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
                                    <ColorAnimation FillBehavior="Stop"
                                                    From="Black" To="Red"
                                                    Duration="0:0:0.5"
                                                    AutoReverse="True"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TextBlock.Style>
    </TextBlock>
    <!-- ... -->
</local:MyCustomWindow>

The {Binding ChangeOccurred} might not be sufficient. You might have to add a DataContext to the TextBlock, or add a RelativeSource or something.