Fill Symbol and Map Zoom Animation Help

BrandonCopeland — Thu, 29 Apr 2010 20:37:36 GMT

I am attempting to design a custom fill symbol that, on selected, will raise and leave a semi-transparent shadow in the original location. The goal is a "popping out" effect when selected.

My strategy was to create a second path in addition to the "Element" path and bind its data property to the "Element" path's data property. Now both have the same geometry, I can do whatever animation to the "Element" path on selected, and this second path would serve as the shadow.

Works great, except... The second (shadow) path does not re-size like other graphic elements during the map zoom animation. ie. All other elements will scale larger on map zoom in and the shadow path will remain the same size. I don't see any property differences between my new path and the Element path (thanks Silverlight Spy ;)). Can anyone provide any insight? Thanks in advance.

Here's the xaml. A value converter is needed for the binding. 2 paths can't share the same geometry, so the new path geometry must be created by copying properties from the first. I've included this as an attachment (had to change to .txt).


<Converter:PathConverter x:Key="PathConverter"/>

<esriSymbols:FillSymbol x:Key="ServiceSymbol">
        <esriSymbols:FillSymbol.ControlTemplate>
            <ControlTemplate>
                <Grid x:Name="RootElement">
                    <vsm:VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition GeneratedDuration="00:00:00.2"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="-8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="Element"/>
                                    <ColorAnimation Duration="0" To="Yellow" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Element"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unselected" />
                        </VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Path Fill="#FF353535" StrokeThickness="0" Opacity="0.65" Data="{Binding Data, Converter={StaticResource PathConverter}, ElementName=Element}"/>
                    <Path x:Name="Element" Stroke="#FF6C5D28" RenderTransformOrigin="0.5,0.5" Fill="#FFE8DC94">
                        <Path.RenderTransform>
                            <CompositeTransform/>
                        </Path.RenderTransform>
                    </Path>
                </Grid>
            </ControlTemplate>
        </esriSymbols:FillSymbol.ControlTemplate>
    </esriSymbols:FillSymbol>

Fill Symbol and Map Zoom Animation Help

BrandonCopeland — Thu, 29 Apr 2010 20:58:00 GMT

Upload screen capture of the issue as well...

Re: Fill Symbol and Map Zoom Animation Help

BrandonCopeland — Sun, 12 Dec 2021 02:30:53 GMT

Got it! Wasn't setting PathGeometry.Transform. Setting in value converter did the trick.

PathGeometry oldGeometry = (System.Windows.Media.PathGeometry)value;
PathGeometry pg = new PathGeometry {Transform = oldGeometry.Transform};

topic Fill Symbol and Map Zoom Animation Help in ArcGIS API for Silverlight Questions

Fill Symbol and Map Zoom Animation Help

Fill Symbol and Map Zoom Animation Help

Re: Fill Symbol and Map Zoom Animation Help