.NET MAUI Horizontal Gauge

The Horizontal Gauge allows you to display the scale range in a linear form and horizontally oriented.

The following example shows the basic setup of the Horizontal Gauge.

xaml

 <telerik:RadHorizontalGauge x:Name="gauge">
     <telerik:RadHorizontalGauge.Axis>
         <telerik:GaugeLinearAxis Maximum="200"
                                    Minimum="0"
                                    Step="25" />
     </telerik:RadHorizontalGauge.Axis>
     <telerik:RadHorizontalGauge.Indicators>
         <telerik:GaugeShapeIndicator Value="90" />
     </telerik:RadHorizontalGauge.Indicators>
     <telerik:RadHorizontalGauge.Ranges>
         <telerik:GaugeRangesDefinition>
             <telerik:GaugeRange Color="Green"
                                   From="0"
                                   To="150" />
             <telerik:GaugeGradientRange From="150" To="200">
                 <telerik:RadGradientStop Offset="150" Color="Yellow" />
                 <telerik:RadGradientStop Offset="200" Color="Red" />
             </telerik:GaugeGradientRange>
         </telerik:GaugeRangesDefinition>
     </telerik:RadHorizontalGauge.Ranges>
 </telerik:RadHorizontalGauge>

The following image shows the end result.

See Also

• Radial Gauge
• Vertical Gauge
• Axis
• Indicators
• Ranges