Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Range Slider V2.0 #1055

Closed
wants to merge 53 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
53 commits
Select commit Hold shift + click to select a range
ca5ca0b
Introducing RangeSlider
michaelmairegger Jan 9, 2014
4d08afa
Coerce Minimum/Maximum
michaelmairegger Jan 9, 2014
789dcf1
Recalculate Ranges and Width if Mininum or Maximum changes
michaelmairegger Jan 9, 2014
c5040a4
Renamed RangeStartSelected/StopSelected to LowerValue/UpperValue
QuantumDeveloper Jan 9, 2014
e80793a
Renamed RangeStartSelected/StopSelected to LowerValue/UpperValue
QuantumDeveloper Jan 9, 2014
40a4c00
Add missing RangeParameterChangedEventArgs to .NET45 Project
michaelmairegger Jan 10, 2014
b157a2b
Merge branch 'feature/RangeSlider' of https://github.com/xxMUROxx/Mah…
QuantumDeveloper Jan 10, 2014
ffbebc8
Lower/UpperValue changed events now working. Thumb drag events not wo…
QuantumDeveloper Jan 10, 2014
f8ddc64
Delete coerce minimum and maximum because they are not needed and lea…
QuantumDeveloper Jan 13, 2014
a2b9390
Temporary fix for correct width calculation. On every minimum and max…
QuantumDeveloper Jan 13, 2014
ddfc5fe
Second try:
QuantumDeveloper Jan 14, 2014
9ccbc4f
Introduced DragStarted, DragCompleted and DragDelta events for Lower,…
QuantumDeveloper Jan 15, 2014
a28cc14
Fix issue with incorrect rignht thumb moving ... long stiry actually
QuantumDeveloper Jan 17, 2014
8b5e3f0
Added support of Vertical orientation. XAML part should be improved
QuantumDeveloper Jan 18, 2014
1f0db75
Introduce MinRangeWidth property to change max width of central thumb…
QuantumDeveloper Jan 19, 2014
7926c9c
Added vertical orientation support for MinRangeWidth, whsich now is M…
QuantumDeveloper Jan 19, 2014
ba4c2c7
Implemented IsMoveToPoint logic. Introduced MoveWholeSelection property
QuantumDeveloper Jan 20, 2014
15cdf02
Now range could be moved only when Control button pressed
QuantumDeveloper Jan 21, 2014
8615d5d
User now can change position of left or right thumb just with pressin…
QuantumDeveloper Jan 21, 2014
666ff6e
Changed behavior for MoveToPoint feature:
QuantumDeveloper Jan 22, 2014
a2e01d0
Added property ExtendedMode which will lock and unlock manipulations …
QuantumDeveloper Jan 23, 2014
bf13c03
Implement possibility to move whole range when clicking inside of ran…
QuantumDeveloper Jan 23, 2014
7fd81a6
Implement Large/SmallChange if MoveToPoint is not enable for MoveWhol…
QuantumDeveloper Jan 23, 2014
9d2eb8d
Little optimizations
QuantumDeveloper Jan 24, 2014
fce9b33
Implemented feature of moving whole range by pressing inside range LB…
QuantumDeveloper Jan 24, 2014
8fee8ad
Added Tickbars. Xaml part rewrited.
QuantumDeveloper Jan 26, 2014
545d4e7
Partly resolve SnapToTick feature (for right thumb only). Needs an op…
QuantumDeveloper Jan 28, 2014
c480b9a
Algorithm for snap to tick is ready.
QuantumDeveloper Jan 29, 2014
21337e5
Implemented SnapToTickFeature for all three thumbs.
QuantumDeveloper Jan 30, 2014
e41b863
Improve SnapToTick algorithm, code optimizations
QuantumDeveloper Feb 2, 2014
231ddd7
Some fixes
QuantumDeveloper Feb 2, 2014
8d51011
Finish with snaptotick. Work well with integer and small fractional p…
QuantumDeveloper Feb 2, 2014
fa3fb66
Coerce callbacks still doesnt work
QuantumDeveloper Feb 2, 2014
804d3dc
On a way to fully support SnapToTick feature with new algorithm.
QuantumDeveloper Feb 5, 2014
98870c1
Change base class from Slider to RangeBase, because Slider hase some …
QuantumDeveloper Feb 6, 2014
36a1431
Hotfix: replaced all DoubleUtilities class methods by my own bacuase …
QuantumDeveloper Feb 6, 2014
2cb20a7
Introduced completely new and optimized algorithm for calculating nex…
QuantumDeveloper Feb 6, 2014
8bef3a4
Added new properties - AutotoolTipPlacement and AutotooltipPrecision …
QuantumDeveloper Feb 7, 2014
35ebf7c
Added:
QuantumDeveloper Feb 9, 2014
8ee6c28
MinWidth/Height of central Thumb changed to 30 pixels
QuantumDeveloper Feb 11, 2014
bd74bc4
1. Fixed issue with incorrect width calculation when IsSnapToTickEnab…
QuantumDeveloper Feb 11, 2014
4ace086
Remove ReCalculateRanges() because it does nothing. Using MovableRang…
QuantumDeveloper Feb 11, 2014
e8b1ad7
Fixed heights calculation
QuantumDeveloper Feb 11, 2014
ca991d3
Finish with coerce callbacks. Now they should work properly
QuantumDeveloper Feb 12, 2014
ed322df
Finish with Range Slider!
QuantumDeveloper Feb 12, 2014
baa071a
Change category of some properies
QuantumDeveloper Feb 13, 2014
b58b3d7
Fixed Small/Large change
QuantumDeveloper Feb 13, 2014
6b77bf4
Change cursors in vertical orientation
QuantumDeveloper Feb 14, 2014
ee93c2d
Fix coerce callbacks, small/large change movement improved, added rou…
QuantumDeveloper Feb 14, 2014
aa4b85b
Small fixes in width calculation
QuantumDeveloper Feb 14, 2014
3c6becc
[HOTFIX] Startup performance improvements, improvements in coerce cal…
QuantumDeveloper Feb 15, 2014
97a78ac
Removed all debug.WriteLines()
QuantumDeveloper Feb 15, 2014
9dc5352
Code refactoring and improvement
QuantumDeveloper Feb 15, 2014
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions MahApps.Metro/Controls/RangeParameterChangedEventArgs.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
using System;
using System.Windows;

namespace MahApps.Metro.Controls
{
public class RangeParameterChangedEventArgs : RoutedEventArgs
{
public RangeParameterChangeType ParameterType { get; private set; }
public Double OldValue { get; private set; }
public Double NewValue { get; private set; }

internal RangeParameterChangedEventArgs(RangeParameterChangeType type, Double _old, Double _new)
{
ParameterType = type;

OldValue = _old;
NewValue = _new;
}
}

public enum RangeParameterChangeType
{
Lower = 1,
Upper = 2
}
}
22 changes: 14 additions & 8 deletions MahApps.Metro/Controls/RangeSelectionChangedEventArgs.cs
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,26 @@ public class RangeSelectionChangedEventArgs : RoutedEventArgs
/// <summary>
/// The value of the new range's beginning.
/// </summary>
public long NewRangeStart { get; set; }
public double NewLowerValue { get; set; }
/// <summary>
/// The value of the new range's ending.
/// </summary>
public long NewRangeStop { get; set; }
public double NewUpperValue { get; set; }

internal RangeSelectionChangedEventArgs(long newRangeStart, long newRangeStop)
public double OldLowerValue { get; set; }

public double OldUpperValue { get; set; }

internal RangeSelectionChangedEventArgs(double newLowerValue, double newUpperValue, double oldLowerValue, double oldUpperValue)
{
NewRangeStart = newRangeStart;
NewRangeStop = newRangeStop;
NewLowerValue = newLowerValue;
NewUpperValue = newUpperValue;
OldLowerValue = oldLowerValue;
OldUpperValue = oldUpperValue;
}

internal RangeSelectionChangedEventArgs(RangeSlider slider)
: this(slider.RangeStartSelected, slider.RangeStopSelected)
{ }
//internal RangeSelectionChangedEventArgs(RangeSlider slider)
// : this(slider.LowerValue, slider.UpperValue)
//{ }
}
}
2,178 changes: 1,976 additions & 202 deletions MahApps.Metro/Controls/RangeSlider.cs

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions MahApps.Metro/MahApps.Metro.NET45.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,7 @@
<Compile Include="Controls\Pivot.cs" />
<Compile Include="Controls\PivotItem.cs" />
<Compile Include="Controls\Position.cs" />
<Compile Include="Controls\RangeParameterChangedEventArgs.cs" />
<Compile Include="Controls\SafeRaise.cs" />
<Compile Include="Controls\ScrollViewerOffsetMediator.cs" />
<Compile Include="Controls\WindowButtonCommands.cs" />
Expand Down
1 change: 1 addition & 0 deletions MahApps.Metro/MahApps.Metro.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@
<Compile Include="Controls\Pivot.cs" />
<Compile Include="Controls\PivotItem.cs" />
<Compile Include="Controls\Position.cs" />
<Compile Include="Controls\RangeParameterChangedEventArgs.cs" />
<Compile Include="Controls\SafeRaise.cs" />
<Compile Include="Controls\ScrollViewerOffsetMediator.cs" />
<Compile Include="Controls\WindowButtonCommands.cs" />
Expand Down
144 changes: 101 additions & 43 deletions MahApps.Metro/Themes/RangeSlider.xaml
Original file line number Diff line number Diff line change
@@ -1,49 +1,107 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls">
xmlns:controls="clr-namespace:MahApps.Metro.Controls">

<Style TargetType="{x:Type Controls:RangeSlider}">
<Setter Property="RangeStop"
Value="100" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Controls:RangeSlider}">
<StackPanel Orientation="Horizontal"

<ControlTemplate x:Key="RangeSliderHorizontal" TargetType="controls:RangeSlider">
<StackPanel Name="PART_Container" Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Center">
<TickBar Name="PART_TopTick" Placement="Top" Fill="{TemplateBinding Foreground}" TickFrequency="{TemplateBinding TickFrequency}" Minimum="{TemplateBinding Minimum}" Maximum="{TemplateBinding Maximum}" Height="4" Margin="5,0,5,2" Visibility="Collapsed"></TickBar>
<StackPanel Name="PART_RangeSliderContainer" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Center">
<RepeatButton Name="PART_LeftEdge" Style="{DynamicResource HorizontalTrackLargeDecrease}" />
<Thumb Name="PART_LeftThumb" Cursor="Arrow"
Height="{DynamicResource HorizontalThumbHeight}"
Width="{DynamicResource HorizontalThumbWidth}"
Style="{DynamicResource HorizontalSliderThumb}" />
<Thumb Name="PART_MiddleThumb" Cursor="Hand" MinWidth="{TemplateBinding MinRangeWidth}">
<Thumb.Style>
<Style TargetType="Thumb">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Height="3" Margin="0,0,0,0" Fill="{DynamicResource AccentColorBrush}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Thumb.Style>
</Thumb>
<Thumb Name="PART_RightThumb" Cursor="Arrow"
Height="{DynamicResource HorizontalThumbHeight}"
Width="{DynamicResource HorizontalThumbWidth}"
Style="{DynamicResource HorizontalSliderThumb}" />
<RepeatButton Name="PART_RightEdge" Style="{DynamicResource HorizontalTrackLargeDecrease}" />
</StackPanel>
<TickBar Name="PART_BottomTick" Fill="{TemplateBinding Foreground}" Placement="Top" TickFrequency="{TemplateBinding TickFrequency}" Minimum="{TemplateBinding Minimum}" Maximum="{TemplateBinding Maximum}" Height="4" Margin="5,2,5,0" Visibility="Collapsed"></TickBar>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement" Value="TopLeft">
<Setter Property="Visibility" TargetName="PART_TopTick" Value="Visible"/>
</Trigger>
<Trigger Property="TickPlacement" Value="BottomRight">
<Setter Property="Visibility" TargetName="PART_BottomTick" Value="Visible"/>
</Trigger>
<Trigger Property="TickPlacement" Value="Both">
<Setter Property="Visibility" TargetName="PART_TopTick" Value="Visible"/>
<Setter Property="Visibility" TargetName="PART_BottomTick" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>

<ControlTemplate x:Key="RangeSliderVertical" TargetType="controls:RangeSlider">
<StackPanel Name="PART_Container" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Stretch">
<TickBar Name="PART_TopTick" Placement="Left" Fill="{TemplateBinding Foreground}" TickFrequency="{TemplateBinding TickFrequency}" Minimum="{TemplateBinding Minimum}" Maximum="{TemplateBinding Maximum}" Width="4" Margin="0,5,2,5" Visibility="Collapsed"></TickBar>
<StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Stretch"
Name="PART_RangeSliderContainer">
<RepeatButton Name="PART_LeftEdge"
Style="{DynamicResource HorizontalTrackLargeDecrease}" />
<Thumb Name="PART_LeftThumb"
Cursor="SizeWE"
Height="{DynamicResource HorizontalThumbHeight}"
Width="{DynamicResource HorizontalThumbWidth}"
Style="{DynamicResource HorizontalSliderThumb}" />
<Thumb Name="PART_MiddleThumb"
Cursor="ScrollAll"
MinWidth="10">
<Thumb.Style>
<Style TargetType="Thumb">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Height="3"
Margin="0,1,0,0"
Fill="{DynamicResource AccentColorBrush}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Thumb.Style>
</Thumb>
<Thumb Name="PART_RightThumb"
Cursor="SizeWE"
Height="{DynamicResource HorizontalThumbHeight}"
Width="{DynamicResource HorizontalThumbWidth}"
Style="{DynamicResource HorizontalSliderThumb}" />
<RepeatButton Name="PART_RightEdge"
Style="{DynamicResource HorizontalTrackLargeDecrease}" />
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<RepeatButton Name="PART_LeftEdge" VerticalAlignment="Stretch"
Style="{DynamicResource VerticalTrackLargeDecrease}" />
<Thumb Name="PART_LeftThumb"
Cursor="Arrow"
Height="{DynamicResource VerticalThumbHeight}"
Width="{DynamicResource VerticalThumbWidth}"
Style="{DynamicResource VerticalSliderThumb}" />
<Thumb Name="PART_MiddleThumb" Cursor="Hand" MinHeight="{TemplateBinding MinRangeWidth}">
<Thumb.Style>
<Style TargetType="Thumb">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Width="3" Margin="0,0,0,0" Fill="{DynamicResource AccentColorBrush}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Thumb.Style>
</Thumb>
<Thumb Name="PART_RightThumb" Cursor="Arrow"
Height="{DynamicResource VerticalThumbHeight}"
Width="{DynamicResource VerticalThumbWidth}"
Style="{DynamicResource VerticalSliderThumb}" />
<RepeatButton Name="PART_RightEdge" VerticalAlignment="Stretch" Style="{DynamicResource VerticalTrackLargeDecrease}" />
</StackPanel>
<TickBar Name="PART_BottomTick" Fill="{TemplateBinding Foreground}" TickFrequency="{TemplateBinding TickFrequency}" Minimum="{TemplateBinding Minimum}" Maximum="{TemplateBinding Maximum}" Placement="Right" Width="4" Margin="2,5,0,5" Visibility="Collapsed"></TickBar>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement" Value="TopLeft">
<Setter Property="Visibility" TargetName="PART_TopTick" Value="Visible"/>
</Trigger>
<Trigger Property="TickPlacement" Value="BottomRight">
<Setter Property="Visibility" TargetName="PART_BottomTick" Value="Visible"/>
</Trigger>
<Trigger Property="TickPlacement" Value="Both">
<Setter Property="Visibility" TargetName="PART_TopTick" Value="Visible"/>
<Setter Property="Visibility" TargetName="PART_BottomTick" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>

<Style TargetType="{x:Type controls:RangeSlider}">
<Setter Property="Background" Value="Transparent"></Setter>
<Setter Property="Template" Value="{StaticResource RangeSliderHorizontal}"></Setter>
<Style.Triggers>
<Trigger Property="Orientation" Value="Vertical">
<Setter Property="Template" Value="{StaticResource RangeSliderVertical}"></Setter>
</Trigger>
</Style.Triggers>
</Style>

</ResourceDictionary>
40 changes: 28 additions & 12 deletions samples/MetroDemo/MainWindow.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
<Setter Property="Icon" Value="{StaticResource AccentMenuIcon}" />
<Setter Property="Header" Value="{Binding Name, Mode=OneWay}" />
</Style>

<Dialog:SimpleDialog x:Key="SimpleDialogTest"
Title="This dialog allows arbitrary content. It will close in 5 seconds."
x:Name="SimpleTestDialog">
Expand Down Expand Up @@ -82,7 +82,7 @@
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>

<Menu Grid.Row="0"
Margin="5"
VerticalAlignment="Stretch"
Expand Down Expand Up @@ -592,9 +592,9 @@
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>

<Label Content="TreeView" Style="{StaticResource DescriptionHeaderStyle}" />

<TreeView Grid.Row="1">
<TreeViewItem Header="Item 1">
<TreeViewItem Header="Item 1.1">
Expand Down Expand Up @@ -786,7 +786,7 @@
<StackPanel Grid.Column="1">
<Label Content="Vertical Slider" Style="{StaticResource DescriptionHeaderStyle}" />
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
<Slider Orientation="Vertical" Height="200" />
<Slider Orientation="Vertical" Height="200" Cursor="SizeNS" />
<Slider Orientation="Vertical"
Margin="10, 0, 0, 0"
Height="200" Style="{StaticResource FlatSlider}"
Expand All @@ -804,14 +804,30 @@
</StackPanel>
<StackPanel Grid.Column="2">
<Label Content="RangeSlider" Style="{StaticResource DescriptionHeaderStyle}" />
<Controls:RangeSlider Width="200"
Height="20"
Margin="0, 10, 0, 0" />

<Label Content="Look Tooltip of NumericUpDown"></Label>

<Controls:NumericUpDown Value="{Binding ElementName=RangeSlider, Path=LowerValue}" ToolTip="LowerValue"></Controls:NumericUpDown>
<Controls:NumericUpDown Value="{Binding ElementName=RangeSlider, Path=UpperValue}" ToolTip="UpperValue"></Controls:NumericUpDown>
<!--<Controls:NumericUpDown Value="{Binding ElementName=RangeSlider, Path=Minimum}" ToolTip="Minimum"></Controls:NumericUpDown>
<Controls:NumericUpDown Value="{Binding ElementName=RangeSlider, Path=Maximum}" ToolTip="Maximum"></Controls:NumericUpDown>-->
<TextBlock Text="{Binding ElementName=RangeSlider, Path=ActualWidth}"></TextBlock>
<!--TickFrequency="20.5487961325467985"-->

<Controls:RangeSlider Orientation="Horizontal" MinRangeWidth="20" x:Name="RangeSlider" LowerValueChanged="RangeSlider_OnLowerValueChanged" UpperValueChanged="RangeSlider_OnUpperValueChanged"
CentralThumbDragStarted="RangeSlider_OnCentralThumbDragStarted" CentralThumbDragCompleted="RangeSlider_OnCentralThumbDragCompleted"
LowerThumbDragDelta="RangeSlider_OnLowerThumbDragDelta" UpperThumbDragDelta="RangeSlider_OnUpperThumbDragDelta" CentralThumbDragDelta="RangeSlider_OnCentralThumbDragDelta"
LowerThumbDragStarted="RangeSlider_OnLowerThumbDragStarted" LowerThumbDragCompleted="RangeSlider_OnLowerThumbDragCompleted"
UpperThumbDragStarted="RangeSlider_OnUpperThumbDragStarted" UpperThumbDragCompleted="RangeSlider_OnUpperThumbDragCompleted"
TickPlacement="Both" TickFrequency="20" IsSnapToTickEnabled="True" MinRange="50"
Width="300" Minimum="30" Maximum="200" IsMoveToPointEnabled="False" ExtendedMode="True" MoveWholeRange="False" SmallChange="0.1"
LowerValue="70" UpperValue="60" />
<!--<Slider Value="{Binding ElementName=RangeSlider, Path=MinRangeWidth}" Minimum="0" Maximum="250" ></Slider>-->
<Controls:RangeSlider Width="200"
Height="20"
Margin="0, 10, 0, 0"
RangeStartSelected="20"
RangeStopSelected="60" />
LowerValue="20"
UpperValue="60" />
<Controls:RangeSlider Width="200"
Height="20"
Margin="0, 10, 0, 0"
Expand All @@ -820,8 +836,8 @@
Height="20"
Margin="0, 10, 0, 0"
IsEnabled="False"
RangeStartSelected="20"
RangeStopSelected="60" />
LowerValue="20"
UpperValue="60" />
</StackPanel>
<StackPanel Grid.Row="1" Grid.Column="0">
<Label Content="ProgressBar" Style="{StaticResource DescriptionHeaderStyle}" />
Expand Down
Loading