Commanche
Commanche

Reputation: 217

Button Styling OuterGlowBitmapEffect -> DropShadowEffect

In .NET 3.5 I used OuterGlowBitmapEffect on MouseOver event and it worked perfect.

Now I'm moving to .NET 4.0 and there does not working - is deprecated, so I rewrote my code to DropShadowEffect.

It works, but there is long delay between mouse over and animation start - about 500ms. Does anyone know why please? Or what am I doing wrong?

Style:

<Style x:Key="Button" TargetType="{x:Type Button}">
<Style.Setters>
    <Setter Property="Effect">
        <Setter.Value>
            <DropShadowEffect ShadowDepth="0" Color="Yellow" BlurRadius="800" RenderingBias="Performance" Opacity="0" />
        </Setter.Value>
    </Setter>
</Style.Setters>
<Style.Triggers>
    <Trigger Property="Button.IsMouseOver" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" From="0" To="1" By="1" BeginTime="0:0:0" Duration="0:0:0" />
                    <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" From="1" To="0" By="1" BeginTime="0:0:1" Duration="0:0:0" />
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>
    </Trigger>
</Style.Triggers>

And button:

<Button Content="B1" Canvas.Left="207" Canvas.Top="321" Height="70" Name="btn1" Style="{StaticResource Button}" Width="380" />

Upvotes: 1

Views: 486

Answers (1)

Adrian F&#226;ciu
Adrian F&#226;ciu

Reputation: 12552

You can use the BlurRadius property in the animation, instead of the Opacity. Also you can use AutoReverse property, to go back to initial state:

    <DropShadowEffect ShadowDepth="0" Color="Yellow" 
BlurRadius="0" RenderingBias="Performance"/>

And the animation:

    <DoubleAnimation Storyboard.TargetProperty="Effect.BlurRadius" 
From="0" To="100" Duration="0:0:0.2" AutoReverse="True"/>

And you should get a similar effect that starts without any delay.

Upvotes: 2

Related Questions