This is a migrated thread and some comments may be shown as answers.

Applied ChartLegendItemStyle but lose Legend Item Shape

7 Answers 134 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Daren May
Top achievements
Rank 1
Daren May asked on 21 Apr 2010, 05:56 PM
Hi,

I am adding a custom style to the ChartLegendItem:

 

 

 

 
    <SolidColorBrush x:Key="LegendForeground" 
                     Color="#FF000000" /> 
    <LinearGradientBrush x:Key="LegendItemMarkerMask" 
                         EndPoint="0.5,1" 
                         StartPoint="0.5,0">  
        <GradientStop Color="#D8FFFFFF" 
                      Offset="0.009" /> 
        <GradientStop Color="#66FFFFFF" 
                      Offset="1" /> 
        <GradientStop Color="Transparent" 
                      Offset="0.43" /> 
        <GradientStop Color="#7FFFFFFF" 
                      Offset="0.42" /> 
    </LinearGradientBrush> 
    <SolidColorBrush x:Key="LegendItemMarkerMaskStroke" 
                     Color="White" /> 
    <System:Double x:Key="LegendItemMarkerMaskStrokeThickness">1</System:Double> 
    <SolidColorBrush x:Key="LegendItemMarkerMaskOpacityMask" 
                     Color="#FF000000" /> 
    <SolidColorBrush x:Key="LegendItemMarkerMask2" 
                     Color="Transparent" /> 
    <Style x:Key="TrimmedChartLegendItem" 
           TargetType="Telerik_Windows_Controls_Charting:ChartLegendItem">  
        <Setter Property="Foreground" 
                Value="{StaticResource LegendForeground}" /> 
        <Setter Property="Padding" 
                Value="5,0,5,0" /> 
        <Setter Property="Margin" 
                Value="0,3,0,2" /> 
        <Setter Property="Template">  
            <Setter.Value> 
                <ControlTemplate TargetType="Telerik_Windows_Controls_Charting:ChartLegendItem">  
                    <Grid HorizontalAlignment="Stretch" 
                          VerticalAlignment="Top">  
                        <Grid.ColumnDefinitions> 
                            <ColumnDefinition Width="Auto" /> 
                            <ColumnDefinition /> 
                        </Grid.ColumnDefinitions> 
                        <Path x:Name="PART_LegendItemMarker" 
                              Stretch="Fill" 
                              Height="16" 
                              Margin="{TemplateBinding Margin}" 
                              Style="{TemplateBinding ItemStyle}" 
                              Width="16" 
                              Data="" /> 
                        <Path Fill="{StaticResource LegendItemMarkerMask}" 
                              Stretch="Fill" 
                              Stroke="{StaticResource LegendItemMarkerMaskStroke}" 
                              StrokeThickness="{StaticResource LegendItemMarkerMaskStrokeThickness}" 
                              Height="14" 
                              Margin="{TemplateBinding Margin}" 
                              Width="14" 
                              OpacityMask="{StaticResource LegendItemMarkerMaskOpacityMask}" 
                              Data="" /> 
                        <Path Fill="{StaticResource LegendItemMarkerMask2}" 
                              Stretch="Fill" 
                              Height="14" 
                              Margin="{TemplateBinding Margin}" 
                              Width="14" 
                              Data="" /> 
                        <TextBlock Margin="{TemplateBinding Margin}" 
                                   Grid.Column="1" 
                                   Foreground="{TemplateBinding Foreground}" 
                                   Width="140" 
                                   Padding="{TemplateBinding Padding}" 
                                   Text="{TemplateBinding Label}">  
                            <Interactivity:Interaction.Behaviors> 
                                <Behaviors:EllipsisTextBlockBehavior /> 
                            </Interactivity:Interaction.Behaviors> 
                        </TextBlock> 
                    </Grid> 
                </ControlTemplate> 
            </Setter.Value> 
        </Setter> 
    </Style> 


I'm getting the customizations to the TextBlock, etc. but I am losing the Legend Item Shape from the display. Any Ideas?

I refer to the above style via:

 

    <Style x:Key="chartLegendStyle" 
           TargetType="Telerik_Windows_Controls_Charting:ChartLegend">  
        <Setter Property="Foreground" 
                Value="#00000000" /> 
        <Setter Property="Background" 
                Value="#00000000" /> 
        <Setter Property="Padding" 
                Value="10,10,10,5" /> 
        <Setter Property="Margin" 
                Value="0,0,20,0" /> 
        <Setter Property="BorderBrush" 
                Value="#00000000" /> 
        <Setter Property="BorderThickness" 
                Value="1,1,1,1" /> 
        <Setter Property="TitleFontWeight" 
                Value="Bold" /> 
        <Setter Property="MaxWidth" 
                Value="200" /> 
        <Setter Property="LegendItemStyle" 
                Value="{StaticResource TrimmedChartLegendItem}" /> 
 
        <Setter Property="Template">  
            <Setter.Value> 
                <ControlTemplate TargetType="Telerik_Windows_Controls_Charting:ChartLegend">  
                    <Border Background="{TemplateBinding Background}" 
                            BorderBrush="{TemplateBinding BorderBrush}" 
                            BorderThickness="{TemplateBinding BorderThickness}">  
                        <Grid Margin="{TemplateBinding Padding}">  
                            <Grid.RowDefinitions> 
                                <RowDefinition Height="Auto" /> 
                                <RowDefinition Height="*" /> 
                            </Grid.RowDefinitions> 
                            <ContentControl FontWeight="{TemplateBinding TitleFontWeight}" 
                                            Foreground="{TemplateBinding Foreground}" 
                                            Content="{TemplateBinding Header}" 
                                            ContentTemplate="{TemplateBinding HeaderTemplate}" /> 
                            <ItemsPresenter Grid.Row="1" /> 
                        </Grid> 
                    </Border> 
                </ControlTemplate> 
            </Setter.Value> 
        </Setter> 
        <Setter Property="ItemsPanel">  
            <Setter.Value> 
                <ItemsPanelTemplate> 
                    <StackPanel Orientation="{Binding ItemsPanelOrientation}" 
                                Width="200" /> 
                </ItemsPanelTemplate> 
            </Setter.Value> 
        </Setter> 
        <Setter Property="HeaderTemplate">  
            <Setter.Value> 
                <DataTemplate> 
                    <Grid> 
                        <TextBlock Height="Auto" 
                                   TextWrapping="Wrap" 
                                   HorizontalAlignment="Left" 
                                   Width="Auto" 
                                   FontSize="12" 
                                   Padding="0,0,0,2" 
                                   Text="{Binding}" /> 
                    </Grid> 
                </DataTemplate> 
            </Setter.Value> 
        </Setter> 
    </Style> 

 If I comment out the line below:

        <Setter Property="LegendItemStyle"    
                Value="{StaticResource TrimmedChartLegendItem}" />   

The legend item shape appears as expected.

Any ideas?
 

7 Answers, 1 is accepted

Sort by
0
Sia
Telerik team
answered on 26 Apr 2010, 02:17 PM
Hello Daren May,

The Legend Item Shapes disappear because the Data of your Path elements is empty in your new template. Just put the path you need there.

You can refer to our help section, where the Data is:
Data="M1,0A1,1,0,0,0,-1,0A1,1,0,0,0,1,0"
 
Hope this helps.

All the best,
Sia
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Anatoly Chekh
Top achievements
Rank 1
answered on 08 Feb 2011, 11:59 AM
Hello.

I have the same problem. The data you writed is for the circle marker. So I have two questions:

What's the data for the square markes?
And is there a way to use template without hardcode data? If I don't know what marke user want to see, I cann't use hardcoded type.

Thanks, Anatoly Chekh.
0
Sia
Telerik team
answered on 09 Feb 2011, 12:03 PM
Hello Anatoly Chekh,

In the attached file you can find the original template and resources in "Office Black" for the ChartLegendItem where the marker shape is not hard coded. I hope this helps.

Kind regards,
Sia
the Telerik team
Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
0
Anatoly Chekh
Top achievements
Rank 1
answered on 09 Feb 2011, 02:16 PM
Thanks a lot! It's work.
0
Gary
Top achievements
Rank 1
answered on 27 May 2011, 08:15 PM
following the main page attachment that was provide, I ended up with flat squares with no gradients. How do I get the original style?
0
Sia
Telerik team
answered on 31 May 2011, 09:02 AM
Hi Gary,

The attached style represents the default legend items' style for our default "Office Black" theme. It includes a mask, which is visualized by a rectangle:

<!-- Mask 1 -->
<Path x:Name="PART_SelectedState"
    Width="14"
    Height="14"
    Margin="{TemplateBinding Margin}"
    Fill="{StaticResource LegendItemMarkerMask}"
    Stroke="{StaticResource LegendItemMarkerMaskStroke}"
    StrokeThickness="{StaticResource LegendItemMarkerMaskStrokeThickness}"
    Stretch="Fill">
    <Path.Data>
        <PathGeometry x:Name="PART_ItemMarkerMaskGeometry" />
    </Path.Data>
</Path>

Please make sure that you have it in your custom style and let me know if your problem is not solved.

Kind regards,
Sia
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Gary
Top achievements
Rank 1
answered on 01 Jun 2011, 05:25 PM
Thanks
Tags
Chart
Asked by
Daren May
Top achievements
Rank 1
Answers by
Sia
Telerik team
Anatoly Chekh
Top achievements
Rank 1
Gary
Top achievements
Rank 1
Share this question
or