RadialScale - Needle Appearance

2 posts, 0 answers
  1. Frustrated Dev
    Frustrated Dev avatar
    35 posts
    Member since:
    Oct 2006

    Posted 06 Apr 2009 Link to this post

    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.
  2. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 07 Apr 2009 Link to this post

    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.
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top