How to modify the needle length of the WinForms RadialGauge?

4 mins read

At present there is no direct option to customize the Needle Length in WinForms RadialGauge control and it is possible to modify the length of the needle using CustomRenderer support, which helps to customize all the elements appearance in RadialGauge. The following steps will guide you to achieve this requirement.

Step 1: Create a Custom control derived from the RadialGauge and implement a property to customize the Needle Length.

For example, here we have implemented a property named NeedleLength, to customize the Needle Length.

/// <summary>
/// A class which derived from the RadialGauge control.
/// </summary>
public class AdvancedRadialGauge : RadialGauge
{
  CustomRenderer custom;
  /// <summary>
  /// Constructor
  /// </summary>
  public AdvancedRadialGauge()
  {
     custom = new CustomRenderer(this);
     this.Renderer = custom;
  }
  // Local variable which holding the length of the needle.
  private int needleLength = 60;
  /// <summary>
  /// Gets or sets the NeedleLength value
  /// </summary>
  public int NeedleLength
  {
     get { return needleLength; }
     set { needleLength = value; }
  }
}

''' <summary>
''' A class which derived from the RadialGauge control.
''' </summary>
Public Class AdvancedRadialGauge
   Inherits RadialGauge
   Private custom As CustomRenderer
   ''' <summary>
   ''' Constructor
   ''' </summary>
   Public Sub New()
      custom = New CustomRenderer(Me)
      Me.Renderer = custom
   End Sub
   ' Local variable which holding the length of the needle.
   Private needleLength_Renamed As Integer = 60
   ''' <summary>
   ''' Gets or sets the NeedleLength value
   ''' </summary>
   Public Property NeedleLength() As Integer
     Get
       Return needleLength_Renamed
     End Get
     Set(ByVal value As Integer)
       needleLength_Renamed = value
     End Set
     End Property
End Class

Step 2: Create Custom Renderer class derived from the IRadialGaugeRanderer and this class will help to custom draw RadialGauge control. In this class, the needle is drawn using a function named DrawNeedle, and here the needle length is customized.

/// <summary>
/// Custom renderer class
/// </summary>
public class CustomRenderer : IRadialGaugeRenderer
{
   #region Varaibles
   /// </summary>
   /// Gets the radial gauge
   /// </summary>
   private AdvancedRadialGauge m_RadialGauge;
   /// <summary>
   /// Used to set bounds for the Font
   /// </summary>
   Single fontBoundY1, fontBoundY2;
   #endregion
 
   #region Properties
   /// <summary>
   /// Gets the Radial gauge
   /// </summary>
   internal AdvancedRadialGauge RadialGauge
   {
      get
      {
         return m_RadialGauge;
      }
   }
   #endregion
 
   #region Constructor
   /// <summary>
   /// Constructor of the Renderer class
   /// </summary>
   /// <param name="radialGauge"></param>
   public CustomRenderer(AdvancedRadialGauge radialGauge)
   {
      m_RadialGauge = radialGauge;  
   }
   #endregion
 
   #region IRadialGaugeRenderer Members
   /// <summary>
   /// Updates the renderer method.
   /// </summary>
   /// <param name="e"></param>
   public void UpdateRenderer(PaintEventArgs e)
   {
      AdjustFontBounds(e.Graphics, RadialGauge.Font);
      DrawOuterArc(e.Graphics, 135, 270, new Point(140, 140), 118);
      DrawNeedle(e.Graphics, 135, 270, m_RadialGauge.NeedleLength, 4, new Point(140, 140));
      DrawGaugeLabel(e.Graphics, new Point(140, 140), 118);
      DrawTickMarks(e.Graphics, new System.Drawing.Drawing2D.GraphicsPath(), 121, 135, 270, 4, new Point(140, 140), 95);
   }
   /// <summary>
   /// Method used to draw needle
   /// </summary>
   /// <param name="graphics">Graphics</param>
   /// <param name="m_GaugeArcStart">Arc start position</param>
   /// <param name="m_GaugeArcEnd">Arc end position</param>
   /// <param name="m_NeedleRadius">Needle radius</param>
   /// <param name="m_NeedleLength">Needle width</param>
   /// <param name="m_Center">Center point of the gauge</param>
   public void DrawNeedle(Graphics graphics, Int32 m_GaugeArcStart, Int32 m_GaugeArcEnd, Int32 m_NeedleRadius, Int32 m_NeedleLength, Point m_Center)
   {
      Single brushAngle = (Int32)(m_GaugeArcStart + (RadialGauge.Value - RadialGauge.MinimumValue) * m_GaugeArcEnd / (RadialGauge.MaximumValue - RadialGauge.MinimumValue)) % 360;
      Double needleAngle = brushAngle * Math.PI / 180;
      if (RadialGauge.ShowNeedle)
      {
        Point startPoint = new Point((Int32)(m_Center.X - m_NeedleRadius / 8 * Math.Cos(needleAngle)),
                                            (Int32)(m_Center.Y - m_NeedleRadius / 8 * Math.Sin(needleAngle)));
        Point endPoint = new Point((Int32)(m_Center.X + m_NeedleRadius * Math.Cos(needleAngle)),
                                         (Int32)(m_Center.Y + m_NeedleRadius * Math.Sin(needleAngle)));
        graphics.DrawLine(new Pen(this.RadialGauge.NeedleColor, 3), m_Center.X, m_Center.Y, endPoint.X, endPoint.Y);
        graphics.FillEllipse(new SolidBrush(this.RadialGauge.NeedleColor), m_Center.X - m_NeedleLength * 3, m_Center.Y - m_NeedleLength * 3, m_NeedleLength * 6, m_NeedleLength * 6);
      }
   }
}

''' <summary>
''' Custom renderer class
''' </summary>
Public Class CustomRenderer
    Implements IRadialGaugeRenderer
 
    #Region "Varaibles"
    ''' </summary>
    ''' Gets the radial gauge
    ''' </summary>
    Private m_RadialGauge As AdvancedRadialGauge
    ''' <summary>
    ''' Used to set bounds for the Font
    ''' </summary>
    Private fontBoundY1, fontBoundY2 As Single
    #End Region
 
    #Region "Properties"
    ''' <summary>
    ''' Gets the Radial gauge
    ''' </summary>
    Friend ReadOnly Property RadialGauge() As AdvancedRadialGauge
      Get
        Return m_RadialGauge
      End Get
    End Property
    #End Region
 
    #Region "Constructor"
    ''' <summary>
    ''' Constructor of the Renderer class
    ''' </summary>
    ''' <param name="radialGauge"></param>
    Public Sub New(ByVal radialGauge As AdvancedRadialGauge)
      m_RadialGauge = radialGauge
    End Sub
    #End Region
 
    #Region "IRadialGaugeRenderer Members"
    ''' <summary>
    ''' Updates the renderer method.
    ''' </summary>
    ''' <param name="e"></param>
    Public Sub UpdateRenderer(ByVal e As PaintEventArgs)
      AdjustFontBounds(e.Graphics, RadialGauge.Font)
      DrawOuterArc(e.Graphics, 135, 270, New Point(140, 140), 118)
      DrawNeedle(e.Graphics, 135, 270, m_RadialGauge.NeedleLength, 4, New Point(140, 140))
      DrawGaugeLabel(e.Graphics, New Point(140, 140), 118)
      DrawTickMarks(e.Graphics, New System.Drawing.Drawing2D.GraphicsPath(), 121, 135, 270, 4, New Point(140, 140), 95)
    End Sub
    ''' <summary>
    ''' Method used to draw needle
    ''' </summary>
    ''' <param name="graphics">Graphics</param>
    ''' <param name="m_GaugeArcStart">Arc start position</param>
    ''' <param name="m_GaugeArcEnd">Arc end position</param>
    ''' <param name="m_NeedleRadius">Needle radius</param>
    ''' <param name="m_NeedleLength">Needle width</param>
    ''' <param name="m_Center">Center point of the gauge</param>
    Public Sub DrawNeedle(ByVal graphics As Graphics, ByVal m_GaugeArcStart As Int32, ByVal m_GaugeArcEnd As Int32, ByVal m_NeedleRadius As Int32, ByVal m_NeedleLength As Int32, ByVal m_Center As Point)
      Dim brushAngle As Single = CInt(Math.Truncate(m_GaugeArcStart + (RadialGauge.Value - RadialGauge.MinimumValue) * m_GaugeArcEnd / (RadialGauge.MaximumValue - RadialGauge.MinimumValue))) Mod 360
      Dim needleAngle As Double = brushAngle * Math.PI / 180
      If RadialGauge.ShowNeedle Then
        Dim startPoint As New Point(CInt(Math.Truncate(m_Center.X - m_NeedleRadius / 8 * Math.Cos(needleAngle))), CInt(Math.Truncate(m_Center.Y - m_NeedleRadius / 8 * Math.Sin(needleAngle))))
        Dim endPoint As New Point(CInt(Math.Truncate(m_Center.X + m_NeedleRadius * Math.Cos(needleAngle))), CInt(Math.Truncate(m_Center.Y + m_NeedleRadius * Math.Sin(needleAngle))))
        graphics.DrawLine(New Pen(Me.RadialGauge.NeedleColor, 3), m_Center.X, m_Center.Y, endPoint.X, endPoint.Y)
        graphics.FillEllipse(New SolidBrush(Me.RadialGauge.NeedleColor), m_Center.X - m_NeedleLength * 3, m_Center.Y - m_ NeedleLength * 3, m_NeedleLength * 6, m_NeedleLength * 6)
      End If
   End Sub
End Class

Step 3: Here, we are applying NeedleLength in a customized RadialGauge.

MainForm.cs

public partial class Form1 : MetroForm
{
   #region Constructor
   public Form1()
   {
      InitializeComponent();
      this.advancedRadialGauge1.NeedleLength = 100;
      this.trackBarEx2.ValueChanged += new EventHandler(trackBarEx2_ValueChanged);
      this.advancedRadialGauge1.NeedleStyle = Syncfusion.Windows.Forms.Gauge.NeedleStyle.Pointer;
   }
   void trackBarEx2_ValueChanged(object sender, EventArgs e)
   {
      this.advancedRadialGauge1.NeedleLength = (sender as TrackBarEx).Value;
      this.advancedRadialGauge1.Invalidate();
   }
   private void trackBarEx1_ValueChanged(object sender, EventArgs e)
   {
      this.advancedRadialGauge1.Value = (sender as TrackBarEx).Value;
   }
   #endregion
}

Partial Public Class Form1
    Inherits MetroForm
    #Region "Constructor"
    Public Sub New()
       InitializeComponent()
       Me.advancedRadialGauge1.NeedleLength = 100
       AddHandler trackBarEx2.ValueChanged, AddressOf trackBarEx2_ValueChanged
         Me.advancedRadialGauge1.NeedleStyle = Syncfusion.Windows.Forms.Gauge.NeedleStyle.Pointer
       End Sub
       Private Sub trackBarEx2_ValueChanged(ByVal sender As Object, ByVal e As EventArgs)
         Me.advancedRadialGauge1.NeedleLength = (TryCast(sender, TrackBarEx)).Value
         Me.advancedRadialGauge1.Invalidate()
       End Sub
       Private Sub trackBarEx1_ValueChanged(ByVal sender As Object, ByVal e As EventArgs) Handles trackBarEx1.ValueChanged
         Me.advancedRadialGauge1.Value = (TryCast(sender, TrackBarEx)).Value
       End Sub
    #End Region
End Class

Show the needle length of radial gauge

Samples:

C#: RadialGauge_Needle_Customization_C#

VB: RadialGauge_Needle_Customization_VB

Reference link: https://help.syncfusion.com/windowsforms/radial-gauge/radial-gauge#custom-renderer

Did you find this information helpful?

Yes

Comments (0)

How to modify the needle length of the WinForms RadialGauge?

Access denied