Recently John showed how to create half-circle gauges and now I am glad to announce that RadGauge, both WPF and Silverlight, supports half-circle and quarter-circle styles out of the box. All you need to do is provide the correct resource through a ResourceDictionary and then use the corresponding style. The styles are named after the major geographical directions -- North, East, South and West, well we only use the first letters here - N, E, S and W. So the styles you need are <Theme>RadialGaugeHalfCircle<Direction>Style and <Theme>RadialScaleHalfCircle<Direction>Style. Check the following example - semi-circular, south-directed vista-styled gauge:
And this is the XAML used:
<Grid.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Telerik.Windows.Controls.Gauge;component/Themes/generic.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Grid.Resources>
<telerik:RadGauge Name="radGauge" Width="340" Height="200">
<telerik:RadialGauge Name="radialGauge" Style="{StaticResource VistaRadialGaugeHalfCircleSStyle}">
<telerik:RadialScale Style="{StaticResource VistaRadialScaleHalfCircleSStyle}">
</telerik:RadialScale>
</telerik:RadialGauge>
</telerik:RadGauge>
The "telerik" prefix maps to "http://schemas.telerik.com/2008/xaml/presentation".
You can use the same approach for quarter-style gauges. The styles you need are <Theme>RadialGaugeQuarterCircle<Direction>Style and <Theme>RadialScaleQuarterCircle<Direction>Style. The directions here are North-West, North-East, South-East and South-West, so you can use NW, NE, SE and SW. North-west vista radial gauge looks like this:
XAML:
<telerik:RadGauge Name="radGauge" Width="300" Height="300">
<telerik:RadialGauge Name="radialGauge" Style="{StaticResource VistaRadialGaugeQuarterCircleNWStyle}">
<telerik:RadialScale Style="{StaticResource VistaRadialScaleQuarterCircleNWStyle}">
</telerik:RadialScale>
</telerik:RadialGauge>
</telerik:RadGauge>
The usage in Silverlight is similar:
<UserControl x:Class="SilverlightApplication1.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
xmlns:control="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Gauge"
xmlns:gauge="clr-namespace:Telerik.Windows.Controls.Gauges;assembly=Telerik.Windows.Controls.Gauge"
Width="300" Height="300">
<Grid x:Name="LayoutRoot" Background="White">
<Grid.Resources>
<ResourceDictionary>
<telerik:ResourceDictionary.MergedDictionaries>
<telerik:ResourceDictionary
Source="/Telerik.Windows.Controls.Gauge;component/Themes/Generic.xaml"
Keys="RadialGaugeQuarterCircleNWStyle,RadialScaleQuarterCircleNWStyle">
</telerik:ResourceDictionary>
</telerik:ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Grid.Resources>
<control:RadGauge x:Name="RadGauge1" Width="300" Height="300">
<gauge:RadialGauge x:Name="RadialGauge1" Style="{StaticResource RadialGaugeQuarterCircleNWStyle}" >
<gauge:RadialScale x:Name="RadialScale1" Style="{StaticResource RadialScaleQuarterCircleNWStyle}">
</gauge:RadialScale>
</gauge:RadialGauge>
</control:RadGauge>
</Grid>
</UserControl>
For more details you can check our online examples, which you can also download from your accounts:
Have fun with RadGauge.