We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

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

Platform: WPF |
Control: SfRangeSlider |
Published Date: February 18, 2015 |
Last Revised Date: June 21, 2019 |
.NET Framework: 4.5.1 |
Product Version: 12.4.0.24

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

2X faster development

The ultimate WPF UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon