Sliverlight 3 RadialBar

[Michael Wasmer]

Is there a way to put a seperator between radial bars on a radguage. I have attached an mockup of what I am looking to do.

[Andrey]

Hi Michael Wasmer,

You can do it using custom tick marks. For example:

<UserControl x:Class="Telerik.RadGauge.Silverlight.MainPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             Width="1000" Height="800">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Telerik.Windows.Controls.Gauge;component/Themes/Generic.xaml" />
            </ResourceDictionary.MergedDictionaries>

            <Style x:Key="RectangleTick" TargetType="telerik:CustomTickMark">
                <Setter Property="Location" Value="OverCenter" />
                <Setter Property="Offset" Value="0" />
                <Setter Property="Format" Value="{}{0:F0}" />
                <Setter Property="Length" Value="0.15" />
                <Setter Property="TickWidth" Value="0.1" />
                <Setter Property="FontSize" Value="11" />
                <Setter Property="Background" Value="Black" />
                <Setter Property="BorderBrush" Value="Black" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerik:CustomTickMark">
                            <Grid>
                                <Rectangle Stretch="Fill"
                                   HorizontalAlignment="Stretch"
                                   VerticalAlignment="Stretch"
                                   Fill="{TemplateBinding Background}"
                                   Stroke="{TemplateBinding BorderBrush}"
                                   StrokeThickness="{TemplateBinding BorderThickness}" />
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Setter Property="ItemTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <TextBlock />
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

        </ResourceDictionary>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
        <telerik:RadGauge Width="500" Height="270">
            <telerik:RadialGauge Style="{StaticResource RadialGaugeHalfCircleNStyle}">
                <telerik:RadialScale Style="{StaticResource RadialScaleHalfCircleNStyle}">
                    <telerik:RangeList>
                        <telerik:RadialRange Min="0" Max="90"
                             StartWidth="0"
                             EndWidth="0"
                             IndicatorBackground="Red"
                             Background="Red" />
                        <telerik:RadialRange Min="90" Max="95"
                             StartWidth="0"
                             EndWidth="0"
                             IndicatorBackground="Green"
                             Background="Green" />
                        <telerik:RadialRange Min="95" Max="100"
                             StartWidth="0"
                             EndWidth="0"
                             IndicatorBackground="Blue"
                             Background="Blue" />
                    </telerik:RangeList>
                    <telerik:IndicatorList>
                        <telerik:RadialBar UseRangeColor="True"
                            RangeColorMode="ProportionalBrush"
                            Value="100" />
                    </telerik:IndicatorList>
                    <telerik:TickList>
                        <telerik:CustomTickMark Value="90"
                            Style="{StaticResource RectangleTick}" />
                        <telerik:CustomTickMark Value="95"
                            Style="{StaticResource RectangleTick}" />
                    </telerik:TickList>
                </telerik:RadialScale>
            </telerik:RadialGauge>
        </telerik:RadGauge>
    </Grid>
</UserControl>

Regards,
Andrey Murzov
the Telerik team