WPF Styles Button MouseOver Câu hỏi

Question

Tôi đang cố gắng tạo hiệu ứng di chuột đơn giản trên nút, Nó thay đổi màu khi con chuột kết thúc nhưng màu bị thay đổi ngay lập tức thành nền nút mặc định ... làm cách nào tôi có thể ghi đè hành vi này ?

đây là mã của tôi:

Style myBtnStyle = new Style(); 
Trigger bla = new Trigger() { Property = IsMouseOverProperty, Value = true }; 
bla.Setters.Add(new Setter(Control.BackgroundProperty, Brushes.Black)); 
myBtnStyle.Triggers.Add(bla); 
button2.Style = myBtnStyle; 

Answer 1

Theo this post, rằng phim hoạt hình ưa thích được xây dựng vào và để loại bỏ nó, bạn sẽ cần phải ghi đè lên ControlTemplate cho Button của bạn. May mắn thay, điều đó không quá khó. Tôi đã sử dụng this post làm tài liệu nguồn và đã đưa ra Style sau đây cung cấp cho bạn ý tưởng.

<Style x:Key="MouseOverButtonStyle" TargetType="Button"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <ControlTemplate.Resources> 
        <Style x:Key="ShadowStyle"> 
         <Setter Property="Control.Foreground" Value="LightGray" /> 
        </Style> 
       </ControlTemplate.Resources> 
       <Border Name="border" BorderThickness="1" Padding="4,2" BorderBrush="DarkGray" CornerRadius="3" Background="{TemplateBinding Background}"> 
        <Grid > 
         <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="contentShadow" Style="{StaticResource ShadowStyle}"> 
          <ContentPresenter.RenderTransform> 
           <TranslateTransform X="1.0" Y="1.0" /> 
          </ContentPresenter.RenderTransform> 
         </ContentPresenter> 
         <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="content"/> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="Background" Value="Beige" /> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

Cập nhật: Nếu bạn chết đặt trên áp dụng Style trong mã và bạn không muốn sử dụng một (có lẽ là cách tốt hơn để làm điều đó) ResourceDictionary, bạn có thể tải các Style động sử dụng XamlReader.Load:

  const string xaml = @" 
<Style xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' 
     xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml' 
     TargetType='Button'> 
    <Setter Property='Template'> 
     <!--- Omitted For Clarity ---> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property='IsMouseOver' Value='True'> 
      <Setter Property='Background' Value='Beige' /> 
     </Trigger> 
    </Style.Triggers> 
</Style>"; 
      var encoding = new ASCIIEncoding(); 
      var bytes = encoding.GetBytes(xaml); 
      var style = (Style)XamlReader.Load(new MemoryStream(bytes)); 
      Button1.Style = style; 

Answer 2

Ghi đè chủ đề ButtonChrome sẽ dễ dàng hơn.

Tạo mẫu và loại bỏ các RenderMouseOver = "{TemplateBinding IsMouseOver}"

<Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="Button"> 
      <Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}"RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding Button.IsDefaulted}" SnapsToDevicePixels="True"> 
       <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
      </Microsoft_Windows_Themes:ButtonChrome> 
      <ControlTemplate.Triggers> 
       <Trigger Property="IsKeyboardFocused" Value="True"> 
        <Setter Property="RenderDefaulted" TargetName="Chrome" Value="True"/> 
       </Trigger> 
       <Trigger Property="ToggleButton.IsChecked" Value="True"> 
        <Setter Property="RenderPressed" TargetName="Chrome" Value="True"/> 
       </Trigger> 
       <Trigger Property="IsEnabled" Value="False"> 
        <Setter Property="Foreground" Value="#FFADADAD"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 

Và sau đó thêm xử lý của riêng bạn mouseover

<Style.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="Background"> 
       <Setter.Value> 
        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
         <GradientStop Color="#FFF3E8D5" Offset="0"/> 
         <GradientStop Color="#FFF49B03" Offset="1"/> 
        </LinearGradientBrush> 
       </Setter.Value> 
      </Setter> 
     </Trigger> 
    </Style.Triggers> 

Điều đó sẽ giải quyết nó! :)