nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Symbol Resources

BrianLeroux

Hi- I am trying to symbolize a graphic that I am drawing. I can't seem to use the the resource I created. Am I missing something?

<UserControl x:Class="PolicyQuerySpatial.AddIns.QueryDialog"     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:esri="http://schemas.esri.com/arcgis/client/2009"     mc:Ignorable="d"     d:DesignHeight="160" d:DesignWidth="325" xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit" Opacity="1">      <Grid x:Name="LayoutRoot" Background="Transparent" Height="160" Width="325" Opacity="1" HorizontalAlignment="Right">                         <Button Height="32" HorizontalAlignment="Left" Margin="91,44,0,0" Name="btnLine" VerticalAlignment="Top" Width="32" Click="btnDrawLine_Click">             <Button.Content>                 <Image Source="/PolicyQuerySpatial.AddIns;component/Images/EditingEditLine32.png" />             </Button.Content>         </Button>         <Button  Height="32" HorizontalAlignment="Left" Margin="143,44,0,0" Name="btnPolygon" VerticalAlignment="Top" Width="32" Click="btnDrawPolygon_Click" >             <Button.Content>                 <Image Source ="/PolicyQuerySpatial.AddIns;component/Images/EditingEditShape32.png" />             </Button.Content>         </Button>         <CheckBox Content="Include Policies within a distance of:" Height="16" HorizontalAlignment="Left" Margin="12,95,0,0" Name="chkBuffer" VerticalAlignment="Top" />         <TextBlock Height="23" HorizontalAlignment="Left" Margin="116,122,0,0" Name="txtMiles" Text="Mile(s)" VerticalAlignment="Top" />         <toolkit:NumericUpDown Height="22" HorizontalAlignment="Left" Margin="38,120,0,0" Name="numBuffer" VerticalAlignment="Top" Width="56" Maximum="500" />     </Grid>     <UserControl.Resources>         <ResourceDictionary>             <esri:SimpleMarkerSymbol x:Key="GreenMarkerSymbol" Color="Green" Size="12" Style="Circle" />             <esri:SimpleLineSymbol x:Key="RedLineSymbol" Color="Green" Width="4" Style="Solid" />             <esri:SimpleFillSymbol x:Key="RedFillSymbol" Fill="#66FF0000" BorderBrush="Red" BorderThickness="2" />         </ResourceDictionary>     </UserControl.Resources>  </UserControl>

private void btnDrawPoint_Click(object sender, RoutedEventArgs e)         {             drawObject.DrawMode = DrawMode.Point;             _activeSymbol = LayoutRoot.Resources["GreenMarkerSymbol"] as Symbol;              drawObject.IsEnabled = (drawObject.DrawMode != DrawMode.None);         }

Find more posts tagged with

Accepted answers

KatherineDalton

Hi Brian,

When creating your GraphicsLayer are you setting the Renderer property? If that isn't set at the time the GraphicsLayer is created, the Viewer just uses the default renderer.

GraphicsLayer gl = new GraphicsLayer() {     ID = "IdentifyResultsLayer",     Renderer = new SimpleRenderer()     {           Symbol = identifyDialog.Resources["RedMarkerSymbol"] as Symbol     } };

Katy

All comments

BrianLeroux

Not perfectly but for my needs the following woked fine for me. It gives me the orange glow on selection with animation but the glow is not ecactly the same as the default ESRI glow. I played around with it for a while to get it close as possible. You will aslo see that I added a hover animation so that I could show a label on hover. You could remove that if you didn't want it. Hope it helps you..

<esri:MarkerSymbol x:Name="CustomStrobeMarkerSymbol">
                <esri:MarkerSymbol.ControlTemplate>
                    <ControlTemplate>
                        <Canvas>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="SelectionStates">
                                    <VisualState x:Name="Selected">
                                        <Storyboard RepeatBehavior="1x">
                                            <DoubleAnimation BeginTime="0" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)" From="1" To="6" Duration="00:00:00.5" />
                                            <DoubleAnimation BeginTime="0" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)" From="1" To="6" Duration="00:00:00.5" />
                                            <DoubleAnimation BeginTime="0" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.Opacity)" From="1" To="1" Duration="00:00:01" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unselected" />
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="labelOnHover" 
                            Storyboard.TargetProperty="Visibility" 
                            Duration="0">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Visible</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation From="0" To="1" Storyboard.TargetName="labelOnHover" 
                             Storyboard.TargetProperty="Opacity"
                             Duration="0:0:.25" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal" />
                                </VisualStateGroup>

                            </VisualStateManager.VisualStateGroups>
                            
                            <Ellipse Height="10" Width="10" Canvas.Left="-5" Canvas.Top="-5" RenderTransformOrigin="0.5,0.5" x:Name="ellipse" IsHitTestVisible="False">
                                <Ellipse.RenderTransform>
                                    <ScaleTransform />
                                </Ellipse.RenderTransform>
                                <Ellipse.Fill>
                                    <RadialGradientBrush>
                                        <GradientStop Color="#8DFFFF00" />
                                        <GradientStop Color="#8DFFFF00" Offset=".4" />
                                        <GradientStop Color="#8DFF7600" Offset=".8" />
                                        <GradientStop Color="#00FF7600" Offset="1" />
                                        <!--<GradientStop Color="#00FF0000" Offset="1" />-->
                                    </RadialGradientBrush>
                                </Ellipse.Fill>
                            </Ellipse>
                            <Ellipse Height="10" Width="10" Canvas.Left="-5" Canvas.Top="-5" Fill="#FFFF0000" x:Name="ellipse1" />
                            <Grid Margin="8,-8,0,0" x:Name="labelOnHover" Visibility="Collapsed"
                        HorizontalAlignment="Left" VerticalAlignment="Top" >
                                <!--Text halo using a white blurred text-->
                                <TextBlock Foreground="White" FontWeight="Bold" Text="{Binding Attributes[POLICY_NO]}" >
                    <TextBlock.Effect>
                              <BlurEffect Radius="5" />
                    </TextBlock.Effect>
                                </TextBlock>
                                <!--Text-->
                                <TextBlock Foreground="Black" FontWeight="Bold" Text="{Binding Attributes[POLICY_NO]}" />
                            </Grid>

                        </Canvas>
                    </ControlTemplate>
                </esri:MarkerSymbol.ControlTemplate>
                
            </esri:MarkerSymbol>

KarenEllett

Brian - did you ever solve the highlighting issue?

BrianLeroux

Craig-
Do you happen to know if it keeps the same orange glow affect when selecting the items? Thanks.

CamMiller17_0-1758904541456.png

CraigPatterson

I struggled with the same thing, but I figured it out. What you need to do is to name your user control.

<UserControl x:Class="AddInDemo.AddIns.MarkUpToolSet" x:Name="MarkUpToolset"
    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:esri="http://schemas.esri.com/arcgis/client/2009"
    mc:Ignorable="d"
    d:DesignHeight="155" d:DesignWidth="450">

    <UserControl.Resources>
            <esri:SimpleLineSymbol x:Key="MarkUpLineSymbol" Color="Red" Width="4" />
            <esri:SimpleFillSymbol x:Key="MarkUpFillSymbol" Fill="Red" BorderBrush="Red" BorderThickness="2" />
            <esri:SimpleMarkerSymbol x:Key="MarkUpMarkerSymbol" Color="Red" Size="12" Style="Circle" />
    </UserControl.Resources>

Then you can refer to it in your code behind.

        private void DrawPointButton_Click(object sender, RoutedEventArgs e)
        {
            MarkUpDrawObject.DrawMode = DrawMode.Point;
            MarkUpDrawObject.IsEnabled = true;

            _activeMarkUpSymbol = MarkUpToolset.Resources["MarkUpMarkerSymbol"] as Symbol;
        }

Good Luck.

Craig

BrianLeroux

Well i decided to make my own symbol using the ControlTemplate and visual states. I would love to be able to recreate the same orange glow used for selected items. Would anyone at ESRI be able to provide the code used for the symbol animation?

BrianLeroux

Well after spending a day trying to get past this I am baffled. I did notice that if I use my add-in with custom symbology to add a graphics layer and then change the symbology using congiguration tool, the highlighted when selecting comes back. I can't figure out a way to reference the build in symbology from an add-in. I willing to try any ideas you may have.. Thanks.

BrianLeroux

When using the Resource Dictionary to define symbols I find that the highlighting a point when selected no longer works. Is this something that needs to be defined when creating the symbol? If there is a better to use the build in symbols in the viewer to maintain the selected item highlighting I am open to that. Here is how I am defining my symbols currently.

<UserControl.Resources>
        <ResourceDictionary>
            <esri:SimpleMarkerSymbol x:Key="BlueMarkerSymbol" Color="Blue" Size="12" Style="Circle" />
            <esri:SimpleLineSymbol x:Key="RedLineSymbol" Color="Red" Width="4" Style="Solid" />
            <esri:SimpleLineSymbol x:Key="BlueLineSymbol" Color="Blue" Width="4" Style="Solid" />
            <esri:SimpleFillSymbol x:Key="RedFillSymbol" Fill="#66FF0000" BorderBrush="Red" BorderThickness="2" />
            <esri:SimpleFillSymbol x:Key="BlueFillSymbol" Fill="#660000FF" BorderBrush="Blue" BorderThickness="2" />
            <esri:SimpleFillSymbol x:Key="WhiteFillSymbol" Fill="#AAFFFFFF" BorderBrush="#DD000000" BorderThickness="2" />
            <esri:PictureMarkerSymbol x:Key="RedStickpin"  OffsetX="16" OffsetY="32" Source="/PolicyQuerySpatial.AddIns;component/Images/RedStickpin.png" Height="32" Width="32" />
            <esri:PictureMarkerSymbol x:Key="BlueStickpin"  OffsetX="16" OffsetY="32" Source="/PolicyQuerySpatial.AddIns;component/Images/BlueStickpin.png" Height="32" Width="32" />
        </ResourceDictionary>
    </UserControl.Resources>

BrianLeroux

Thanks Katy. I was looking at that in the API Best Practices but I am having trouble referencing the resource dictionary i created. Based on my XAML above, how do i reference the resources?
UserControl.Resources and QueryDialog.Resources does not work.

*Update
I figured it out. I just used Resources["SymbolKey"] and it worked. Thanks for pointing me in the right direction.

KatherineDalton

Hi Brian,

When creating your GraphicsLayer are you setting the Renderer property? If that isn't set at the time the GraphicsLayer is created, the Viewer just uses the default renderer.

GraphicsLayer gl = new GraphicsLayer() {     ID = "IdentifyResultsLayer",     Renderer = new SimpleRenderer()     {           Symbol = identifyDialog.Resources["RedMarkerSymbol"] as Symbol     } };

Katy

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.