Val
Val

Reputation: 1832

Disable ToggleButton selection color

How can I stop my ToggleButton from changing its color when I hover or press it? It keeps getting the Windows' selection color on those events. I've tried setting the Foreground and Background colors explicitly but it doesn't help.

<ToggleButton 
    Canvas.Left="20" Canvas.Top="20"
    Width="200" Height="150"
    BorderBrush="Red" BorderThickness="5">
Click Me
</ToggleButton>

After starting the app the colors are as defined by me:

enter image description here

On mouse click the colors become blue:

enter image description here

Upvotes: 2

Views: 2727

Answers (2)

Val
Val

Reputation: 1832

Thanks to ASh's hint I googled how to change the button's controltemplate style and it works fine now (this code added right into the ToggleButton element):

<ToggleButton.Style>
    <Style TargetType="{x:Type ToggleButton}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Border BorderThickness="5" BorderBrush="Red" Background="Gray">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsChecked" Value="True">
                <Setter Property="Background" Value="White" />
            </Trigger>
        </Style.Triggers>
    </Style>
</ToggleButton.Style>

Upvotes: 2

mm8
mm8

Reputation: 169420

Modify the template of the Button a bit my removing some triggers from it:

<Button Canvas.Left="20" Canvas.Top="20"
        Width="200" Height="150"
        BorderBrush="Red" BorderThickness="5" Content="Click Me">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsDefaulted" Value="true">
                    <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                </Trigger>
                <!--<Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
                            <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
                        </Trigger>-->
                <Trigger Property="IsEnabled" Value="false">
                    <Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/>
                    <Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/>
                    <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
</Button>

Upvotes: 0

Related Questions