Question

I have a custom made User control with a button within it. I have various XAMLs using this control, but in one of the XAMLs I would like to have the button have an image on it. This works well, but I cannot seem to get the border of the button to disappear. I am able to set the background color, border thickness, and various other properties but no matter what I do I can’t get rid of the border. I’ve looked at various SO topics on how to use styles to override the template but that doesn’t seem to help me either. Below is the last piece of snippet that I tried to no avail.

<Style TargetType="{x:Type CustomButton}" x:Key="btnnoborder">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type CustomButton}">
                <Border Background="Transparent">
                    <ContentPresenter/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

EDIT

I’ve attached small images of what I see when I test out any of these snippets

(Usual button)

(Button after using Viktor La Croix’s XAML)

Answer 1

I wasn’t going to answer this, but did you run it? Are you sure it’s not only in designtime? I used your style and it works fine. No border at runtime. At designtime I see border of button itself and image within that button.

My custom style:

    <UserControl.Resources>
    <Style x:Key="ButtonStyle2" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Rectangle/>
                        <ContentPresenter HorizontalAlignment="Left" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="11,7,0,9"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsFocused" Value="True"/>
                        <Trigger Property="IsDefaulted" Value="True"/>
                        <Trigger Property="IsMouseOver" Value="True"/>
                        <Trigger Property="IsPressed" Value="True"/>
                        <Trigger Property="IsEnabled" Value="False"/>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>

    <Button Style="{StaticResource ButtonStyle2}" Height="30" HorizontalAlignment="Left" Margin="782,211,0,0" Name="button5" VerticalAlignment="Top" Width="129">
        <Image Source="image.png"/>
    </Button>

And with your custom style it looks like this:

But it’s only at designtime. At runtime there is no border.

EDIT

If there is any border brush. It’s not within that button style.