All the controls missing in WPF. Over 1 million downloads.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

818 lines
39 KiB

<!--*************************************************************************************
Toolkit for WPF
Copyright (C) 2007-2025 Xceed Software Inc.
This program is provided to you under the terms of the XCEED SOFTWARE, INC.
COMMUNITY LICENSE AGREEMENT (for non-commercial use) as published at
https://github.com/xceedsoftware/wpftoolkit/blob/master/license.md
For more features, controls, and fast professional support,
pick up the Plus Edition at https://xceed.com/xceed-toolkit-plus-for-wpf/
Stay informed: follow @datagrid on Twitter or Like http://facebook.com/datagrids
***********************************************************************************-->
<local:DemoView x:Class="Xceed.Wpf.Toolkit.LiveExplorer.Samples.RangeSlider.Views.RangeSliderView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:local="clr-namespace:Xceed.Wpf.Toolkit.LiveExplorer"
xmlns:xctkconv="http://schemas.xceed.com/wpf/xaml/toolkit"
xmlns:conv="clr-namespace:Xceed.Wpf.Toolkit.LiveExplorer.Samples.RangeSlider.Converters"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
Title="RangeSlider">
<local:DemoView.Resources>
<xctkconv:SolidColorBrushToColorConverter x:Key="SolidColorBrushToColorConverter" />
<conv:AbsoluteAdditionConverter x:Key="AbsoluteAdditionConverter"/>
<conv:RangeSliderEnabledConverter x:Key="RangeSliderEnabledConverter"/>
<ObjectDataProvider x:Key="TickPlacement"
MethodName="GetValues"
ObjectType="{x:Type sys:Enum}">
<ObjectDataProvider.MethodParameters>
<x:Type TypeName="TickPlacement" />
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
<ObjectDataProvider x:Key="AutoToolTipPlacement"
MethodName="GetValues"
ObjectType="{x:Type sys:Enum}">
<ObjectDataProvider.MethodParameters>
<x:Type TypeName="AutoToolTipPlacement" />
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
<Style x:Key="LowerRangeStyle1"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="LowerRangeStyle2"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Ellipse x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="LowerRangeStyle3"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="19">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
<StackPanel x:Name="HorizontalContentPanel"
Orientation="Horizontal"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock x:Name="TextContentMin"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=Minimum, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock Text=" - "
Foreground="Turquoise"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock x:Name="TextContentLower"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=LowerValue, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</StackPanel>
<StackPanel x:Name="VerticalContentPanel"
Orientation="Vertical"
Visibility="Collapsed"
VerticalAlignment="Center">
<TextBlock Text="L"
Foreground="White" />
</StackPanel>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="30" />
<Setter Property="Visibility"
TargetName="VerticalContentPanel"
Value="Visible" />
<Setter Property="Visibility"
TargetName="HorizontalContentPanel"
Value="Collapsed" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="RangeStyle1"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
</Grid>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="RangeStyle2"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Ellipse x:Name="MainBorder"
Fill="{TemplateBinding Background}" />
</Grid>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="RangeStyle3"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="19">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
<StackPanel x:Name="HorizontalContentPanel"
Orientation="Horizontal"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock x:Name="TextContentLower"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=LowerValue, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock Text=" - "
Foreground="Turquoise"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock x:Name="TextContentHigher"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=HigherValue, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</StackPanel>
<StackPanel x:Name="VerticalContentPanel"
Orientation="Vertical"
Visibility="Collapsed"
VerticalAlignment="Center">
<TextBlock Text="R"
Foreground="White" />
</StackPanel>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="TextContentLower"
Property="Foreground"
Value="Fuchsia" />
<Setter TargetName="TextContentHigher"
Property="Foreground"
Value="Fuchsia" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="30" />
<Setter Property="Visibility"
TargetName="VerticalContentPanel"
Value="Visible" />
<Setter Property="Visibility"
TargetName="HorizontalContentPanel"
Value="Collapsed" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HigherRangeStyle1"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HigherRangeStyle2"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="10">
<Ellipse x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="10" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HigherRangeStyle3"
TargetType="{x:Type RepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Grid x:Name="MainGrid"
Height="19">
<Rectangle x:Name="MainBorder"
Fill="{TemplateBinding Background}"
Opacity="1" />
<StackPanel x:Name="HorizontalContentPanel"
Orientation="Horizontal"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock x:Name="TextContentHigher"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=HigherValue, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock Text=" - "
Foreground="Turquoise"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
<TextBlock x:Name="TextContentMax"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type xctk:RangeSlider}}, Path=Maximum, StringFormat=\{0:00.00\}}"
Foreground="White"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</StackPanel>
<StackPanel x:Name="VerticalContentPanel"
Orientation="Vertical"
Visibility="Collapsed"
VerticalAlignment="Center">
<TextBlock Text="H"
Foreground="White" />
</StackPanel>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="MainBorder"
Property="Opacity"
Value="0.75" />
</Trigger>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}"
Value="Vertical">
<Setter Property="Height"
TargetName="MainGrid"
Value="Auto" />
<Setter Property="Width"
TargetName="MainGrid"
Value="30" />
<Setter Property="Visibility"
TargetName="VerticalContentPanel"
Value="Visible" />
<Setter Property="Visibility"
TargetName="HorizontalContentPanel"
Value="Collapsed" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</local:DemoView.Resources>
<local:DemoView.Description>
<Paragraph FontSize="14"
FontFamily="Segoe">
The RangeSlider control lets you set a range with 2 slider thumbs. The lower limit is marked with the right side of the left thumb while the higher limit is marked with the left side of the right thumb.
</Paragraph>
</local:DemoView.Description>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="300" />
</Grid.RowDefinitions>
<GroupBox Header="Features"
Grid.Row="0"
Margin="5">
<Grid Margin="5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="75" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="160" />
<ColumnDefinition Width="105" />
<ColumnDefinition Width="155" />
<ColumnDefinition Width="105" />
</Grid.ColumnDefinitions>
<!-- Column 1 -->
<TextBlock Text="Minimum:"
VerticalAlignment="Center" />
<xctk:DoubleUpDown Grid.Column="1"
Value="{Binding Minimum, ElementName=_rangeSlider}"
FormatString="0.00"
Increment="{Binding Step, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Maximum:"
Grid.Row="1"
VerticalAlignment="Center" />
<xctk:DoubleUpDown Value="{Binding Maximum, ElementName=_rangeSlider}"
Grid.Row="1"
Grid.Column="1"
FormatString="0.00"
Increment="{Binding Step, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Lower Value:"
Grid.Row="2"
VerticalAlignment="Center" />
<xctk:DoubleUpDown Value="{Binding LowerValue, ElementName=_rangeSlider }"
Grid.Row="2"
Grid.Column="1"
FormatString="0.00"
Increment="{Binding Step, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Higher Value:"
Grid.Row="3"
VerticalAlignment="Center" />
<xctk:DoubleUpDown Value="{Binding HigherValue, ElementName=_rangeSlider}"
Grid.Row="3"
Grid.Column="1"
FormatString="0.00"
Increment="{Binding Step, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Step:"
Grid.Row="4"
VerticalAlignment="Center" />
<xctk:DoubleUpDown Value="{Binding Step, ElementName=_rangeSlider}"
Grid.Row="4"
Grid.Column="1"
FormatString="0.00"
VerticalAlignment="Center"
Margin="5"
ToolTip="Identify the RangeSlider's size of individual move, when clicking on the LowerRange or HigherRange."/>
<TextBlock Text="Orientation:"
Grid.Row="5"
VerticalAlignment="Center" />
<ComboBox Grid.Row="5"
Grid.Column="1"
SelectedIndex="0"
SelectedValue="{Binding Orientation, ElementName=_rangeSlider}"
SelectedValuePath="Content"
VerticalAlignment="Center"
Margin="5">
<ComboBoxItem Content="Horizontal" />
<ComboBoxItem Content="Vertical" />
</ComboBox>
<!-- Column 2 -->
<TextBlock Text="Lower Thumb Background:"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:ColorPicker Grid.Column="3"
SelectedColor="{Binding LowerThumbBackground, ElementName=_rangeSlider, Converter={StaticResource SolidColorBrushToColorConverter}}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Higher Thumb Background:"
Grid.Row="1"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:ColorPicker Grid.Row="1"
Grid.Column="3"
SelectedColor="{Binding HigherThumbBackground, ElementName=_rangeSlider, Converter={StaticResource SolidColorBrushToColorConverter}}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Lower Range Background:"
Grid.Row="2"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:ColorPicker Grid.Row="2"
Grid.Column="3"
SelectedColor="{Binding LowerRangeBackground, ElementName=_rangeSlider, Converter={StaticResource SolidColorBrushToColorConverter}}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Range Background:"
Grid.Row="3"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:ColorPicker Grid.Row="3"
Grid.Column="3"
SelectedColor="{Binding RangeBackground, ElementName=_rangeSlider, Converter={StaticResource SolidColorBrushToColorConverter}}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Higher Range Background:"
Grid.Row="4"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:ColorPicker Grid.Row="4"
Grid.Column="3"
SelectedColor="{Binding HigherRangeBackground, ElementName=_rangeSlider, Converter={StaticResource SolidColorBrushToColorConverter}}"
VerticalAlignment="Center"
Margin="5" />
<TextBlock Text="Auto ToolTip Placement:"
Grid.Row="5"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<ComboBox Grid.Row="5"
Grid.Column="3"
ItemsSource="{Binding Source={StaticResource AutoToolTipPlacement}}"
SelectedItem="{Binding AutoToolTipPlacement, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/sets whether a tooltip that contains the current value of a RangeSlider's Thumb displays when the Thumb is pressed. If a tooltip is displayed, this property also specifies the placement of the tooltip.">
</ComboBox>
<TextBlock Text="Auto ToolTip Precision:"
Grid.Row="6"
Grid.Column="2"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<xctk:IntegerUpDown Value="{Binding AutoToolTipPrecision, ElementName=_rangeSlider}"
Grid.Row="6"
Grid.Column="3"
Minimum="0"
Maximum="10"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/sets the number of digits that are displayed to the right side of the decimal point for the Value of a RangeSlider's Thumb in a tooltip." />
<!-- Column 3 -->
<TextBlock Text="Lower Range Style:"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<ComboBox x:Name="lowerRangeStyleComboBox"
Grid.Column="5"
SelectedIndex="0"
SelectedValue="{Binding LowerRangeStyle, ElementName=_rangeSlider}"
SelectedValuePath="Tag"
SelectionChanged="RangeStyleComboBox_SelectionChanged"
VerticalAlignment="Center"
Margin="5">
<ComboBoxItem Content="Default"
Tag="{x:Null}" />
<ComboBoxItem Content="Style 1"
Tag="{StaticResource LowerRangeStyle1}" />
<ComboBoxItem Content="Style 2"
Tag="{StaticResource LowerRangeStyle2}" />
<ComboBoxItem Content="Style 3"
Tag="{StaticResource LowerRangeStyle3}" />
</ComboBox>
<TextBlock Text="Range Style:"
Grid.Row="1"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<ComboBox x:Name="rangeStyleComboBox"
Grid.Row="1"
Grid.Column="5"
SelectedIndex="0"
SelectedValue="{Binding RangeStyle, ElementName=_rangeSlider}"
SelectedValuePath="Tag"
SelectionChanged="RangeStyleComboBox_SelectionChanged"
VerticalAlignment="Center"
Margin="5">
<ComboBoxItem Content="Default"
Tag="{x:Null}" />
<ComboBoxItem Content="Style 1"
Tag="{StaticResource RangeStyle1}" />
<ComboBoxItem Content="Style 2"
Tag="{StaticResource RangeStyle2}" />
<ComboBoxItem Content="Style 3"
Tag="{StaticResource RangeStyle3}" />
</ComboBox>
<TextBlock Text="Higher Range Style:"
Grid.Row="2"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<ComboBox x:Name="higherRangeStyleComboBox"
Grid.Row="2"
Grid.Column="5"
SelectedIndex="0"
SelectedValue="{Binding HigherRangeStyle, ElementName=_rangeSlider}"
SelectedValuePath="Tag"
SelectionChanged="RangeStyleComboBox_SelectionChanged"
VerticalAlignment="Center"
Margin="5">
<ComboBoxItem Content="Default"
Tag="{x:Null}" />
<ComboBoxItem Content="Style 1"
Tag="{StaticResource HigherRangeStyle1}" />
<ComboBoxItem Content="Style 2"
Tag="{StaticResource HigherRangeStyle2}" />
<ComboBoxItem Content="Style 3"
Tag="{StaticResource HigherRangeStyle3}" />
</ComboBox>
<TextBlock Text="Is Deferred Update Values:"
Grid.Row="3"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<CheckBox Grid.Row="3"
Grid.Column="5"
IsChecked="{Binding IsDeferredUpdateValues, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/Sets if the LowerValue and HigherValue should be updated only on mouse up." />
<TextBlock Text="Is Snap To Tick Enabled:"
Grid.Row="4"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<CheckBox Grid.Row="4"
Grid.Column="5"
IsChecked="{Binding IsSnapToTickEnabled, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/sets a value that indicates whether the RangeSlider automatically moves the selected Thumb to the closest tick mark." />
<TextBlock Text="Tick Placement:"
Grid.Row="5"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5" />
<ComboBox x:Name="_tickPlacementComboBox"
Grid.Row="5"
Grid.Column="5"
ItemsSource="{Binding Source={StaticResource TickPlacement}}"
SelectedItem="{Binding TickPlacement, ElementName=_rangeSlider}"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/sets the position of tick marks with respect to the Track of the RangeSlider.">
</ComboBox>
<TextBlock Text="Tick Frequency:"
Grid.Row="6"
Grid.Column="4"
VerticalAlignment="Center"
Margin="10,5,5,5"
IsEnabled="{Binding IsEnabled, ElementName=_tickFrequency}"
Style="{StaticResource DisableGrayText}"/>
<xctk:DoubleUpDown x:Name="_tickFrequency"
Value="{Binding TickFrequency, ElementName=_rangeSlider}"
Grid.Row="6"
Grid.Column="5"
FormatString="0.00"
Minimum="0"
VerticalAlignment="Center"
Margin="5"
ToolTip="Gets/sets the interval between tick marks."
IsEnabled="{Binding SelectedItem, ElementName=_tickPlacementComboBox, Converter={StaticResource RangeSliderEnabledConverter}}">
<xctk:DoubleUpDown.Maximum>
<MultiBinding Converter="{StaticResource AbsoluteAdditionConverter}">
<Binding ElementName="_rangeSlider"
Path="Minimum" />
<Binding ElementName="_rangeSlider"
Path="Maximum" />
</MultiBinding>
</xctk:DoubleUpDown.Maximum>
</xctk:DoubleUpDown>
</Grid>
</GroupBox>
<StackPanel Grid.Row="1"
Margin="10">
<TextBlock Text="Usage:"
Style="{StaticResource Header}" />
<xctk:RangeSlider x:Name="_rangeSlider"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Minimum="0"
Maximum="100"
LowerValue="30"
HigherValue="70"
Step="1"
Orientation="Horizontal"
LowerThumbBackground="#FFF0F0F0"
HigherThumbBackground="#FFF0F0F0"
RangeBackground="Transparent"
HigherRangeBackground="Transparent"
LowerRangeBackground="Transparent"
HigherRangeStyle="{x:Null}"
RangeStyle="{x:Null}"
LowerRangeStyle="{x:Null}"
IsDeferredUpdateValues="False"
IsSnapToTickEnabled="False"
TickPlacement="None"
TickFrequency="1"
AutoToolTipPlacement="None"
AutoToolTipPrecision="0">
<xctk:RangeSlider.Resources>
<Style TargetType="xctk:RangeSlider">
<Style.Triggers>
<Trigger Property="Orientation"
Value="Horizontal">
<Setter Property="Width"
Value="600" />
</Trigger>
<Trigger Property="Orientation"
Value="Vertical">
<Setter Property="Height"
Value="225" />
</Trigger>
</Style.Triggers>
</Style>
</xctk:RangeSlider.Resources>
</xctk:RangeSlider>
</StackPanel>
</Grid>
</local:DemoView>