Search code examples
silverlightsilverlight-toolkit

Unable to find resource style error


I am having a problem with my stying where an error message is showing saying: Cannot find a Resource with the Name/Key PerformanceBarChartBarTemplate [Line: 454 Position: 35]

My style code is:

<Style x:Key="MainChartStyle" TargetType="toolkit:Chart">
    <Setter Property="BorderThickness" Value="0" />
    <Setter Property="TitleStyle" Value="{StaticResource ChartTitle}"/>
    <Setter Property="Palette">
        <Setter.Value>
            <datavis:ResourceDictionaryCollection>
                <ResourceDictionary>
                    <Style TargetType="toolkit:BarDataPoint">
                        <Setter Property="Background"
                        Value="#FF57007f" />
                        <Setter Property="BorderBrush"
                        Value="#FF2e0007" />
                        <Setter Property="Template"
                        Value="{StaticResource PerformanceBarChartBarTemplate}" />
                    </Style>
                </ResourceDictionary>
            </datavis:ResourceDictionaryCollection>
        </Setter.Value>
    </Setter>
    <Setter Property="LegendStyle">
        <Setter.Value>
            <Style TargetType="dataVisualizationToolkit:Legend">
                <Setter Property="Margin"
                    Value="15,0,15,0" />
                <Setter Property="VerticalAlignment"
                    Value="Center" />
                <Setter Property="BorderBrush"
                    Value="Transparent" />
                <Setter Property="Background"
                    Value="Transparent" />
            </Style>
        </Setter.Value>
    </Setter>
    <Setter Property="ChartAreaStyle">
        <Setter.Value>
            <Style TargetType="Panel">
                <Setter Property="MinWidth" Value="100"/>
                <Setter Property="MinHeight" Value="75"/>
            </Style>
        </Setter.Value>
    </Setter>
    <Setter Property="PlotAreaStyle">
        <Setter.Value>
            <Style TargetType="Grid">
                <Setter Property="Background"
                    Value="Transparent">
                </Setter>
            </Style>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="toolkit:Chart">
                <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Padding="10">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <dataVisualizationToolkit:Title Style="{TemplateBinding TitleStyle}"
                                              Content="{TemplateBinding Title}" />
                        <Grid Margin="0,15,0,15"
                          Grid.Row="1">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <dataVisualizationToolkit:Legend x:Name="Legend"
                                           Style="{TemplateBinding LegendStyle}"
                                           Grid.Column="1"/>
                            <toolkitChartingPrimitives:EdgePanel x:Name="ChartArea"
                                           Style="{TemplateBinding ChartAreaStyle}">
                                <Grid Style="{TemplateBinding PlotAreaStyle}"
                                  Canvas.ZIndex="-1" />
                            </toolkitChartingPrimitives:EdgePanel>
                        </Grid>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

And the control which it can't see is:

<ControlTemplate x:Key="PerformanceBarChartBarTemplate"
             TargetType="toolkit:BarDataPoint">
    <Border BorderThickness="0"
        Opacity="0"
        x:Name="Root">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.1" />
                </VisualStateGroup.Transitions>
                <VisualState x:Name="Normal" />
                <VisualState x:Name="MouseOver">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="MouseOverHighlight"
                                     Storyboard.TargetProperty="Opacity"
                                     To="0.6"
                                     Duration="0" />
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="SelectionStates">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.1" />
                </VisualStateGroup.Transitions>
                <VisualState x:Name="Unselected" />
                <VisualState x:Name="Selected">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="SelectionHighlight"
                                     Storyboard.TargetProperty="Opacity"
                                     To="0.6"
                                     Duration="0" />
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
            <VisualStateGroup x:Name="RevealStates">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.5" />
                </VisualStateGroup.Transitions>
                <VisualState x:Name="Shown">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="Root"
                                     Storyboard.TargetProperty="Opacity"
                                     To="1"
                                     Duration="0" />
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="Hidden">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="Root"
                                     Storyboard.TargetProperty="Opacity"
                                     To="0"
                                     Duration="0" />
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <Grid Margin="0 4 0 4">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <!-- Main bar shape -->
            <Rectangle Fill="{TemplateBinding Background}"
                   Stroke="{TemplateBinding BorderBrush}"
                   StrokeThickness="{TemplateBinding BorderThickness}"
                   RadiusX="3"
                   RadiusY="3"
                   Grid.Row="0"
                   Grid.RowSpan="2">
                <Rectangle.Effect>
                    <DropShadowEffect BlurRadius="10"
                                  Direction="0"
                                  Color="#FFFFFFFF"
                                  ShadowDepth="0" />
                </Rectangle.Effect>
            </Rectangle>


            <!-- Diffuse Glow -->
            <Rectangle RadiusX="3"
                   RadiusY="3"
                   Margin="4"
                   Grid.Row="0"
                   Grid.RowSpan="2"
                   Opacity=".25"
                   Fill="White"
                   >
                <Rectangle.Effect>
                    <BlurEffect Radius="8" />
                </Rectangle.Effect>

            </Rectangle>


            <!-- Specular Highlight -->
            <Rectangle RadiusX="3"
                   RadiusY="3"
                   Margin="2"
                   Grid.Row="0">

                <Rectangle.Fill>
                    <LinearGradientBrush>
                        <GradientStop Color="#99ffffff"
                                  Offset="0" />
                        <GradientStop Color="#22ffffff"
                                  Offset="1" />
                    </LinearGradientBrush>
                </Rectangle.Fill>
            </Rectangle>

            <!--<Border BorderBrush="#ccffffff"
                BorderThickness="1">
            <Border BorderBrush="#77ffffff"
                    BorderThickness="1" />
        </Border>-->

            <Rectangle x:Name="SelectionHighlight"
                   Fill="Red"
                   Opacity="0" />
            <Rectangle x:Name="MouseOverHighlight"
                   RadiusX="3"
                   RadiusY="3"
                   Fill="White"
                   Opacity="0" />
        </Grid>
        <ToolTipService.ToolTip>
            <ContentControl Content="{TemplateBinding FormattedDependentValue}" />
        </ToolTipService.ToolTip>
    </Border>
</ControlTemplate>

Solution

  • I think you just need to move the 'PerformanceBarChartBarTemplate' control template above the style you defined in the resource section.

    Edit: First you need to wrap your template in a style and give it a name

    <Style x:Key="BarDataPointStyle" TargetType="toolkit:DataPoint">
        <Setter Property="Template" Value="{StaticResource PerformanceBarChartBarTemplate}"/>
    </Style>
    

    The reason of doing this is because I noticed I have to have the inner style named 'DataPointStyle' to get it working, and then I use BasedOn to get your template. Here is how you define the palette.

        <toolkit:Chart.Palette>
            <toolkit:ResourceDictionaryCollection>
                <ResourceDictionary>
                    <Style x:Key="DataPointStyle" TargetType="toolkit:BarDataPoint" BasedOn="{StaticResource BarDataPointStyle}">
                        <Setter Property="Background" Value="Yellow" />
                        <Setter Property="BorderBrush" Value="Black" />
                    </Style>
                </ResourceDictionary>
                <ResourceDictionary>
                    <Style x:Key="DataPointStyle" TargetType="toolkit:BarDataPoint" BasedOn="{StaticResource BarDataPointStyle}">
                        <Setter Property="Background" Value="Red" />
                        <Setter Property="BorderBrush" Value="Black" />
                    </Style>
                </ResourceDictionary>
            </toolkit:ResourceDictionaryCollection>
        </toolkit:Chart.Palette>
    

    I hope this helps.

    Solution 2: Just replace your setter of the Palette with this one. You will notice I added a x:Key to the style, which was what you were missing. I tested it and it works.

        <Setter Property="Palette">
            <Setter.Value>
                <toolkit:ResourceDictionaryCollection>
                    <ResourceDictionary>
                        <Style x:Key="DataPointStyle" TargetType="toolkit:BarDataPoint">
                            <Setter Property="Background"
                                    Value="#FF57007f" />
                            <Setter Property="BorderBrush"
                                    Value="#FF2e0007" />
                            <Setter Property="Template"
                                    Value="{StaticResource PerformanceBarChartBarTemplate}" />
                        </Style>
                    </ResourceDictionary>
    
                    <ResourceDictionary>
                        <Style x:Key="DataPointStyle" TargetType="toolkit:BarDataPoint">
                            <Setter Property="Background"
                                    Value="Red" />
                            <Setter Property="BorderBrush"
                                    Value="Black" />
                            <Setter Property="Template"
                                    Value="{StaticResource PerformanceBarChartBarTemplate}" />
                        </Style>
                    </ResourceDictionary>
                </toolkit:ResourceDictionaryCollection>
            </Setter.Value>
        </Setter>