Configuring Needles (XamRadialGauge)

Purpose

This topic provides a conceptual overview of needles with the XamRadialGauge™ control. It describes the properties of the needles and also provides an example of how to configure them.

Required background

The following topics are prerequisites to understanding this topic:

Topic	Purpose
XamRadialGauge	This section gives you an overview of the XamRadialGauge™ control and its main features.
Adding XamRadialGauge	This topic explains using a code example how to add the XamRadialGauge™ control to a Xamarin.Forms application.

In this topic

This topic contains the following sections:

Needles Overview
Preview
Needle Properties
Configuring the Needle
Related Content

Needles Overview

Needles overview

A gauge needle is a visual element used to signify a gauge set value and consists of needle cap overlays or underlays; the gauge needle’s pivot point. The supported needle shapes and caps are set using the NeedleShape and NeedlePivotShape properties. For a visual representation of the different needle shape and the pivot shape refer to the needle sample

Preview

The following image is a preview of the XamRadialGauge control with the needle’s Value property set to 60.

Needle Properties

Needle properties summary

The following table summarizes the properties the XamRadialGauge control related to the needle.

Property Name	Property Type	Description
Value	`double`	Determines the value on the gauge to which the needle points.
NeedleStartExtent	`double`	Determines the beginning position of the needle, measured from the center of the gauge. The value of this property should be between -1 and 1.
NeedleEndExtent	`double`	Determines the ending position of the needle , measured from the center of the gauge. The value of this property should be between -1 and 1.
NeedleStartWidthRatio	`double`	Determines the width of the needle at its point. The value of this property should be between 0 and 1.
NeedleEndWidthRatio	`double`	Determines the width of the needle at its base. The value of this property should be between 0 and 1. This has no effect unless the NeedleShape property is set to any of the following values: Rectangle RectangleWithBulb Trapezoid TrapezoidWithBulb
NeedleShape	RadialGaugeNeedleShape	Determines which of the predefined needle shapes to use. It can be set to: Rectangle RectangleWithBulb Triangle TriangleWithBulb Trapezoid TrapezoidWithBulb Needle NeedleWithBulb None
NeedlePivotShape	RadialGaugePivotShape	Determines the pivot shape to use for the needle. It can be set to: Circle CircleWithHole CircleOverlay CircleOverlayWithHole CircleUnderlay CircleUnderlayWithHole None
NeedleBrush	`Brush`	Determines the brush of the gauge needle.
NeedleOutline	`Brush`	Determines the brush to use for the outline needle.
NeedlePivotBrush	`Brush`	Determines the fill brush for the needle pivot shape. This pivot brush only applies to the pivot shapes that draw an overlay or an underlay. Otherwise, this setting has no effect on the pivot shape.
NeedlePivotOutline	`Brush`	Determines the brush of the outlines of the needle pivot shape. This pivot brush only applies to the pivot shapes that draw an overlay or an underlay. Otherwise, this setting has no effect on the pivot shape.

Configuring the Needle

Example

The following screenshot demonstrates how the XamRadialGauge control with the properties of the needle looks as a result of the following setting:

Property	Value
Value	60
NeedleEndExtent	0.5
NeedleShape	Rectangle
PivotShape	CircleWithHole

Following is the code that implements this example

In XAML:

<ig:XamRadialGauge x:Name="radialGauge"
                   Value=“60”
                   NeedleEndExtent=“0.5”
                   NeedleShape=“Rectangle”
                   NeedlePivotShape=“CircleWithHole” />

In C#:

var radialGauge = new XamRadialGauge();
radialGauge.Value = 60;
radialGauge.NeedleEndExtent = 0.5;
radialGauge.NeedleShape = RadialGaugeNeedleShape.Rectangle;
radialGauge.NeedlePivotShape = RadialGaugePivotShape.CircleWithHole;

Related Content

The following topics provide additional information related to this topic:

Topic	Purpose
Adding XamRadialGauge	This topic explains using a code example how to add the XamRadialGauge™ control to a Xamarin.Forms application.
Configuring the Background (XamRadialGauge)	This topic provides a conceptual overview of the XamRadialGauge™ control’s backing feature. It describes the properties of the backing area and provides an example of its implementation.
Configuring Labels (XamRadialGauge)	This topic provides a conceptual overview of labels with the XamRadialGauge™ control. It describes the properties of the labels and also provides an example of how to configure the labels.
Configuring Ranges (XamRadialGauge)	This topic provides a conceptual overview of the XamRadialGauge™ control’s ranges. It describes the properties of the ranges and provides an example of how to add ranges to the radial gauge.
Configuring the Scale (XamRadialGauge)	This topic provides a conceptual overview of the XamRadialGauge™ control’s scale. It describes the properties of the scale and also provides an example of how to implement it.
Configuring the Tick Marks (XamRadialGauge)	This topic provides a conceptual overview of tick marks with the XamRadialGauge™ control. It describes the tick marks’ properties and provides an example of how to implement them.

Xamarin | Help Topics