zhaoyushun1999/Semi.Avalonia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: complete SimpleColorView.

Browse Source
This commit is contained in:
Zhang Dian 2024-08-11 19:11:11 +08:00
parent d2a1f1e277
commit 1cedc77ce1
5 changed files with 136 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
demo/Semi.Avalonia.Demo/Pages/ColorPickerDemo.axaml
View File

@ -6,7 +6,7 @@
xmlns:controls="using:Avalonia.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="450"
d:DesignHeight="1450"
d:DesignWidth="800"
mc:Ignorable="d">
<StackPanel Spacing="20">
@ -18,6 +18,14 @@
<ColorView ColorSpectrumShape="Box" />
<ColorView Palette="{DynamicResource SemiColorPalette}" />
</StackPanel>
<StackPanel
VerticalAlignment="Top"
Orientation="Horizontal">
<ColorView
Theme="{StaticResource SimpleColorView}"
IsAlphaVisible="True"
HsvColor="hsv(120,11%,10%)" />
</StackPanel>
<StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
<ColorPicker ColorSpectrumShape="Ring">
<ColorPicker.Palette>

73
src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml
View File

@ -6,6 +6,7 @@
xmlns:globalization="using:System.Globalization"
xmlns:pc="using:Avalonia.Controls.Primitives.Converters"
xmlns:primitives="using:Avalonia.Controls.Primitives"
xmlns:cvts="clr-namespace:Semi.Avalonia.ColorPicker.Converters"
x:CompileBindings="True">
<pc:ContrastBrushConverter x:Key="ContrastBrushConverter" />
<converters:ColorToDisplayNameConverter x:Key="ColorToDisplayNameConverter" />
@ -13,6 +14,9 @@
<converters:DoNothingForNullConverter x:Key="DoNothingForNullConverter" />
<converters:EnumToBoolConverter x:Key="EnumToBoolConverter" />
<converters:ToBrushConverter x:Key="ToBrushConverter" />
<cvts:HsvColorToTextConverter x:Key="HsvColorToTextConverter" />
<cvts:ColorToTextConverter x:Key="ColorToTextConverter" />
<cvts:ToColorModel x:Key="ToColorModel" />
<globalization:NumberFormatInfo x:Key="ColorViewComponentNumberFormat" NumberDecimalDigits="0" />
<VisualBrush
@ -562,30 +566,18 @@
</ControlTheme>
<ControlTheme x:Key="SimpleColorView" TargetType="ColorView">
<Setter Property="Width" Value="280" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
<Setter Property="ColorSpectrumComponents" Value="SaturationValue" />
<Setter Property="Template">
<ControlTemplate TargetType="{x:Type ColorView}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" MinHeight="280"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*" MinHeight="280" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Backgrounds -->
<Border
x:Name="ContentBackgroundBorder"
Grid.Row="0"
Grid.RowSpan="3"
Height="{TemplateBinding Height}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Background="{DynamicResource ColorViewContentBackgroundBrush}"
BorderBrush="{DynamicResource ColorViewContentBorderBrush}"
BorderThickness="0,1,0,0"
CornerRadius="{TemplateBinding CornerRadius}" />
<!-- Spectrum Tab -->
<Border
Grid.Row="0"
@ -596,7 +588,7 @@
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Components="{TemplateBinding ColorSpectrumComponents}"
HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
HsvColor="{TemplateBinding HsvColor, Mode=TwoWay}"
MaxHue="{TemplateBinding MaxHue}"
MaxSaturation="{TemplateBinding MaxSaturation}"
MaxValue="{TemplateBinding MaxValue}"
@ -644,22 +636,36 @@
Width="20"
Height="20"
CornerRadius="4" />
<Panel>
<Panel
x:Name="PART_TextBoxPanel"
Width="106"
Margin="4 0 0 0"
HorizontalAlignment="Stretch"
VerticalAlignment="Center">
<TextBox
x:Name="PART_HexTextBox"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Margin="4 0 0 0"
Classes="Small"
AutomationProperties.Name="Hexadecimal Color"
InnerLeftContent="#"
IsVisible="{TemplateBinding IsHexInputVisible}"
IsVisible="{Binding #ColorModelComboBox.SelectedValue, Converter={StaticResource ToColorModel}, ConverterParameter=Hex}"
Text="{Binding #ColorSpectrum.Color, Converter={StaticResource ColorToHexConverter}, Mode=TwoWay}"
MaxLength="8" />
<TextBox
x:Name="PART_HsvaTextBox"
Classes="Small"
IsVisible="{Binding #ColorModelComboBox.SelectedValue, Converter={StaticResource ToColorModel}, ConverterParameter=Hsva}"
Text="{TemplateBinding HsvColor, Converter={StaticResource HsvColorToTextConverter}, Mode=TwoWay}" />
<TextBox
x:Name="PART_RgbaTextBox"
Classes="Small"
IsVisible="{Binding #ColorModelComboBox.SelectedValue, Converter={StaticResource ToColorModel}, ConverterParameter=Rgba}"
Text="{TemplateBinding Color, Converter={StaticResource ColorToTextConverter}, Mode=TwoWay}" />
</Panel>
<NumericUpDown
x:Name="AlphaComponentNumericUpDown"
Width="70"
HorizontalAlignment="Right"
VerticalAlignment="Center"
AllowSpin="True"
Classes="Small"
@ -669,27 +675,24 @@
NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
ShowButtonSpinner="False"
InnerRightContent="%"
Value="{Binding #ColorSpectrumAlphaSlider.Value}">
<NumericUpDown.IsVisible>
<MultiBinding Converter="{x:Static BoolConverters.And}">
<Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
<Binding Path="IsComponentTextInputVisible" RelativeSource="{RelativeSource TemplatedParent}" />
</MultiBinding>
</NumericUpDown.IsVisible>
</NumericUpDown>
IsVisible="{TemplateBinding IsAlphaVisible}"
Value="{Binding #ColorSpectrumAlphaSlider.Value}" />
<ComboBox
x:Name="ColorComponentComboBox"
x:Name="ColorModelComboBox"
Width="80"
VerticalAlignment="Center"
Classes="Small"
SelectedValue="{TemplateBinding ColorModel}">
<ColorModel>Rgba</ColorModel>
SelectedValue="Hex">
Hex<ColorModel>Rgba</ColorModel>
<ColorModel>Hsva</ColorModel>
</ComboBox>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter>
<Style Selector="^[IsAlphaVisible=False] /template/ Panel#PART_TextBoxPanel">
<Setter Property="Width" Value="176" />
</Style>
</ControlTheme>
<Design.PreviewWith>
@ -698,6 +701,6 @@
IsAlphaVisible="True"
IsAlphaEnabled="True"
ColorModel="Hsva"
HsvColor="hsv(120,1,1,30)" />
HsvColor="hsv(120,7%,90%)" />
</Design.PreviewWith>
</ResourceDictionary>

33
src/Semi.Avalonia.ColorPicker/Converters/ColorToTextConverter.cs Normal file
View File

@ -0,0 +1,33 @@
using System;
using System.Globalization;
using System.Linq;
using Avalonia;
using Avalonia.Data;
using Avalonia.Data.Converters;
using Avalonia.Media;
namespace Semi.Avalonia.ColorPicker.Converters;
public class ColorToTextConverter : IValueConverter
{
public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
return value is Color color ? $"{color.R},{color.G},{color.B}" : AvaloniaProperty.UnsetValue;
}
public object ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
if (value is not string str) return BindingOperations.DoNothing;
var parts = str.Split(',');
if (parts.Length != 3 || parts.Any(string.IsNullOrWhiteSpace)) return BindingOperations.DoNothing;
if (byte.TryParse(parts[0], NumberStyles.Integer, CultureInfo.InvariantCulture, out var r) &&
byte.TryParse(parts[1], NumberStyles.Integer, CultureInfo.InvariantCulture, out var g) &&
byte.TryParse(parts[2], NumberStyles.Integer, CultureInfo.InvariantCulture, out var b))
{
return new Color(0xFF, r, g, b);
}
return BindingOperations.DoNothing;
}
}

35
src/Semi.Avalonia.ColorPicker/Converters/HsvColorToTextConverter.cs Normal file
View File

@ -0,0 +1,35 @@
using System;
using System.Globalization;
using System.Linq;
using Avalonia;
using Avalonia.Data;
using Avalonia.Data.Converters;
using Avalonia.Media;
namespace Semi.Avalonia.ColorPicker.Converters;
public class HsvColorToTextConverter : IValueConverter
{
public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
return value is HsvColor hsvColor
? $"{Math.Round(hsvColor.H)},{Math.Round(hsvColor.S * 100)},{Math.Round(hsvColor.V * 100)}"
: AvaloniaProperty.UnsetValue;
}
public object ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
if (value is not string str) return BindingOperations.DoNothing;
var parts = str.Split(',');
if (parts.Length != 3 || parts.Any(string.IsNullOrWhiteSpace)) return BindingOperations.DoNothing;
if (double.TryParse(parts[0], NumberStyles.Float, CultureInfo.InvariantCulture, out var h) &&
double.TryParse(parts[1], NumberStyles.Float, CultureInfo.InvariantCulture, out var s) &&
double.TryParse(parts[2], NumberStyles.Float, CultureInfo.InvariantCulture, out var v))
{
return new HsvColor(1, h, s / 100, v / 100);
}
return BindingOperations.DoNothing;
}
}

21
src/Semi.Avalonia.ColorPicker/Converters/ToColorModel.cs Normal file
View File

@ -0,0 +1,21 @@
using System;
using System.Globalization;
using Avalonia.Controls;
using Avalonia.Data.Converters;
namespace Semi.Avalonia.ColorPicker.Converters;
public class ToColorModel : IValueConverter
{
public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
return parameter is "Hex" && value is "Hex" ||
parameter is "Rgba" && value is ColorModel.Rgba ||
parameter is "Hsva" && value is ColorModel.Hsva;
}
public object ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}