Animated Ellipse
- by user287798
Hi, i need someone to help me. I need a xaml with animated ellipses like the ones shown here:http://www.telerik.com/products/silverlight/chart.aspx
They are to act as hotspot indicators on my map. What i have below is a xaml that i was trying to do but the circles don't center and have no fed-in/fade-out effect.
May somebody help me please.
Thanks
Sam
1 <UserControl
2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4 x:Class="SilverlightApplication3.MainPage"
5 Width="640" Height="480">
6
7
8 <Canvas>
9
10 <Canvas.Triggers>
11 <EventTrigger RoutedEvent="Canvas.Loaded">
12 <EventTrigger.Actions>
13 <BeginStoryboard>
14 <Storyboard >
15 <DoubleAnimation RepeatBehavior="Forever"
16 Storyboard.TargetName="Pt1"
17 Storyboard.TargetProperty="ScaleX"
18 From="1"
19 To="0.3"
20 Duration="0:0:5" />
21 </Storyboard>
22 </BeginStoryboard>
23
24 <BeginStoryboard>
25 <Storyboard>
26 <DoubleAnimation RepeatBehavior="Forever"
27 Storyboard.TargetName="Pt1"
28 Storyboard.TargetProperty="ScaleY"
29 From="1"
30 To="0.3"
31 Duration="0:0:5" />
32 </Storyboard>
33 </BeginStoryboard>
34 <!--<BeginStoryboard>
35 <Storyboard >
36 <DoubleAnimation RepeatBehavior="Forever"
37 Storyboard.TargetName="rect_Copy"
38 Storyboard.TargetProperty="Width"
39 From="30"
40 To="100"
41 Duration="0:0:5" />
42 </Storyboard>
43 </BeginStoryboard>
44
45 <BeginStoryboard>
46 <Storyboard>
47 <DoubleAnimation RepeatBehavior="Forever"
48 Storyboard.TargetName="rect_Copy"
49 Storyboard.TargetProperty="Height"
50 From="30"
51 To="100"
52 Duration="0:0:5" />
53 </Storyboard>
54 </BeginStoryboard>-->
55 </EventTrigger.Actions>
56 </EventTrigger>
57 </Canvas.Triggers>
58
59
60 <Ellipse x:Name="rect" Stroke="Green" Width="100" Height="100" Canvas.Left="30"
61 Canvas.Top="29">
62 <Ellipse.RenderTransform>
63 <ScaleTransform x:Name="Pt1" ScaleX="1" ScaleY="1"/>
64 </Ellipse.RenderTransform>
65
66 </Ellipse>
67 <Ellipse x:Name="rect_Copy"
68 Stroke="Green"
69 Width="30"
70 Height="30"
71 Canvas.Left="65"
72 Canvas.Top="64"/>
73
74 </Canvas>
75 </UserControl>
