Search code examples
wpfxamlcontroltemplatedatatrigger

Datatrigger Change ImageBrush source


Currently am working on a reversi game and this is the ControlTemplate for a Stone on the board , Am using a DataTrigger to see who the Owner is for the Stone to set the button to the appropriate Image , But when I use TargetName on the setter (To the imagebrush wich is imga). I get an Error "Cannot find the Trigger target 'imga'. (The target must appear before any Setters, Triggers, or Conditions that use it.) "

but since I declared this brush before my setters this seems really strange to me. this code is in the app.xaml resources.

Thanks in advance

this is the relevant part of the button

 <Style x:Key="0" TargetType="{x:Type Button}">
        <Setter Property="Foreground" Value="White" />
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="Height" Value="48"/>
        <Setter Property="Width" Value="48" />
         <Setter Property="Template">

            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Ellipse>
                        <Ellipse.Fill x:Uid="filler">
                            <ImageBrush x:Name="imga" ImageSource="afbeeldingen/vuur.jpg"/>

                        </Ellipse.Fill>
                    </Ellipse>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="#E59400" />

                        </Trigger>

                        <DataTrigger Binding="{Binding Owner.Value.ArrayIndex}" Value="0">
                            <DataTrigger.Setters>

                                <Setter TargetName="imga" Property="ImageSource" Value="afbeeldingen/vuur.jpg" />


                            </DataTrigger.Setters>
                        </DataTrigger>

Solution

  • imga is not a part of your Template, it is a resource, so you cannot change its properties from a trigger. What you have to do is change the Fill property from you Ellipse instead. You would have Something like this :

    <ControlTemplate TargetType="{x:Type Button}">
        <Ellipse x:Name="myEllipse">
            <Ellipse.Fill x:Uid="filler">
                <ImageBrush x:Name="imga" ImageSource="afbeeldingen/vuur.jpg"/>
            </Ellipse.Fill>
        </Ellipse>
    
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="#E59400" />
            </Trigger>
    
            <DataTrigger Binding="{Binding Owner.Value.ArrayIndex}" Value="0">
                <DataTrigger.Setters>
                    <Setter TargetName="myEllipse" Property="Fill">
                        <Setter.Value>
                            <ImageBrush x:Name="imga" ImageSource="afbeeldingen/vuur.jpg"/>
                        </Setter.Value>
                    </Setter>
                </DataTrigger.Setters>
            </DataTrigger>