Page 1 of 1

Focused button mouse-over state issue

Posted: 16 Jan 2019, 11:16
by Matso
Can I disable a mouse-over state on a focused button?

MK

Re: Focused button mouse-over state issue

Posted: 16 Jan 2019, 18:54
by sfernandez
The appearance of a control is determined by its ControlTemplate (set in the Template property), so you can tweak the look all you want. Read more about it in Styles and Templates tutorial.

For example, our internal style defines a default template for the Button like this:
<ControlTemplate x:Key="MyButtonTemplate" TargetType="{x:Type Button}">
    <Border x:Name="Bg"
        Background="{TemplateBinding Background}"
        BorderBrush="{TemplateBinding BorderBrush}"
        BorderThickness="{TemplateBinding BorderThickness}"
        Padding="{TemplateBinding Padding}"
        CornerRadius="1">
        <ContentPresenter
            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="BorderBrush" Value="{StaticResource OverBdBrush}"/>
            <Setter Property="Background" Value="{StaticResource OverBgBrush}"/>
            <Setter Property="Foreground" Value="{StaticResource OverFgBrush}"/>
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="BorderBrush" Value="{StaticResource PressBdBrush}"/>
            <Setter Property="Background" Value="{StaticResource PressBgBrush}"/>
            <Setter Property="Foreground" Value="{StaticResource OverFgBrush}"/>
        </Trigger>
        <Trigger Property="IsKeyboardFocused" Value="True">
            <Setter Property="BorderBrush" Value="{StaticResource FocusBdBrush}"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="BorderBrush" Value="{StaticResource DisabledBdBrush}"/>
            <Setter Property="Background" Value="{StaticResource DisabledBgBrush}"/>
            <Setter Property="Foreground" Value="{StaticResource DisabledFgBrush}"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
You can start from there and modify the setters for the IsKeyboardFocused trigger to adapt it to your needs.

Then you can use that template in any button like this:
<Button Template="{StaticResource MyButtonTemplate}" ... />

Re: Focused button mouse-over state issue

Posted: 17 Jan 2019, 09:48
by Matso
Can I disable/enable states of a button with trigger setters? I mean I would like to disable MouseOver state of a button when it enters Focused state, and enable it back when it leaves the state.

Re: Focused button mouse-over state issue

Posted: 17 Jan 2019, 10:03
by sfernandez
You can use MultiTrigger to change appearance of the Button when IsMouseOver=True but only if IsKeyboardFocused=False:
<MultiTrigger>
  <MultiTrigger.Conditions>
    <Condition Property="IsMouseOver" Value="True"/>
    <Condition Property="IsKeyboardFocused" Value="False"/>
  <MultiTrigger.Conditions>
  <!-- setters for MouseOver state -->
</MultiTrigger>
Is that what you are looking for?

Re: Focused button mouse-over state issue

Posted: 17 Jan 2019, 10:29
by Matso
That is indeed helpful. Thanks!

Re: Focused button mouse-over state issue

Posted: 17 Jan 2019, 15:16
by jsantos
Thanks for your feedback!