WPF DataTrigger cannot find Trigger Target

Question

<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid x:Name="grid">
            <Grid.Background>
                <SolidColorBrush x:Name="backgroundBrush" Color="Transparent" Opacity="0.1"/>
            </Grid.Background>
        </Grid>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding IsExpanded}" Value="True">
                <Setter TargetName="backgroundBrush" Property="Color" Value="Green" />
            </DataTrigger>
            <Trigger SourceName="grid" Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="backgroundBrush"
                                 Storyboard.TargetProperty="Color"
                                 To="White" Duration="0:0:1.5"/>
                         </Storyboard>
                    </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="backgroundBrush"
                                Storyboard.TargetProperty="Color"
                                AccelerationRatio="1" Duration="0:0:1.5" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.ExitActions> 
            </Trigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</ListBox.ItemTemplate>

Doesn't compile with error 'Cannot find the trigger target 'backgroundBrush'.'

If I remove the DataTrigger it will compile and work. If I change the DataTrigger to use TargetName="grid" Property="Background" it will compile and work (but without the desired opacity).

Where am I going wrong?

Answer 1

While I'm not sure why the brush isn't in the namescope, you can do this by swapping out the brush, and "dotting-down" to the Color property of the background brush in the animations like so:

<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid x:Name="grid">
            <Grid.Background>
                <SolidColorBrush Color="Transparent" Opacity="0.1"/>
            </Grid.Background>
        </Grid>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding IsExpanded}" Value="True">
                <Setter TargetName="grid" Property="Background">
                    <Setter.Value>
                        <SolidColorBrush Color="Green" Opacity="0.1"/>
                    </Setter.Value>
                </Setter>
            </DataTrigger>
            <Trigger SourceName="grid" Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="grid"
                             Storyboard.TargetProperty="Background.Color"
                             To="White" Duration="0:0:1.5"/>
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetName="grid"
                            Storyboard.TargetProperty="Background.Color"
                            AccelerationRatio="1" Duration="0:0:1.5" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.ExitActions>
            </Trigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</ListBox.ItemTemplate>