WPF颜色选择控件

效果图：

cs：

    /// <summary>
    /// ColorPick.xaml 的交互逻辑
    /// </summary>
    public partial class ColorPick : UserControl
    {
        ChangeSource _changeSource;

        public Brush Value
        {
            get { return (Brush)GetValue(ValueProperty); }
            set { SetValue(ValueProperty, value); }
        }

        // Using a DependencyProperty as the backing store for Color.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty ValueProperty =
            DependencyProperty.Register("Value", typeof(Brush), typeof(ColorPick), new FrameworkPropertyMetadata(Brushes.Transparent, FrameworkPropertyMetadataOptions.AffectsMeasure, ColorChanged));

        private static void ColorChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            ColorPick pick = d as ColorPick;
            pick.Update(ChangeSource.Text);
        }

        public ColorPick()
        {
            InitializeComponent();
        }

        void Update(ChangeSource source)
        {
            if (!IsLoaded || _changeSource != ChangeSource.None) return;
            _changeSource = source;
            try
            {
                Color color;
                switch (source)
                {
                    case ChangeSource.None:
                        break;
                    case ChangeSource.Slider:
                        color = new Color { A = (byte)sAlpha.Value, R = (byte)sRed.Value, G = (byte)sGreen.Value, B = (byte)sBlue.Value };
                        Value = new SolidColorBrush(color);
                        this.TbColor.Text = color.ToString();
                        break;
                    case ChangeSource.Text:
                        color = (Color)ColorConverter.ConvertFromString(this.TbColor.Text);
                        Value = new SolidColorBrush(color);
                        UpdateSlider(color);
                        break;
                    case ChangeSource.Source:
                        UpdateSlider((Value as SolidColorBrush).Color);
                        this.TbColor.Text = (Value as SolidColorBrush).Color.ToString();
                        break;
                    default:
                        break;
                }
                this.preview.Background = new SolidColorBrush(color);
            }
            catch { }
            _changeSource = ChangeSource.None;
        }

        void UpdateSlider(Color color)
        {
            sAlpha.Value = color.A;
            sRed.Value = color.R;
            sGreen.Value = color.G;
            sBlue.Value = color.B;
        }

        private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            Update(ChangeSource.Slider);
        }

        private void TbColor_TextChanged(object sender, TextChangedEventArgs e)
        {
            try
            {
                Update(ChangeSource.Text);
            }
            catch { }
        }

        enum ChangeSource { None, Slider, Text, Source };
    }

XAML:

<UserControl x:Class="WpfApp.Controls.ColorPick"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             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:local="clr-namespace:WpfApp.Controls"
             mc:Ignorable="d"  d:DesignWidth="300">
    <Grid>
        <DockPanel>
            <Border Width="50" DockPanel.Dock="Right" Margin="5,0,0,0">
                <Border.Background>
                    <VisualBrush Viewport="0,0 20,20" ViewportUnits="Absolute" TileMode="Tile">
                        <VisualBrush.Visual>
                            <UniformGrid Columns="2" Rows="2" Width="20" Height="20">
                                <Rectangle Fill="White"/>
                                <Rectangle Fill="LightGray"/>
                                <Rectangle Fill="LightGray"/>
                                <Rectangle Fill="White"/>
                            </UniformGrid>
                        </VisualBrush.Visual>
                    </VisualBrush>
                </Border.Background>
                <Border x:Name="preview"/>
            </Border>
            <Slider x:Name="sRed" ValueChanged="Slider_ValueChanged" DockPanel.Dock="Top" Height="10" Orientation="Horizontal" AutoToolTipPlacement="TopLeft" Maximum="255" Foreground="Orange">
                <Slider.Background>
                    <LinearGradientBrush>
                        <GradientStop Color="Gray" />
                        <GradientStop Color="Red" Offset="1"/>
                    </LinearGradientBrush>
                </Slider.Background>
            </Slider>
            <Slider x:Name="sGreen" Margin="0,5" ValueChanged="Slider_ValueChanged"  DockPanel.Dock="Top" Height="10" Orientation="Horizontal" AutoToolTipPlacement="TopLeft" Maximum="255" Foreground="Orange">
                <Slider.Background>
                    <LinearGradientBrush>
                        <GradientStop Color="Gray" />
                        <GradientStop Color="Green" Offset="1"/>
                    </LinearGradientBrush>
                </Slider.Background>
            </Slider>
            <Slider x:Name="sBlue" ValueChanged="Slider_ValueChanged" DockPanel.Dock="Top" Height="10" Orientation="Horizontal" AutoToolTipPlacement="TopLeft" Maximum="255" Foreground="Orange">
                <Slider.Background>
                    <LinearGradientBrush>
                        <GradientStop Color="Gray" />
                        <GradientStop Color="Blue" Offset="1"/>
                    </LinearGradientBrush>
                </Slider.Background>
            </Slider>
            <Border DockPanel.Dock="Top" Margin="0,5,0,0">
                <Border.Background>
                    <VisualBrush Viewport="0,0 20,20" ViewportUnits="Absolute" TileMode="Tile">
                        <VisualBrush.Visual>
                            <UniformGrid Columns="2" Rows="2" Width="20" Height="20">
                                <Rectangle Fill="White"/>
                                <Rectangle Fill="LightGray"/>
                                <Rectangle Fill="LightGray"/>
                                <Rectangle Fill="White"/>
                            </UniformGrid>
                        </VisualBrush.Visual>
                    </VisualBrush>
                </Border.Background>
                <Slider x:Name="sAlpha" ValueChanged="Slider_ValueChanged" Height="10" Orientation="Horizontal" AutoToolTipPlacement="TopLeft" Maximum="255" Foreground="Orange">
                    <Slider.Background>
                        <LinearGradientBrush>
                            <GradientStop Color="Transparent" />
                            <GradientStop Color="White" Offset="1"/>
                        </LinearGradientBrush>
                    </Slider.Background>
                </Slider>
            </Border>
            <TextBox x:Name="TbColor" Text="#FF000000" TextChanged="TbColor_TextChanged" VerticalContentAlignment="Center" FontSize="15" DockPanel.Dock="Top" Margin="0,5,0,0" Height="20"/>
            <Rectangle/>
        </DockPanel>
    </Grid>
</UserControl>

使用方式：

                <control:ColorPick Value="#55666666"/>