RadialGuage Styling

[Rav Panchalingam]

Hi there,

This may be quite simple, but can someone please tell me how to change the styling of labels (font, size, color etc) for RadialGuages and LinearGuages.

Also, I've tried the following code to get SemiCircle gauge styles working.

<UserControl
    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:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    mc:Ignorable="d"
    x:Class="TestWPFBrowser.WeatherGadget"
    x:Name="UserControl"
    d:DesignWidth="640" d:DesignHeight="480" Width="640" Height="400">

    <UserControl.Resources>
     <ResourceDictionary>
      <ResourceDictionary.MergedDictionaries>
       <ResourceDictionary Source="/Telerik.Windows.Controls.Gauge;component/Themes/Office_Black/NormalView.Styles.xaml" />
      </ResourceDictionary.MergedDictionaries>
     </ResourceDictionary>
    </UserControl.Resources>

However I get the following error:

An error occurred while finding the resource dictionary "/Telerik.Windows.Controls.Gauge;component/Themes/Office_Black/NormalView.Styles.xaml".

Thanks for your help

Rav

[Andrey]

Hi Rav,

You can use the LabelProperties tag to change the font related properties.
The Q2 release does not contain resources like to Themes/Office_Black/NormalView.Styles.xaml. You can use the Themes/generic.xaml.
The following short example demonstrates the using of the LabelProperties tag for semicircle gauge:

<UserControl
    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:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    mc:Ignorable="d"
    x:Class="WpfApplication3.UserControl1"
    x:Name="UserControl"
    d:DesignWidth="640" d:DesignHeight="480" Width="640" Height="400">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Telerik.Windows.Controls.Gauge;component/Themes/generic.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <Grid>
        <telerik:RadGauge Name="radGauge">
            <Grid Name="sampleGrid" Width="340" Height="200">
                <telerik:RadialGauge Name="radialGauge"
                                     Style="{StaticResource Office_BlackRadialGaugeHalfCircleNStyle}">
                    <telerik:RadialScale Name="radialScale"
                                         Style="{StaticResource Office_BlackRadialScaleHalfCircleNStyle}">
                        <telerik:RadialScale.Label>
                            <telerik:LabelProperties Location="Outside"
                                                     FontFamily="Arial"
                                                     FontSize="10"
                                                     Foreground="Blue"
                                                     Format="{}{0:F1}" />
                        </telerik:RadialScale.Label>
                        <telerik:IndicatorList>
                            <telerik:Needle Name="needle"
                                            IsAnimated="True"/>
                        </telerik:IndicatorList>
                    </telerik:RadialScale>
                </telerik:RadialGauge>
            </Grid>
        </telerik:RadGauge>
    </Grid>
</UserControl>

You can use the Label property the same way for a linear scale.

Regards,
Andrey Murzov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.