学步园

      由于需要，做了一个WPF的无边框的自定义的Button，代码如下：

　　运行效果如下：

常态：

当鼠标经过时的状态：

在这个基础上，您可以做出更多的效果（仿照这个是360软件管家右边栏实现的效果）如：

我自己已经实现了这个种效果，只是加了一点C#后台代码，辅助控制动画的，你自己可以尝试下，挺好玩的哦。。。呵呵

下面是实现效果的代码：

    <Style x:Key="MainButtonStyle" TargetType="Button"
            BasedOn="{StaticResource BaseButtonStyle}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <Grid.Resources>
                            <Color x:Key="LinearBevelLightStartColor">Transparent</Color>
                            <Color x:Key="LinearBevelLightEndColor">Transparent</Color>
                            <Color x:Key="LinearBevelDarkStartColor">Transparent</Color>
                            <Color x:Key="LinearBevelDarkEndColor">Transparent</Color>
                            <Color x:Key="PressedEndColor">#1932D4</Color>
                            <SolidColorBrush x:Key="BorderBrush"
                                    Color="#FF5E5E5E" />
                            <SolidColorBrush x:Key="AccentBrush"
                                    Color="#FF000000" />
                            <SolidColorBrush x:Key="DisabledBrush"
                                    Color="#A5FFFFFF" />
                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition
                                            GeneratedDuration="00:00:00.2000000"
                                            To="MouseOver" />
                                    <VisualTransition
                                            GeneratedDuration="0:0:0.1"
                                            To="Pressed" />
                                    <VisualTransition
                                            GeneratedDuration="00:00:00.2000000"
                                            From="Normal" To="MouseOver" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal">
                                    <Storyboard />
                                </VisualState>
                                <VisualState x:Name="MouseOver">
                                    <!--<Storyboard />-->
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames
                                                Duration="0"
                                                Storyboard.TargetName="BackgroundGradient"
                                                Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                                            <SplineColorKeyFrame KeyTime="0"
                                                    Value="#42FFFFFF" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames
                                                Duration="0"
                                                Storyboard.TargetName="BackgroundGradient"
                                                Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                                            <SplineColorKeyFrame KeyTime="0"
                                                    Value="#42FFFFFF" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames
                                                Duration="0"
                                                Storyboard.TargetName="BackgroundGradient"
                                                Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                                            <SplineColorKeyFrame KeyTime="0"
                                                    Value="#42FFFFFF" />
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames
                                                Duration="0"
                                                Storyboard.TargetName="BackgroundGradient"
                                                Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                                            <SplineColorKeyFrame KeyTime="0"
                                                    Value="#42FFFFFF" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames
                                                Duration="0"
                                                Storyboard.TargetName="DisabledVisual"
                                                Storyboard.TargetProperty="Opacity">
                                            <SplineDoubleKeyFrame KeyTime="0"
                                                    Value="1" />
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>

                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused">
                                    <Storyboard />
                                </VisualState>
                                <VisualState x:Name="Unfocused">
                                    <Storyboard />
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Rectangle x:Name="Background"
                                Fill="{TemplateBinding Background}" />
                        <Rectangle x:Name="BackgroundGradient"
                                Stroke="{StaticResource BorderBrush}"
                                StrokeThickness="0" Margin="0" RadiusX="5" RadiusY="5">
                            <Rectangle.Fill>
                                <LinearGradientBrush EndPoint="1,1"
                                        StartPoint="0,0">
                                    <GradientStop
                                            Color="{StaticResource LinearBevelLightStartColor}"
                                            Offset="0" />
                                    <GradientStop
                                            Color="{StaticResource LinearBevelLightEndColor}"
                                            Offset="0.326" />
                                    <GradientStop
                                            Color="{StaticResource LinearBevelDarkStartColor}"
                                            Offset="0.5" />
                                    <GradientStop Color="Transparent" Offset="0.7" />
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                        <Grid x:Name="FocusVisual" Visibility="Collapsed">
                            <Rectangle Margin="-2,1,-2,-2"
                                    Stroke="{StaticResource AccentBrush}"
                                    StrokeThickness="0"
                                    StrokeDashArray="1.5 1.5" />
                        </Grid>
                        <ContentPresenter Margin="4,5,4,4"
                                Content="{TemplateBinding Content}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                        <Rectangle x:Name="DisabledVisual"
                                IsHitTestVisible="false" Opacity="0"
                                Fill="{StaticResource DisabledBrush}"
                                RadiusX="0" RadiusY="0" Margin="-1,-1,-1,-1" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>