RemotePro

0.3.1

Themes/MaterialDesignTheme.ColorPicker.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:converters="clr-namespace:MaterialDesignThemes.Wpf.Converters"
                    xmlns:sys="clr-namespace:System;assembly=mscorlib"
                    xmlns:wpf="clr-namespace:MaterialDesignThemes.Wpf">
  <ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Slider.xaml" />
  </ResourceDictionary.MergedDictionaries>
 
  <ControlTemplate x:Key="MaterialDesignColorSliderThumb" TargetType="{x:Type Thumb}">
    <Grid HorizontalAlignment="Center"
          VerticalAlignment="Center"
          UseLayoutRounding="True">
      <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
          <VisualState x:Name="Normal">
            <Storyboard>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleX">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1.3" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleY">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1.3" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
            </Storyboard>
          </VisualState>
          <VisualState x:Name="MouseOver">
            <Storyboard>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleX">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1.3" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleY">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1.3" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
            </Storyboard>
          </VisualState>
          <VisualState x:Name="Pressed">
            <Storyboard>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleX">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.3">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
              <DoubleAnimationUsingKeyFrames Storyboard.TargetName="grip" Storyboard.TargetProperty="RenderTransform.ScaleY">
                <EasingDoubleKeyFrame KeyTime="0:0:0" Value="1" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.3">
                  <EasingDoubleKeyFrame.EasingFunction>
                    <SineEase EasingMode="EaseInOut" />
                  </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
              </DoubleAnimationUsingKeyFrames>
            </Storyboard>
          </VisualState>
        </VisualStateGroup>
      </VisualStateManager.VisualStateGroups>
      <Ellipse Width="20"
               Height="20"
               Fill="White"
               RenderTransformOrigin=".5,.5"
               UseLayoutRounding="True" />
      <Ellipse x:Name="shadow"
               Width="24"
               Height="24"
               Margin="-12"
               Fill="{TemplateBinding Foreground}"
               Opacity=".0"
               UseLayoutRounding="True" />
      <Ellipse x:Name="grip"
               Width="16"
               Height="16"
               Fill="{TemplateBinding Foreground}"
               RenderTransformOrigin=".5,.5"
               UseLayoutRounding="True">
        <Ellipse.RenderTransform>
          <ScaleTransform ScaleX="1" ScaleY="1" />
        </Ellipse.RenderTransform>
      </Ellipse>
    </Grid>
    <ControlTemplate.Triggers>
      <Trigger Property="IsMouseOver" Value="true">
        <Trigger.EnterActions>
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation Storyboard.TargetName="shadow"
                               Storyboard.TargetProperty="Opacity"
                               To=".26"
                               Duration="0:0:0.2" />
            </Storyboard>
          </BeginStoryboard>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation Storyboard.TargetName="shadow"
                               Storyboard.TargetProperty="Opacity"
                               To=".0"
                               Duration="0:0:0.2" />
            </Storyboard>
          </BeginStoryboard>
        </Trigger.ExitActions>
      </Trigger>
      <Trigger Property="IsEnabled" Value="false">
        <Setter TargetName="grip" Property="Fill" Value="{DynamicResource MaterialDesign.Brush.CheckBox.Disabled}" />
        <Setter TargetName="grip" Property="Stroke" Value="{DynamicResource MaterialDesign.Brush.CheckBox.Disabled}" />
      </Trigger>
    </ControlTemplate.Triggers>
  </ControlTemplate>
 
  <ControlTemplate x:Key="MaterialDesignColorSliderHorizontal" TargetType="{x:Type Slider}">
    <Border x:Name="border"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="True">
      <Grid>
        <Grid.RowDefinitions>
          <RowDefinition Height="Auto" />
          <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}" />
          <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Border Grid.Row="1"
                Height="8"
                CornerRadius="4">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Offset="0" Color="#FF0000" />
              <GradientStop Offset="0.166" Color="#FFFF00" />
              <GradientStop Offset="0.333" Color="#00FF00" />
              <GradientStop Offset="0.5" Color="#00FFFF" />
              <GradientStop Offset="0.666" Color="#0000FF" />
              <GradientStop Offset="0.833" Color="#FF00FF" />
              <GradientStop Offset="1.0" Color="#FF0000" />
            </LinearGradientBrush>
          </Border.Background>
        </Border>
        <Track x:Name="PART_Track"
               Grid.Row="1"
               OpacityMask="{x:Null}">
          <Track.DecreaseRepeatButton>
            <RepeatButton Command="{x:Static Slider.DecreaseLarge}" Style="{StaticResource MaterialDesignRepeatButton}" />
          </Track.DecreaseRepeatButton>
          <Track.IncreaseRepeatButton>
            <RepeatButton Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource MaterialDesignRepeatButton}" />
          </Track.IncreaseRepeatButton>
          <Track.Thumb>
            <Thumb x:Name="Thumb"
                   Width="20"
                   Height="20"
                   VerticalAlignment="Center"
                   Focusable="False"
                   OverridesDefaultStyle="True"
                   Template="{StaticResource MaterialDesignColorSliderThumb}">
              <Thumb.Foreground>
                <MultiBinding Converter="{x:Static converters:HsbToColorConverter.Instance}">
                  <Binding Path="Value" RelativeSource="{RelativeSource TemplatedParent}" />
                  <Binding>
                    <Binding.Source>
                      <sys:Double>1</sys:Double>
                    </Binding.Source>
                  </Binding>
                  <Binding>
                    <Binding.Source>
                      <sys:Double>1</sys:Double>
                    </Binding.Source>
                  </Binding>
                </MultiBinding>
              </Thumb.Foreground>
            </Thumb>
          </Track.Thumb>
        </Track>
      </Grid>
    </Border>
  </ControlTemplate>
 
  <ControlTemplate x:Key="MaterialDesignColorSliderVertical" TargetType="{x:Type Slider}">
    <Border x:Name="border"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            SnapsToDevicePixels="True">
      <Grid>
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="Auto" />
          <ColumnDefinition Width="Auto" MinWidth="{TemplateBinding MinWidth}" />
          <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Border Grid.Column="1"
                Width="8"
                CornerRadius="4">
          <Border.Background>
            <LinearGradientBrush StartPoint="1,1" EndPoint="0,0">
              <GradientStop Offset="0" Color="#FF0000" />
              <GradientStop Offset="0.166" Color="#FFFF00" />
              <GradientStop Offset="0.333" Color="#00FF00" />
              <GradientStop Offset="0.5" Color="#00FFFF" />
              <GradientStop Offset="0.666" Color="#0000FF" />
              <GradientStop Offset="0.833" Color="#FF00FF" />
              <GradientStop Offset="1.0" Color="#FF0000" />
            </LinearGradientBrush>
          </Border.Background>
        </Border>
        <Track x:Name="PART_Track" Grid.Column="1">
          <Track.DecreaseRepeatButton>
            <RepeatButton Command="{x:Static Slider.DecreaseLarge}" Style="{StaticResource MaterialDesignRepeatButton}" />
          </Track.DecreaseRepeatButton>
          <Track.IncreaseRepeatButton>
            <RepeatButton Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource MaterialDesignRepeatButton}" />
          </Track.IncreaseRepeatButton>
          <Track.Thumb>
            <Thumb x:Name="Thumb"
                   Width="20"
                   Height="20"
                   VerticalAlignment="Top"
                   Focusable="False"
                   OverridesDefaultStyle="True"
                   Template="{StaticResource MaterialDesignColorSliderThumb}">
              <Thumb.Foreground>
                <MultiBinding Converter="{x:Static converters:HsbToColorConverter.Instance}">
                  <Binding Path="Value" RelativeSource="{RelativeSource TemplatedParent}" />
                  <Binding>
                    <Binding.Source>
                      <sys:Double>1</sys:Double>
                    </Binding.Source>
                  </Binding>
                  <Binding>
                    <Binding.Source>
                      <sys:Double>1</sys:Double>
                    </Binding.Source>
                  </Binding>
                </MultiBinding>
              </Thumb.Foreground>
            </Thumb>
          </Track.Thumb>
        </Track>
      </Grid>
    </Border>
  </ControlTemplate>
 
  <Style x:Key="MaterialDesignColorSlider" TargetType="{x:Type Slider}">
    <Setter Property="Background" Value="{x:Null}" />
    <Setter Property="BorderBrush" Value="Transparent" />
    <Setter Property="Maximum" Value="360" />
    <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false" />
    <Setter Property="Template" Value="{StaticResource MaterialDesignColorSliderHorizontal}" />
    <Style.Triggers>
      <Trigger Property="Orientation" Value="Vertical">
        <Setter Property="Template" Value="{StaticResource MaterialDesignColorSliderVertical}" />
      </Trigger>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource MaterialDesign.Brush.CheckBox.Disabled}" />
      </Trigger>
    </Style.Triggers>
  </Style>
 
  <ControlTemplate x:Key="ColorPickerHorizontal" TargetType="{x:Type wpf:ColorPicker}">
    <DockPanel>
      <Slider x:Name="PART_HueSlider"
              Margin="8"
              DockPanel.Dock="{TemplateBinding HueSliderPosition}"
              IsMoveToPointEnabled="True"
              Orientation="Horizontal"
              Style="{StaticResource MaterialDesignColorSlider}"
              Value="{Binding Hsb.Hue, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}" />
      <Grid>
        <Rectangle Fill="{Binding Hsb.Hue, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static converters:HsbLinearGradientConverter.Instance}}" />
        <Rectangle Fill="Black">
          <Rectangle.OpacityMask>
            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
              <GradientStop Offset="0" Color="Transparent" />
              <GradientStop Offset="1.0" Color="Black" />
            </LinearGradientBrush>
          </Rectangle.OpacityMask>
        </Rectangle>
 
        <Canvas Name="PART_SaturationBrightnessPicker"
                Background="Transparent"
                ClipToBounds="True"
                Focusable="True">
          <Thumb Name="PART_SaturationBrightnessPickerThumb"
                 Canvas.Left="20"
                 Canvas.Top="20">
            <Thumb.Template>
              <ControlTemplate>
                <Ellipse Width="24"
                         Height="24"
                         Margin="-12,-12,0,0"
                         Fill="Transparent"
                         Stroke="White"
                         StrokeThickness="2" />
              </ControlTemplate>
            </Thumb.Template>
          </Thumb>
        </Canvas>
      </Grid>
    </DockPanel>
  </ControlTemplate>
 
  <ControlTemplate x:Key="ColorPickerVertical" TargetType="{x:Type wpf:ColorPicker}">
    <DockPanel>
      <Slider x:Name="PART_HueSlider"
              Margin="8"
              DockPanel.Dock="{TemplateBinding HueSliderPosition}"
              IsMoveToPointEnabled="True"
              Orientation="Vertical"
              Style="{StaticResource MaterialDesignColorSlider}"
              Value="{Binding Hsb.Hue, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}" />
      <Grid>
        <Rectangle Fill="{Binding Hsb.Hue, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static converters:HsbLinearGradientConverter.Instance}}" />
        <Rectangle Fill="Black">
          <Rectangle.OpacityMask>
            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
              <GradientStop Offset="0" Color="Transparent" />
              <GradientStop Offset="1.0" Color="Black" />
            </LinearGradientBrush>
          </Rectangle.OpacityMask>
        </Rectangle>
 
        <Canvas Name="PART_SaturationBrightnessPicker"
                Background="Transparent"
                ClipToBounds="True"
                Focusable="True">
          <Thumb Name="PART_SaturationBrightnessPickerThumb"
                 Canvas.Left="20"
                 Canvas.Top="20">
            <Thumb.Template>
              <ControlTemplate>
                <Ellipse Width="24"
                         Height="24"
                         Margin="-12,-12,0,0"
                         Fill="Transparent"
                         Stroke="White"
                         StrokeThickness="2" />
              </ControlTemplate>
            </Thumb.Template>
          </Thumb>
        </Canvas>
      </Grid>
    </DockPanel>
  </ControlTemplate>
 
  <Style TargetType="{x:Type wpf:ColorPicker}">
    <Style.Triggers>
      <Trigger Property="HueSliderPosition" Value="Top">
        <Setter Property="Template" Value="{StaticResource ColorPickerHorizontal}" />
      </Trigger>
      <Trigger Property="HueSliderPosition" Value="Bottom">
        <Setter Property="Template" Value="{StaticResource ColorPickerHorizontal}" />
      </Trigger>
      <Trigger Property="HueSliderPosition" Value="Left">
        <Setter Property="Template" Value="{StaticResource ColorPickerVertical}" />
      </Trigger>
      <Trigger Property="HueSliderPosition" Value="Right">
        <Setter Property="Template" Value="{StaticResource ColorPickerVertical}" />
      </Trigger>
    </Style.Triggers>
  </Style>
</ResourceDictionary>