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

RadialScale - Needle Appearance

1 Answer 68 Views
Gauges
This is a migrated thread and some comments may be shown as answers.
Frustrated Dev
Top achievements
Rank 1
Frustrated Dev asked on 06 Apr 2009, 12:33 PM
Hello,

Is it possible to customize the appearance of a Needle in a RadialScale? If so, how? The default needle looks like a stick with a sort of diamond at the end. I want a needle that looks like an elongated triangle or like the one shown in the Gauge demo (http://demos.telerik.com/wpf/). From what I can tell, the example code does not show how the needle shape is defined. Maybe I'm doing something wrong.

1 Answer, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 07 Apr 2009, 08:50 AM
Hi,

Yes, it is possible to customize the appearance of a Needle. Like most of the WPF controls Needle can have different templates and styles. To change appearance of the Needle you have to create new control template and style. For example:
<ControlTemplate x:Key="TriangleNeedleTemplate" TargetType="{x:Type telerik:Needle}">  
    <Grid Width="{TemplateBinding ActualWidth}" 
          Height="{TemplateBinding ActualHeight}">  
        <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="{TemplateBinding ActualHeight}"/>  
            <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
 
        <Grid.RowDefinitions> 
            <RowDefinition Height="{TemplateBinding ActualHeight}" /> 
        </Grid.RowDefinitions> 
                      
        <Polygon Grid.ColumnSpan="2" 
             Points="0,0 1,0.5 0,1 0,0" 
             Stretch="Fill" 
             Fill="{TemplateBinding Background}">  
                          
        </Polygon> 
    </Grid> 
</ControlTemplate> 
              
<Style x:Key="TriangleNeedleStyle" TargetType="{x:Type telerik:Needle}">  
    <Setter Property="Template" Value="{StaticResource TriangleNeedleTemplate}" /> 
</Style> 
 
Now you can apply new style to the needle in your project:
<telerik:RadialGauge> 
    <telerik:RadialScale Name="radialScale">  
        <telerik:IndicatorList> 
            <telerik:Needle Name="needle"                 
                Style="{StaticResource TriangleNeedleStyle}"/>  
        </telerik:IndicatorList> 
    </telerik:RadialScale> 
</telerik:RadialGauge> 
 


Sincerely yours,
Andrey Murzov
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
Tags
Gauges
Asked by
Frustrated Dev
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Share this question
or