[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

OuterGlowBitmapEffect in Silverlight?

Posted on 2011-05-13
12
Medium Priority
?
1,287 Views
Last Modified: 2013-11-12
hi everybody

I'm quite new to Silverlight and I've got a (maybe stupid?) question. I'd like to have an animation on a label when you move your mouse over it. It should start to glow (and stop that when mouse leaves). I was looking for such an effect and I found this one:

OuterGlowBitmapEffect
http://msdn.microsoft.com/en-us/library/ms752037(v=vs.90).aspx

But it seams, that Silverlight doesn't support such BitmapEffects. Am I right? And how could I do that in another way? (Btw. I don't have Expression Blend)
0
Comment
Question by:innovasoft
  • 7
  • 5
12 Comments
 
LVL 11

Expert Comment

by:saragani
ID: 35753186
      <TextBox Width="200" Height="23" Text="Hello World">
            <TextBox.Effect>
                <DropShadowEffect ShadowDepth="0" BlurRadius="30" Opacity="1" Color="Blue" />
            </TextBox.Effect>
        </TextBox>



Since .Net 4.0 WPF also have Effect.
BitmapEffect works on Software and doesn't use hardware acceleration... But Effect does.

Effect also in WPF have Blur and DropShadow.

OuterGlow is somewhat based on DropShadow, and you should be able to create all the BitmapEffect by those 2 Effects.
0
 
LVL 11

Expert Comment

by:saragani
ID: 35765122
Hi, did you find my answer useful?
0
 
LVL 1

Author Comment

by:innovasoft
ID: 35768726
hi

thanks a lot for your answer. I couldn't test it yet. I will this evening and let you know
0
Veeam Disaster Recovery in Microsoft Azure

Veeam PN for Microsoft Azure is a FREE solution designed to simplify and automate the setup of a DR site in Microsoft Azure using lightweight software-defined networking. It reduces the complexity of VPN deployments and is designed for businesses of ALL sizes.

 
LVL 1

Author Comment

by:innovasoft
ID: 35770306
that's exactly the effect I wanted to have. Thank you very much!

But now, I need this effect to fade in on MouseEnter and to fade out on MouseLeave. I have no idea how I could do that?

Thank you for your help
0
 
LVL 11

Expert Comment

by:saragani
ID: 35770456
I would put my guess on visual state manager.

If you can't get your hands and your legs from it, then post back
0
 
LVL 11

Accepted Solution

by:
saragani earned 500 total points
ID: 35771487
<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" 
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" x:Class="SilverlightOuterGlow.MainPage"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
    	<VisualStateManager.VisualStateGroups>
    		<VisualStateGroup x:Name="CommonStates">
    			<VisualStateGroup.Transitions>
    				<VisualTransition GeneratedDuration="0:0:1"/>
    			</VisualStateGroup.Transitions>
    			<VisualState x:Name="NormalState"/>
    			<VisualState x:Name="MouseOverState">
    				<Storyboard>
    					<DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Effect).(DropShadowEffect.Opacity)" Storyboard.TargetName="textBox" d:IsOptimized="True"/>
    				</Storyboard>
    			</VisualState>
    		</VisualStateGroup>
    	</VisualStateManager.VisualStateGroups>
        <TextBox x:Name="textBox" Width="200" Height="23" Text="Hello World">
        	<i:Interaction.Triggers>
        		<i:EventTrigger EventName="MouseEnter">
        			<ei:GoToStateAction StateName="MouseOverState"/>
        		</i:EventTrigger>
        		<i:EventTrigger EventName="MouseLeave">
        			<ei:GoToStateAction StateName="NormalState"/>
        		</i:EventTrigger>
        	</i:Interaction.Triggers> 
    		<TextBox.Effect>
    			<DropShadowEffect ShadowDepth="0" BlurRadius="30" Opacity="0" Color="Blue" x:Name="glowEffect"/>
    		</TextBox.Effect>
    	</TextBox>
    </Grid>
</UserControl>

Open in new window



With 1 second transition. You can easily change it to 0 seconds and it will change immediately.
0
 
LVL 1

Author Comment

by:innovasoft
ID: 35772219
hm... i tried this, but I get a lot of errors. I created a new project called SilverlightOuterGlow with following XAML in the MainPage:


<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" 
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" x:Class="SilverlightOuterGlow.MainPage"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:1"/>
                </VisualStateGroup.Transitions>
                <VisualState x:Name="NormalState"/>
                <VisualState x:Name="MouseOverState">
                    <Storyboard>
                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Effect).(DropShadowEffect.Opacity)" Storyboard.TargetName="textBox" d:IsOptimized="True"/>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <TextBox x:Name="textBox" Width="200" Height="23" Text="Hello World">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="MouseEnter">
                    <ei:GoToStateAction StateName="MouseOverState"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="MouseLeave">
                    <ei:GoToStateAction StateName="NormalState"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <TextBox.Effect>
                <DropShadowEffect ShadowDepth="0" BlurRadius="30" Opacity="0" Color="Blue" x:Name="glowEffect"/>
            </TextBox.Effect>
        </TextBox>
    </Grid>
</UserControl>

Open in new window


then I get these errors:

The property 'Triggers' does not exist on the type 'TextBox' in the XML namespace 'http://schemas.microsoft.com/expression/2010/interactivity'  (line 26)

The tag 'EventTrigger' does not exist in XML namespace 'http://schemas.microsoft.com/expression/2010/interactivity'. (line 27)

The tag 'GoToStateAction' does not exist in XML namespace 'http://schemas.microsoft.com/expression/2010/interactions'. (line 28)

The tag 'EventTrigger' does not exist in XML namespace 'http://schemas.microsoft.com/expression/2010/interactivity'. (line 30)

The tag 'GoToStateAction' does not exist in XML namespace 'http://schemas.microsoft.com/expression/2010/interactions'. (line 31)

0
 
LVL 11

Expert Comment

by:saragani
ID: 35772260
Hi, I forgot to mention that you need to add reference to
System.windows.interactivity
And
Microsoft.expression.interactions. (or something like that)
0
 
LVL 1

Author Comment

by:innovasoft
ID: 35772311
hm, I can't find these references. I just have to right-click on references and choose "Add reference". Then I should see those references in the register ".NET", right? Is it possible that I can't see them because I use the express version of Visual Studio?
0
 
LVL 11

Expert Comment

by:saragani
ID: 35772389
Hi, one of the DLLs come from Expression Blend.
You can also do it in Code Behind (calling VisualStateManager.GoToState or something similar).
Anyway, I'm attaching a project by a link to Rapidshare/Megaupload.
Take the missing DLLs from it:

https://rapidshare.com/files/1754085932/SilverlightOuterGlow.rar
http://www.megaupload.com/?d=8E5L7QXA
http://www.mediafire.com/?2ija4rz1z6n415g
0
 
LVL 1

Author Comment

by:innovasoft
ID: 35772472
You are a genius!

Thanks a lot for your great help!
0
 
LVL 11

Expert Comment

by:saragani
ID: 35772495
10x :-)
0

Featured Post

Get your Conversational Ransomware Defense e‑book

This e-book gives you an insight into the ransomware threat and reviews the fundamentals of top-notch ransomware preparedness and recovery. To help you protect yourself and your organization. The initial infection may be inevitable, so the best protection is to be fully prepared.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This tutorial is about how to put some of your C++ program's functionality into a standard DLL, and how to make working with the EXE and the DLL simple and seamless.   We'll be using Microsoft Visual Studio 2008 and we will cut out the noise; that i…
This article describes how to programmatically preset the "Pages per Sheet" option that's available with most printer drivers.   This setting lets you do "n-Up" printing, where two, four, or more pages are printed on each sheet of paper. If your …
This is Part 3 in a 3-part series on Experts Exchange to discuss error handling in VBA code written for Excel. Part 1 of this series discussed basic error handling code using VBA. http://www.experts-exchange.com/videos/1478/Excel-Error-Handlin…
Look below the covers at a subform control , and the form that is inside it. Explore properties and see how easy it is to aggregate, get statistics, and synchronize results for your data. A Microsoft Access subform is used to show relevant calcul…

834 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question