add CompareSlider

This commit is contained in:
NaBian committed 2018-08-31 19:33:17 +08:00
1 parent 442f451539
commit ec3a32e09d
13 files changed
+352 -2

No files matched your search

+8
View File
@@ -1,3 +1,11 @@
2018.08.31 Version 1.1.2
* new controls
- add CompareSlider
2018.08.30 Version 1.1.1
* new controls
- add ScrollViewer
2018.08.27 Version 1.1.0
* new controls
-1
View File
@@ -3,7 +3,6 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:interactivity="clr-namespace:HandyControl.Interactivity"
mc:Ignorable="d"
BorderThickness="1"
Background="Transparent"
+47
View File
@@ -0,0 +1,47 @@
using System.Windows;
using System.Windows.Controls;
namespace HandyControl.Controls
{
public class CompareSlider : Slider
{
public static readonly DependencyProperty TargetContentProperty = DependencyProperty.Register(
"TargetContent", typeof(object), typeof(CompareSlider), new PropertyMetadata(default(object)));
public static readonly DependencyProperty SourceContentProperty = DependencyProperty.Register(
"SourceContent", typeof(object), typeof(CompareSlider), new PropertyMetadata(default(object)));
public object TargetContent
{
get => GetValue(TargetContentProperty);
set => SetValue(TargetContentProperty, value);
}
public object SourceContent
{
get => GetValue(SourceContentProperty);
set => SetValue(SourceContentProperty, value);
}
private bool _isLoaded;
private double _tempValue;
public CompareSlider()
{
Loaded += delegate
{
if (_isLoaded) return;
_isLoaded = true;
Value = _tempValue;
};
}
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
_tempValue = Value;
Value = Orientation == Orientation.Horizontal ? Maximum : 0;
}
}
}
+2
View File
@@ -12,6 +12,7 @@
<FileAlignment>512</FileAlignment>
<ProjectTypeGuids>{60dc8134-eba5-43b8-bcc9-bb4bc16c2548};{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}</ProjectTypeGuids>
<WarningLevel>4</WarningLevel>
<TargetFrameworkProfile />
</PropertyGroup>
<PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Debug|AnyCPU' ">
<DebugSymbols>true</DebugSymbols>
@@ -41,6 +42,7 @@
<DependentUpon>ColorPicker.xaml</DependentUpon>
</Compile>
<Compile Include="Controls\Attach\IconElement.cs" />
<Compile Include="Controls\CompareSlider.cs" />
<Compile Include="Controls\ScrollViewer.cs" />
<Compile Include="Controls\Info\InfoControl.cs" />
<Compile Include="Controls\Info\InfoNumericUpDown.xaml.cs">
+239 -1
View File
@@ -1,5 +1,11 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="clr-namespace:HandyControl.Controls">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="../Basic/Geometries.xaml"></ResourceDictionary>
<ResourceDictionary Source="../Basic/Brushes.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
<Style x:Key="ColorPickerRepeatButton" TargetType="{x:Type RepeatButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
@@ -120,4 +126,236 @@
</DrawingBrush.Drawing>
</DrawingBrush>
<!--CompareSlider-->
<Style x:Key="CompareSliderRepeatButtonTransparent" TargetType="{x:Type RepeatButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<ContentPresenter Content="{TemplateBinding Content}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"></ContentPresenter>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ControlTemplate x:Key="CompareSliderThumbHorizontal" TargetType="{x:Type Thumb}">
<ControlTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)" Storyboard.TargetName="PathLeft">
<EasingDoubleKeyFrame KeyTime="0" Value="-2"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)" Storyboard.TargetName="PathRight">
<EasingDoubleKeyFrame KeyTime="0" Value="2"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Storyboard2">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)" Storyboard.TargetName="PathLeft">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)" Storyboard.TargetName="PathRight">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Grid>
<Border Width="1" HorizontalAlignment="Center">
<Border.Background>
<DrawingBrush RenderOptions.CachingHint="Cache" Viewport="0,0,1,8" ViewportUnits="Absolute" Stretch="None" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="{StaticResource BorderBrush}">
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,1,4" />
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Border.Background>
</Border>
<Border x:Name="grip" Width="30" Height="30" CornerRadius="15" BorderThickness="1" BorderBrush="{StaticResource BorderBrush}" Background="White">
<Grid Width="30" Height="30" Margin="-1,-1,0,0">
<Path x:Name="PathLeft" Data="{StaticResource LeftGeometry}" StrokeThickness="1" Stroke="{StaticResource PrimaryBrush}" Margin="6,8" HorizontalAlignment="Left" Stretch="Uniform" Width="12" Height="12" RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<TransformGroup>
<TranslateTransform/>
</TransformGroup>
</Path.RenderTransform>
</Path>
<Path x:Name="PathRight" Data="{StaticResource RightGeometry}" StrokeThickness="1" Stroke="{StaticResource PrimaryBrush}" Margin="6,8" HorizontalAlignment="Right" Stretch="Uniform" Width="12" Height="12" RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<TransformGroup>
<TranslateTransform/>
</TransformGroup>
</Path.RenderTransform>
</Path>
</Grid>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="grip" Value="{StaticResource PrimaryBrush}"/>
<Setter Property="Stroke" TargetName="PathLeft" Value="White"/>
<Setter Property="Stroke" TargetName="PathRight" Value="White"/>
</Trigger>
<Trigger Property="IsDragging" Value="true">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard2}"/>
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<ControlTemplate x:Key="CompareSliderHorizontal" TargetType="{x:Type controls:CompareSlider}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<Track Margin="-14,0,-15,0" x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Margin="14,0,-15,0" Command="{x:Static Slider.DecreaseLarge}" Style="{StaticResource CompareSliderRepeatButtonTransparent}">
<RepeatButton.Content>
<Border HorizontalAlignment="Right" Width="{TemplateBinding Width}">
<ContentPresenter Content="{TemplateBinding TargetContent}"/>
</Border>
</RepeatButton.Content>
</RepeatButton>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Margin="-15,0,15,0" Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource CompareSliderRepeatButtonTransparent}">
<RepeatButton.Content>
<Border HorizontalAlignment="Right" Width="{TemplateBinding Width}">
<ContentPresenter Content="{TemplateBinding SourceContent}"/>
</Border>
</RepeatButton.Content>
</RepeatButton>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb x:Name="Thumb" Focusable="False" OverridesDefaultStyle="True" Template="{StaticResource CompareSliderThumbHorizontal}" Width="30" Margin="0,0,0,0"/>
</Track.Thumb>
</Track>
</Border>
</ControlTemplate>
<ControlTemplate x:Key="CompareSliderThumbVertical" TargetType="{x:Type Thumb}">
<ControlTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.Y)" Storyboard.TargetName="PathUp">
<EasingDoubleKeyFrame KeyTime="0" Value="-2"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.Y)" Storyboard.TargetName="PathDown">
<EasingDoubleKeyFrame KeyTime="0" Value="2"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Storyboard2">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.Y)" Storyboard.TargetName="PathUp">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.Y)" Storyboard.TargetName="PathDown">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Grid>
<Border Height="1" VerticalAlignment="Center">
<Border.Background>
<DrawingBrush RenderOptions.CachingHint="Cache" Viewport="0,0,8,1" ViewportUnits="Absolute" Stretch="None" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="{StaticResource BorderBrush}">
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,4,1" />
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Border.Background>
</Border>
<Border x:Name="grip" Width="30" Height="30" CornerRadius="15" BorderThickness="1" BorderBrush="{StaticResource BorderBrush}" Background="White">
<Grid Width="30" Height="30" Margin="-1,-1,0,0">
<Path x:Name="PathUp" Data="{StaticResource UpGeometry}" StrokeThickness="1" Stroke="{StaticResource PrimaryBrush}" Margin="9,6" VerticalAlignment="Top" Stretch="Uniform" Width="12" Height="12" RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<TransformGroup>
<TranslateTransform/>
</TransformGroup>
</Path.RenderTransform>
</Path>
<Path x:Name="PathDown" Data="{StaticResource DownGeometry}" StrokeThickness="1" Stroke="{StaticResource PrimaryBrush}" Margin="9,6" VerticalAlignment="Bottom" Stretch="Uniform" Width="12" Height="12" RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<TransformGroup>
<TranslateTransform/>
</TransformGroup>
</Path.RenderTransform>
</Path>
</Grid>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true" SourceName="grip">
<Setter Property="Background" TargetName="grip" Value="{StaticResource PrimaryBrush}"/>
<Setter Property="Stroke" TargetName="PathUp" Value="White"/>
<Setter Property="Stroke" TargetName="PathDown" Value="White"/>
</Trigger>
<Trigger Property="IsDragging" Value="true">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard2}"/>
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<ControlTemplate x:Key="CompareSliderVertical" TargetType="{x:Type controls:CompareSlider}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<Track Margin="0,-14,0,-15" x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Margin="0,-15,0,15" Command="{x:Static Slider.DecreaseLarge}" Style="{StaticResource CompareSliderRepeatButtonTransparent}">
<RepeatButton.Content>
<Border VerticalAlignment="Bottom" Height="{TemplateBinding Height}">
<ContentPresenter Content="{TemplateBinding TargetContent}"/>
</Border>
</RepeatButton.Content>
</RepeatButton>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Margin="0,14,0,-15" Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource CompareSliderRepeatButtonTransparent}">
<RepeatButton.Content>
<Border VerticalAlignment="Bottom" Height="{TemplateBinding Height}">
<ContentPresenter Content="{TemplateBinding SourceContent}"/>
</Border>
</RepeatButton.Content>
</RepeatButton>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb x:Name="Thumb" Focusable="False" Height="30" OverridesDefaultStyle="True" Template="{StaticResource CompareSliderThumbVertical}" VerticalAlignment="Top"/>
</Track.Thumb>
</Track>
</Border>
</ControlTemplate>
<Style TargetType="{x:Type controls:CompareSlider}">
<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="BorderBrush" Value="{StaticResource BorderBrush}"></Setter>
<Setter Property="MinWidth" Value="30"/>
<Setter Property="MinHeight" Value="30"/>
<Setter Property="Template" Value="{StaticResource CompareSliderHorizontal}"/>
<Style.Triggers>
<Trigger Property="Orientation" Value="Vertical">
<Setter Property="Template" Value="{StaticResource CompareSliderVertical}"/>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
+4
View File
@@ -83,5 +83,9 @@
<ItemGroup>
<Resource Include="Resources\icon-white.png" />
</ItemGroup>
<ItemGroup>
<Resource Include="Resources\b1.jpg" />
<Resource Include="Resources\b2.jpg" />
</ItemGroup>
<Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
</Project>
+47
View File
@@ -424,6 +424,53 @@
</controls:Carousel>
</Grid>
</Border>
<!--对比滑块-->
<Border Visibility="Visible" Margin="0,10,0,0" Style="{StaticResource BorderRegionStyle}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" SharedSizeGroup="Header"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<StackPanel>
<TextBlock Margin="0,5,0,0" Style="{StaticResource TextBlockTitle}" Text="对比滑块"></TextBlock>
<TextBlock Style="{StaticResource TextBlockTitle}">(CompareSlider)</TextBlock>
</StackPanel>
<WrapPanel Grid.Column="1" HorizontalAlignment="Left" Margin="50,0,0,0">
<controls:CompareSlider Value="5" Width="600" Height="352" Margin="0,0,30,30">
<controls:CompareSlider.TargetContent>
<Border>
<Border.Background>
<ImageBrush ImageSource="Resources/b1.jpg"/>
</Border.Background>
</Border>
</controls:CompareSlider.TargetContent>
<controls:CompareSlider.SourceContent>
<Border>
<Border.Background>
<ImageBrush ImageSource="Resources/b2.jpg"/>
</Border.Background>
</Border>
</controls:CompareSlider.SourceContent>
</controls:CompareSlider>
<controls:CompareSlider Orientation="Vertical" Value="5" Width="600" Height="352">
<controls:CompareSlider.TargetContent>
<Border>
<Border.Background>
<ImageBrush ImageSource="Resources/b1.jpg"/>
</Border.Background>
</Border>
</controls:CompareSlider.TargetContent>
<controls:CompareSlider.SourceContent>
<Border>
<Border.Background>
<ImageBrush ImageSource="Resources/b2.jpg"/>
</Border.Background>
</Border>
</controls:CompareSlider.SourceContent>
</controls:CompareSlider>
</WrapPanel>
</Grid>
</Border>
<!--时间条-->
<Border Visibility="Collapsed" Margin="0,10,0,0" Style="{StaticResource BorderRegionStyle}">
<Grid>
Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

+5
View File
@@ -36,6 +36,11 @@
![图片浏览器ImageBrowser](https://raw.githubusercontent.com/NaBian/HandyControl/master/Resources/ImageBrowser.gif)
### 8、对比滑块CompareSlider
![对比滑块CompareSlider](https://raw.githubusercontent.com/NaBian/HandyControl/master/Resources/CompareSlider-h.gif)
![对比滑块CompareSlider](https://raw.githubusercontent.com/NaBian/HandyControl/master/Resources/CompareSlider-v.gif)
# 使用方法
第一步:添加HandyControl的引用;
Binary file not shown.

After

Width:  |  Height:  |  Size: 640 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 777 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.8 KiB

After

Width:  |  Height:  |  Size: 6.8 KiB