zoukankan      html  css  js  c++  java
  • WPF 鼠标滑过列表渐变效果

    今天闲来无事,看到很多web的动画效果,用WPF模仿着也写了个简单的。简单的给listboxItem加了个样式。里面就是一个动画,写的比较粗糙。

    <Style x:Key="stye1" TargetType="{x:Type ListBoxItem}">
                <Setter Property="Foreground" Value="Snow" />
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Border Background="{TemplateBinding Background}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}">
                                <ContentPresenter />
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <!--  鼠标悬停  -->
                                    <Setter Property="Background" Value="Black" />
                                    <!--  value中写你要的颜色的值  -->
                                </Trigger>
    
                                <EventTrigger RoutedEvent="Mouse.MouseLeave">
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation Duration="0:0:0.4"
                                                            From="#AA000000"
                                                            Storyboard.TargetProperty="(ListBoxItem.Background).(SolidColorBrush.Color)"
                                                            To="Transparent" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

    再来看看界面效果

     

  • 相关阅读:
    差分约束系统详解
    AC自动机详解
    KMP算法详解
    ST算法详解
    Trie详解
    欧拉路径详解
    树上差分详解
    LCA详解
    树链剖分详解
    树的直径详解
  • 原文地址:https://www.cnblogs.com/garysun90/p/5567849.html
Copyright © 2011-2022 走看看