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

Rounded corners on legend

1 Answer 19 Views
Chart
This is a migrated thread and some comments may be shown as answers.
madladuk
Top achievements
Rank 2
madladuk asked on 14 Jul 2010, 10:31 AM
Can you have rounded corners for the box that is used for the legend ?

P

1 Answer, 1 is accepted

Sort by
0
Sia
Telerik team
answered on 16 Jul 2010, 08:24 AM
Hello madladuk,

If you need to change the shape of the Legend items, please review our example which shows the available legend functionality.

If you need to set CornerRadius to the whole Legend, please put the following style in your resources:
xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Charting"
xmlns:controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
xmlns:charting="clr-namespace:Telerik.Windows.Controls.Charting;assembly=Telerik.Windows.Controls.Charting">
 
<UserControl.Resources>
 
<SolidColorBrush x:Key="LegendForeground" Color="#FF000000" />
<LinearGradientBrush x:Key="LegendBackground" EndPoint="1.96,0.5" StartPoint="-0.96,0.5">
    <GradientStop Color="#FFB5B5B5"/>
    <GradientStop Color="#FFF0F0F0" Offset="0.5"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="LegendBorderBrush" Color="#FF848484" />
<Thickness x:Key="LegendBorderThickness">1</Thickness>
 
<Style x:Key="CustomLegend" TargetType="charting:ChartLegend">
    <Setter Property="Foreground" Value="{StaticResource LegendForeground}" />
    <Setter Property="Background" Value="{StaticResource LegendBackground}" />
    <Setter Property="Padding" Value="10,10,10,5" />
    <Setter Property="Margin" Value="0"/>
    <Setter Property="BorderBrush" Value="{StaticResource LegendBorderBrush}" />
    <Setter Property="BorderThickness" Value="{StaticResource LegendBorderThickness}" />
    <Setter Property="TitleFontWeight" Value="Bold" />
    <Setter Property="Template" >
        <Setter.Value>
            <ControlTemplate TargetType="charting:ChartLegend">
                <Border CornerRadius="30"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}" >
                    <Grid Margin="{TemplateBinding Padding}">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <ContentControl Foreground="{TemplateBinding Foreground}"
                                        FontWeight="{TemplateBinding TitleFontWeight}"
                                        Content="{TemplateBinding Header}"
                                        ContentTemplate="{TemplateBinding HeaderTemplate}"/>
                        <ItemsPresenter Grid.Row="1" />
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="ItemsPanel" >
        <Setter.Value>
            <ItemsPanelTemplate>
                <controls:RadWrapPanel Orientation="{Binding ItemsPanelOrientation}" />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="HeaderTemplate" >
        <Setter.Value>
            <DataTemplate>
                <Grid>
                    <TextBlock FontSize="12"
                            Padding="0,0,0,2" 
                            HorizontalAlignment="Left"
                            Width="Auto"
                            Height="Auto"
                            Text="{Binding}"
                            TextWrapping="Wrap" />
                </Grid>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>
 
</UserControl.Resources>

The resources above are valid for our default "Office Black" theme. If you use a different one, just let me know.

You need to set this style to your legend by putting the following line in your code-behind:
RadChart1.DefaultView.ChartLegend.Style = this.Resources["CustomLegend"] as Style;

I hope this helps you.
 
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
Tags
Chart
Asked by
madladuk
Top achievements
Rank 2
Answers by
Sia
Telerik team
Share this question
or