MouseOver que resalta el estilo y vuelve a su valor predeterminado después de un segundo (¿Causado por Aero?)

Question

Intenté diseñar mis ComboBoxes para que coincidan con el resto de la interfaz de usuario, pero tengo problemas con el resaltado de IsMouseOver. Se resalta con el color que especifico por un segundo y luego se desvanece al color predeterminado, una especie de efecto genial pero no para lo que estoy buscando. Aquí está mi estilo:

<Style TargetType="ComboBox">
    <Style.Triggers>
        <Trigger Property="ComboBox.IsMouseOver" Value="True">
            <Setter Property = "Background" Value="Red"/>
        </Trigger>
    </Style.Triggers>
</Style>

¿Qué puedo hacer para que el color de fondo permanezca?

Answer 1

El problema se debe a la plantilla predeterminada para el ComboBox. Si utiliza Reflector para abrir PresentationFramework.Aero ensamblaje, puede echar un vistazo a La clase ButtonChrome. Existe un método llamado OnRenderMouseOverChanged que oculta el fondo rojo.

Aunque es mucho trabajo, al menos para ComboBox, es probable que desee anular la plantilla predeterminada para ComboBox. Puede tener una idea básica de cómo es el temlpate ComboBox usando Show Me Plantilla o Blend .

Puedes usar tu mismo estilo para anular la plantilla.

<Style TargetType="{x:Type ComboBox}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBox}">
                <!-- Template Here -->
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 2

Puede anular este comportamiento obteniendo una copia de la plantilla predeterminada de WPF Visual Studio Designer y luego en el estilo ComboBoxReadonlyToggleButton comente la sección ButtonChrome y sustitúyala por un borde. Aquí hay un enlace al sitio donde encontré la solución - http://www.scriptscoop.net/t/d346cf01d844/cc-wpf-combobox-mouse-over-color.html

Aquí está mi fragmento de código

<Style x:Key="ComboBoxReadonlyToggleButton" TargetType="{x:Type ToggleButton}">
  <Setter Property="OverridesDefaultStyle" Value="true"/>
  <Setter Property="IsTabStop" Value="false"/>
  <Setter Property="Focusable" Value="false"/>
  <Setter Property="ClickMode" Value="Press"/>
  <Setter Property="Background" Value="Transparent"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type ToggleButton}">
        <!-- Replace the ButtonChrome - this eliminated the following
             problem:  When the mouse was moved over the ComboBox
             the color would change to the color defined in ___ but 
             then would  
             immediately change to the default Aero blue
             gradient background of 2 powder blue colors  - 
             Had to comment out the          
             below code and replace it as shown
             <Themes:ButtonChrome x:Name="Chrome" BorderBrush="                 {TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" SnapsToDevicePixels="true">
               <Grid HorizontalAlignment="Right" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}">
                 <Path x:Name="Arrow" Data="{StaticResource DownArrowGeometry}" Fill="Black" HorizontalAlignment="Center" Margin="3,1,0,0" VerticalAlignment="Center"/>
               </Grid>
             </Themes:ButtonChrome>-->

         <!-- Here is the code to replace the ButtonChrome code -->
         <Border x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
           <Grid HorizontalAlignment="Right" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}">
             <Path x:Name="Arrow" Data="{StaticResource DownArrowGeometry}" Fill="Black" HorizontalAlignment="Center" Margin="3,1,0,0" VerticalAlignment="Center"/>
           </Grid>
         </Border>
       <!-- End of code to replace the Button Chrome -->

También agregué algo de código para cambiar el color de fondo a DarkOrange - Este código se incluyó en ControlTemplate (en la sección) para el Estilo de ComboBox.

<!-- Hover Code - Code that was added to change the ComboBox background 
     color when the use hovers over it with the mouse -->
<Trigger Property="IsMouseOver" Value="True">
   <Setter Property="Background" Value="DarkOrange"></Setter>
</Trigger>
<!-- Hover Code - End -->