Storyboard not executing from ControlTemplate DataTrigger

Question

I have a ToggleButton which I click to popup a FlowDocumentReader as an Adorner. This FlowDocument is part of a ControlTemplate with a DataTrigger to show/hide the element.

Using the following Trigger everything works fine. I use a DataTrigger and some Setters, my element displays correctly with Height and Width I provide when I check my ToggleButton:

<ControlTemplate.Triggers>
    <DataTrigger Binding="{Binding ElementName=adorner, Path=AdornedElement.IsChecked}" Value="True" >
        <Setter TargetName="mainBorder" Property="Height" Value="437"></Setter>
        <Setter TargetName="mainBorder" Property="Width" Value="537"></Setter>
    </DataTrigger>
</ControlTemplate.Triggers>

I want to have some animation that occurs as my element appears, so I tried to used a Storyboard. This doesn't work, nothing seems to happen:

<ControlTemplate.Triggers>
    <DataTrigger Binding="{Binding ElementName=adorner, Path=AdornedElement.IsChecked}" Value="True" >
        <DataTrigger.EnterActions>
            <BeginStoryboard>
                <Storyboard Storyboard.TargetName="mainBorder">
                    <DoubleAnimation Duration="0:0:0.2" Storyboard.TargetProperty="Width"  To="537" />
                    <DoubleAnimationUsingKeyFrames BeginTime="0:0:0.2" Duration="0:0:0.3" Storyboard.TargetProperty="Height">
                        <LinearDoubleKeyFrame Value="417" KeyTime="0:0:0.2" />
                        <LinearDoubleKeyFrame Value="437" KeyTime="0:0:0.24" />
                        <LinearDoubleKeyFrame Value="417" KeyTime="0:0:0.3" />
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </DataTrigger.EnterActions>
        <DataTrigger.ExitActions>
            <BeginStoryboard>
                <Storyboard Storyboard.TargetName="mainBorder">
                    <DoubleAnimationUsingKeyFrames Duration="0:0:0.2" Storyboard.TargetProperty="Width">
                        <LinearDoubleKeyFrame Value="0" KeyTime="0:0:0.2" />
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames BeginTime="0:0:0.2" Duration="0:0:0.2" Storyboard.TargetProperty="Height">
                        <LinearDoubleKeyFrame Value="0" KeyTime="0:0:0.2" />
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </DataTrigger.ExitActions>
    </DataTrigger>
</ControlTemplate.Triggers>

Is the Storyboard context completely different than the Setter? Why does it work in one place, but not the other?

Oddly enough, when I make this change, it causes a binding error to display in the Output Window. I haven't touched the actual binding for the DataTrigger, just the contents:

System.Windows.Data Error: 4 : Cannot find source for binding with reference 'ElementName=adorner'. BindingExpression:Path=AdornedElement.IsChecked; DataItem=null; target element is 'Control' (Name=''); target property is 'NoTarget' (type 'Object')

Here is a general idea of the rest of the template:

<ControlTemplate x:Key="LocalHelpWindow">
    <Grid>
        <Grid.RowDefinitions>
        ...
        </Grid.RowDefinitions>
        <help:AdornedPlaceholder x:Name="adorner" Grid.Row="0"/>
        <Border Grid.Row="1"  x:Name="mainBorder">
            ...
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <DataTrigger Binding="{Binding ElementName=adorner, Path=AdornedElement.IsChecked}" Value="True" >
            ...
        </DataTrigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

neptunao neptunao · Accepted Answer · 2014-01-24T13:39:20

I think in your case you should use Trigger instead of DataTrigger. DataTrigger is using to bind to some data in DataContext of element in which DataTemplate was applied.

I suggest you try to use Trigger in that way:

<Trigger SourceName="adorner" Property="AdornedElement.IsChecked" Value="True">
    ...
</Trigger>

Storyboard not executing from ControlTemplate DataTrigger

1 Answers