WPF 一个简单的颜色选择器

本章讲述：WPF中，一个简单的颜色选择器的实现；

具体简单的界面显示引用可以参考地址：https://blog.csdn.net/BYH371256/article/details/90520134

使用外部依赖库文件：“ColorPicker.dll”；

下载地址：https://download.csdn.net/download/byh371256/10745273

1、XAML界面代码

<Window x:Class="ColorInput.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:ColorPicker;assembly=ColorPicker"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="cprct" TargetType="{x:Type Rectangle}">
            <Setter Property="Width" Value="25"/>
            <Setter Property="Height" Value="25"/>
            <Setter Property="Margin" Value="1"/>
            <Setter Property="Stroke" Value="Gray"/>
            <Setter Property="StrokeThickness" Value="1"/>
            <EventSetter Event="PreviewMouseLeftButtonDown" Handler="Rectangle_PreviewMouseLeftButtonDown"/>
        </Style>
    </Window.Resources>
    <Border  VerticalAlignment="Center" Width="280" Background="#f0f0f0">
        <StackPanel>
            <WrapPanel HorizontalAlignment="Center">
                <Rectangle Style="{StaticResource cprct}" Fill="White"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Gray"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Yellow"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Orange"/>
                <Rectangle Style="{StaticResource cprct}" Fill="HotPink"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Peru"/>
                <Rectangle Style="{StaticResource cprct}" Fill="RoyalBlue"/>
                <Rectangle Style="{StaticResource cprct}" Fill="SkyBlue"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Teal"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Tomato"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Black"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Sienna"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Gold"/>
                <Rectangle Style="{StaticResource cprct}" Fill="DarkBlue"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Magenta"/>
                <Rectangle Style="{StaticResource cprct}" Fill="LimeGreen"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Lime"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Blue"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Green"/>
                <Rectangle Style="{StaticResource cprct}" Fill="Red"/>
            </WrapPanel>
            <StackPanel Orientation="Horizontal" Height="30">
                <TextBlock Text="ARGB:" VerticalAlignment="Center" Margin="16,0,10,0"/>
                <TextBox Text="{Binding ElementName=cpicker, Path=SelectedColor, Mode=TwoWay}" VerticalAlignment="Center" Width="90"/>
                <Rectangle Stroke="Gray" StrokeThickness="1" Width="80" Height="22" Margin="10,4,4,4"
                           Fill="{Binding ElementName=cpicker, Path=SelectedBrush}"/>
            </StackPanel>
            <local:ColorPicker x:Name="cpicker" SelectedColorChanged="cpicker_SelectedColorChanged"
                   SelectedColor="{Binding ElementName=clrctrl, Path= ExSelectedColor,Mode=OneWayToSource}"
                   SelectedBrush="{Binding ElementName= clrctrl,Path=ExSelectedBrush, Mode=TwoWay}" />
        </StackPanel>
    </Border>
</Window>

2、后台逻辑代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace ColorInput
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = this;
        }
        private void Rectangle_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            e.Handled = true;
            Brush brush = (sender as Rectangle).Fill;
            Color c = (Color)ColorConverter.ConvertFromString(brush.ToString());
            cpicker.SelectedColor = c;
            if (ColorChangedEvent != null)
                ColorChangedEvent(this, c);
        }

        public event ColorChangedHandler ColorChangedEvent;

        private void cpicker_SelectedColorChanged(object sender, RoutedPropertyChangedEventArgs<Color> e)
        {
            if (this.IsLoaded == false)
                return;
            if (ColorChangedEvent != null)
                ColorChangedEvent(this, e.NewValue);
        }

        public static readonly DependencyProperty ExSelectedColorProperty = DependencyProperty.Register(
                     "ExSelectedColor",
                     typeof(Color),
                     typeof(MainWindow),
                     new PropertyMetadata(Colors.Black));

        public Color ExSelectedColor
        {
            get { return (Color)GetValue(ExSelectedColorProperty); }
            set { SetValue(ExSelectedColorProperty, value); }
        }

        public static readonly DependencyProperty ExSelectedBrushProperty = DependencyProperty.Register(
                      "ExSelectedBrush",
                      typeof(Brush),
                      typeof(MainWindow),
                      new PropertyMetadata(Brushes.Black));

        public Brush ExSelectedBrush
        {
            get { return (Brush)GetValue(ExSelectedBrushProperty); }
            set { SetValue(ExSelectedBrushProperty, value); }
        }
    }

    public delegate void ColorChangedHandler(object sender, Color newColor);
}

3、效果图