Range Adorner in WPF Percent TextBox

30 Jan 20231 minute to read

Value of PercentTextBox can be visually indicated like a progress bar using range-adorner feature, this feature is disabled by default. You can show the adorner over PercentTextBox control by setting EnableRangeAdorner property to true. default value of EnableRangeAdorner is false. The adorner layer can be filled in the control area on the basis of the minimum and maximum values with considering the given value. Range Adorner is not displayed when a MinValue or MaxValue property is not set.

XAML

<syncfusion:PercentTextBox x:Name="percentTextBox" MinValue="0" PercentValue="63" MaxValue="100" EnableRangeAdorner="True" />

C#

PercentTextBox percentTextBox = new PercentTextBox();
percentTextBox.MinValue = 0;
percentTextBox.MaxValue = 100;
percentTextBox.PercentValue = 63;
percentTextBox.EnableRangeAdorner =true;

Changing background of range-adorner

You can change the background color of the range adorner using RangeAdornerBackground property.

XAML

<syncfusion:PercentTextBox x:Name="percentTextBox" MinValue="0" MaxValue="100" PercentValue="57" EnableRangeAdorner="True" RangeAdornerBackground="LightGreen"/>

C#

PercentTextBox percentTextBox = new PercentTextBox();
percentTextBox.MinValue = 0;
percentTextBox.MaxValue = 100;
percentTextBox.PercentValue = 57;
percentTextBox.EnableRangeAdorner = true;
percentTextBox.RangeAdornerBackground = Brushes.LightGreen;