Articles in this section
Category / Section

What is the use of the ShowRange property of the SfRangeSlider?

2 mins read

The ShowRange property is a Boolean property of the SfRangeSlider to show the RangeStart and RangeEnd instead of a single value.

When the ShowRange property is set to True, it shows the selected range for the SfRangeSlider depending on the RangeStart and RangeEnd values.

When the ShowRange property is set to False, the RangeEnd and RangeStart are not reflected in the selected range, it considers only the value of the SfRangeSlider to set the Range in the SfRangeSlider.

The same has been demonstrated using the following code example.

XAML

//Code explains how to set the ShowRange property for the SfRangeSlider when it value as true
<Window x:Class="SfRangeSlider.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:syncfusion="http://schemas.syncfusion.com/wpf"    
        Title="MainWindow" Height="350" Width="525">
<Grid Name="grid1">
<StackPanel Orientation="Vertical">
<TextBlock Text="ShowRange Value True" Width="150"></TextBlock>
<syncfusion:SfRangeSlider  Height="40" Width="300" RangeStart="8" RangeEnd="20" ShowRange="True">
</syncfusion:SfRangeSlider>
</StackPanel>
</Grid>
</Window>

C#

//Code explains how to set the ShowRange property for the SfRangeSlider when it value as true
public MainWindow()
        {
            InitializeComponent();
            StackPanel stack1 = new StackPanel();
            stack1.Orientation = Orientation.Vertical;
            TextBlock Text1 = new TextBlock();
            Text1.Text = "ShowRange Value True";
            Text1.Width = 150;
            SfRangeSlider RangeSlider = new SfRangeSlider();
  //Code shows how to set the ShowRange property to true            
            RangeSlider.ShowRange = true;
            RangeSlider.Width = 300;
            RangeSlider.Height = 40;
            RangeSlider.RangeStart = 8;
            RangeSlider.RangeEnd = 20;
            stack1.Children.Add(Text1);
            stack1.Children.Add(RangeSlider);
            grid1.Children.Add(stack1);
       }

Output:

The following screenshot shows how the Range of the SfRangeSlider, shown when the ShowRange property’s value is True.

 

ShowRange value true

Figure 1: ShowRange as True

XAML

//Code explains how to set the ShowRange property for the SfRangeSlider when it value as false
<Window x:Class="SfRangeSlider.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:syncfusion="http://schemas.syncfusion.com/wpf"
        Title="MainWindow" Height="350" Width="525">
<Grid Name="grid1">
<StackPanel Orientation="Vertical">
<TextBlock Text="ShowRange Value False” Width="150"></TextBlock>
<syncfusion:SfRangeSlider  Height="40" Width="300" ShowRange="False" Value="25">
</syncfusion:SfRangeSlider>
</StackPanel>
</Grid>
</Window>

C#

// Code explains how to set the ShowRange property for the SfRangeSlider when it value as false
 public MainWindow()
          {
            InitializeComponent();
            StackPanel stack1 = new StackPanel();
            stack1.Orientation = Orientation.Vertical;
            TextBlock Text1 = new TextBlock();
            Text1.Text = "ShowRange Value False";
            Text1.Width = 150;
            SfRangeSlider RangeSlider = new SfRangeSlider();
          //Code shows how to set the ShowRange property to false            
            RangeSlider.ShowRange = false;
            RangeSlider.Width = 300;
            RangeSlider.Height = 40;
            RangeSlider.Value =25;
            stack1.Children.Add(Text1);
            stack1.Children.Add(RangeSlider);
            grid1.Children.Add(stack1);         
         }

Output:

The following screenshot shows how the Range of the SfRangeSlider, shown when the ShowRange property’s value is False.

 

ShowRange value false

Figure 2: ShowRange as False

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied