Home > Net >  Change Button FontWeight and/or FontStyle on mouseover
Change Button FontWeight and/or FontStyle on mouseover

Time:11-08

I want to create a button that dynamically changes it's style upon MouseOver. I want to change, Foreground, Background, Border, FontWeight, and/or FontStyle. I have the following XAML in my Window.Resources...

<Window.Resources>
    <Style TargetType="Button" x:Key="mouseOverStyle">
        <Setter Property="Foreground" Value="#FF808080" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="TextBlock.FontWeight" Value="Normal" />
        <Setter Property="TextBlock.FontStyle" Value="Normal" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button" >
                    <Border x:Name="Border" Background="{TemplateBinding Background}"  BorderBrush="Transparent" BorderThickness="2" >
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    </Border>
                    <ControlTemplate.Triggers >
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Foreground" Value="White" />
                            <Setter Property="Background" Value="#FF303030" />
                            <Setter Property="TextBlock.FontWeight" Value="Bold" />
                            <Setter Property="TextBlock.FontStyle" Value="Italic" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>

On MouseOver, the Background, Foreground, and Border attributes correctly change. But, the FontWeight and FontStyle do not change.

Please tell me what I am missing, or what I need to change. Thanks.

CodePudding user response:

Given the way you are defining the Style you need to explicitly tell the Button which style to use, as per:

<Button Style="{StaticResource mouseOverStyle}" />

There are alternatives you can use that will implicitly tell all Controls within the application to have a style applied to them. Let us know and the answer can be extended to include this method as an alternative.

CodePudding user response:

Actually... never mind.

It does work.

I was stupidly redefining the FontWeight and FontStyle in the subsequent Button definition. Once I removed that, the dynamic behavior worked exactly as I wanted.

  • Related