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
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 |
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 |
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 |
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 |
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 |
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 |
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 |
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 |
---|
Microsoft.UI.Xaml.Automation.Peers.AutomationPeer |