Class GaugeRange

Create the range to add color bar in the gauge. GaugeRange is a visual element that helps to quickly visualize where a value falls on the axis.

Inheritance

System.Object

GaugeRange

Namespace: Syncfusion.UI.Xaml.Gauges

Assembly: Syncfusion.Gauge.WinUI.dll

Syntax

public class GaugeRange : Control

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="0" EndValue="35" Background="Red" />
                <gauge:GaugeRange StartValue="35" EndValue="75" Background="Yellow"/>
                <gauge:GaugeRange StartValue="75" EndValue="100" Background="Green"/>
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Constructors

GaugeRange()

Initializes a new instance of the GaugeRange class.

Declaration

public GaugeRange()

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50" EndValue="100" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Fields

EndValueProperty

Identifies the EndValue dependency property.

Declaration

public static readonly DependencyProperty EndValueProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for EndValue dependency property.

EndWidthProperty

Identifies the EndWidth dependency property.

Declaration

public static readonly DependencyProperty EndWidthProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for EndWidth dependency property.

GradientStopsProperty

Identifies the GradientStops dependency property.

Declaration

public static readonly DependencyProperty GradientStopsProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for GradientStops dependency property.

LabelProperty

Identifies the Label dependency property.

Declaration

public static readonly DependencyProperty LabelProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for Label dependency property.

LabelTemplateProperty

Identifies the LabelTemplate dependency property.

Declaration

public static readonly DependencyProperty LabelTemplateProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for LabelTemplate dependency property.

OffsetUnitProperty

Identifies the OffsetUnit dependency property.

Declaration

public static readonly DependencyProperty OffsetUnitProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for OffsetUnit dependency property.

RangeOffsetProperty

Identifies the RangeOffset dependency property.

Declaration

public static readonly DependencyProperty RangeOffsetProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for RangeOffset dependency property.

StartValueProperty

Identifies the StartValue dependency property.

Declaration

public static readonly DependencyProperty StartValueProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for StartValue dependency property.

StartWidthProperty

Identifies the StartWidth dependency property.

Declaration

public static readonly DependencyProperty StartWidthProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for StartWidth dependency property.

WidthUnitProperty

Identifies the WidthUnit dependency property.

Declaration

public static readonly DependencyProperty WidthUnitProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for WidthUnit dependency property.

Properties

EndValue

Gets or sets the value that specifies the range end value.

Declaration

public double EndValue { get; set; }

Property Value

Type	Description
System.Double	It defines the end value of the range. The default value is 0.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange EndValue="100" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

EndWidth

Gets or sets the value that specifies the range end width. You can specify value either in logical pixel or radius factor using the WidthUnit property.

Declaration

public double EndWidth { get; set; }

Property Value

Type	Description
System.Double	It defines the end width of the range. The default value is 10.

Examples

If WidthUnit is Factor, value must be given from 0 to 1. Here range start width is calculated by EndWidth * axis radius value. Example: EndWidth value is 0.2 and axis radius is 100, range start width is 20(0.2 * 100) logical pixels. if WidthUnit is Pixel, the defined value is set for the end width of the range.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50"
                                  EndValue="100"
                                  RangeOffset="10"
                                  OffsetUnit="Factor"
                                  StartWidth="10"/>
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

GradientStops

Gets or sets a collection of GaugeGradientStop to fill the gradient brush to the gauge range.

Declaration

public ObservableCollection<GaugeGradientStop> GradientStops { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<GaugeGradientStop>	A collection of the GaugeGradientStop objects associated with the brush, each of which specifies a color and an offset along the axis. The default is an empty collection.

Examples

The below examples shows, how to add a collection of gradient stop to the gauge range.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="0"
                                  EndValue="100">
                    <gauge:GaugeRange.GradientStops>
                                <gauge:GaugeGradientStop Value="0"
                                                         Color="Green" />
                                <gauge:GaugeGradientStop Value= "50"
                                                         Color="Yellow" />
                                <gauge:GaugeGradientStop Value="100"
                                                         Color="Red" />
                            </gauge:GaugeRange.GradientStops>
                </gauge:GaugeRange>
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Label

Gets or sets the value that specifies the text for range.

Declaration

public string Label { get; set; }

Property Value

Type	Description
System.String	It defines the string for the range label. The default value is string.Empty.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowTicks="False"
                          ShowLabels="False">
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="0"
                                  EndValue="30"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Red"
                                  Label="Slow" />
                <gauge:GaugeRange StartValue="30"
                                  EndValue="70"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Yellow"
                                  Label="Moderate" />
                <gauge:GaugeRange StartValue="70"
                                  EndValue="100"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Green"
                                  Label="Fast" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

LabelTemplate

Gets or sets the data template to customizes the label for range.

Declaration

public DataTemplate LabelTemplate { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.DataTemplate	The template for the range labels. The registered default is null.

Remarks

Its DataContext is GaugeRange.

Examples

<Page.Resources>
    <DataTemplate x:Key="RangeLabelTemplate">
        <Grid Background="LightBlue"
              BorderThickness="1"
              BorderBrush="Red">
            <TextBlock Text="{Binding Label}"
                       Foreground="Red"
                       FontSize="30" />
        </Grid>
    </DataTemplate>
</Page.Resources>

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowTicks="False"
                          ShowLabels="False">
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="0"
                                  EndValue="30"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Red"
                                  Label="Slow"
                                  LabelTemplate="{StaticResource RangeLabelTemplate}" />
                <gauge:GaugeRange StartValue="30"
                                  EndValue="70"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Yellow"
                                  Label="Moderate"
                                  LabelTemplate="{StaticResource RangeLabelTemplate}" />
                <gauge:GaugeRange StartValue="70"
                                  EndValue="100"
                                  StartWidth="0.5"
                                  EndWidth="0.5"
                                  WidthUnit="Factor"
                                  Background="Green"
                                  Label="Fast"
                                  LabelTemplate="{StaticResource RangeLabelTemplate}" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

OffsetUnit

Gets or sets the value that indicates the to calculate the range offset either in logical pixel or factor.

Declaration

public SizeUnit OffsetUnit { get; set; }

Property Value

Type	Description
SizeUnit	One of the SizeUnit enumeration that specifies how the RangeOffset value is considered. The default mode is Pixel.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50" EndValue="100" RangeOffset="10" OffsetUnit="Factor" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

RangeOffset

Gets or sets the value that specifies the range position. You can specify value either in logical pixel or radius factor using the OffsetUnit property.

Declaration

public double RangeOffset { get; set; }

Property Value

Type	Description
System.Double	It defines offset of the range either in pixel or factor. The default value is double.NaN.

Examples

If WidthUnit is Factor, value will be given from 0 to 1. Here range placing position is calculated by RangeOffset * axis radius value. Example: RangeOffset value is 0.2 and axis radius is 100, range is moving 20(0.2 * 100) logical pixels from axis outer radius. If WidthUnit is Pixel, the given value distance range moves from the outer radius axis. When you specify RangeOffset is negative, the range will be positioned outside the axis.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50" EndValue="100" RangeOffset="10" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

StartValue

Gets or sets the value that specifies the range start value.

Declaration

public double StartValue { get; set; }

Property Value

Type	Description
System.Double	It defines the start value of the range. The default value is 0.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

StartWidth

Gets or sets the value that specifies the range start width. You can specify value either in logical pixel or radius factor using the WidthUnit property.

Declaration

public double StartWidth { get; set; }

Property Value

Type	Description
System.Double	It defines the start width of the range. The default value is 10.

Examples

If WidthUnit is Factor, value must be given from 0 to 1. Here range start width is calculated by StartWidth * axis radius value. Example: StartWidth value is 0.2 and axis radius is 100, range start width is 20(0.2 * 100) logical pixels. if WidthUnit is Pixel, the defined value is set for the start width of the range.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50"
                                  EndValue="100"
                                  RangeOffset="10"
                                  OffsetUnit="Factor"
                                  StartWidth="10"/>
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

WidthUnit

Gets or sets the value that indicates the whether range start and end width can be calculated using logical pixel or radius factor.

Declaration

public SizeUnit WidthUnit { get; set; }

Property Value

Type	Description
SizeUnit	One of the SizeUnit enumeration that specifies how the StartWidth and EndWidth values are considered. The default mode is Pixel.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:GaugeRange StartValue="50" EndValue="100" RangeOffset="10" OffsetUnit="Factor" SizeUnit="Factor" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Methods

OnApplyTemplate()

Invoke to render GaugeRange class.

Declaration

protected override void OnApplyTemplate()

OnCreateAutomationPeer()

Declaration

protected override AutomationPeer OnCreateAutomationPeer()

Returns

Type	Description
Microsoft.UI.Xaml.Automation.Peers.AutomationPeer