WPF: affect border from style triggers

Question

I'm creating my own radiobuttons. I just want to change the graphics of it. They look as they want them to look but I'm unable to change the look of the IsChecked one ... This is what I have so far

<RadioButton x:Class="gMaterialWPF.MaterialRadioButton" [....]>
    <RadioButton.Style>
        <Style TargetType="{x:Type RadioButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type RadioButton}">
                        <Border x:Name="backPanel" 
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="10">

                        <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                          Content="{TemplateBinding Content}"
                                          />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="True">
                    <Setter Property="Background" Value="Red"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </RadioButton.Style>
</RadioButton>

The problem is how to access the backPannel to change the color from the <Trigger Property="IsChecked" ??? I tried with TargetName but it cannot find the panel over there :(

Answer 1

I tried with TargetName but it cannot find the panel over there :(

You need to move the trigger to the ControlTemplate if you want to be able to reference the Border element using the TargetName property:

<Style TargetType="{x:Type RadioButton}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RadioButton}">
                <Border x:Name="backPanel" 
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="10">

                    <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                          Content="{TemplateBinding Content}"
                                          />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter TargetName="backPanel" Property="Background" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

But since you have bound the Background property of the Border element to the Background property of the RadioButton using a TemplateBinding in your example, you don't really have to use a TargetName.