ColorFontPickerWPF

Color picker and font picker add-ons built for WPF.
Includes ColorDialog, ColorPickerControl, ColorPickerPopup, FontDialog, FontPickerControl, FontPickerPopup .
Dialogs follow Winform layout, controls can be added directly in xaml and support collapsing.
The interface automatically displays the corresponding language according to the threads, the localization includes 14 languages.

为WPF打造的颜色选择器和字体选择器附加功能。
包括颜色对话框、颜色选择控件、颜色选择下拉、字体对话框、字体选择控件、字体选择下拉。
对话框沿用Winform的布局，控件可以直接在xaml中插入并支持折叠。
界面根据线程自动显示对应语言，本地化包括14种语言。

ColorDialog:

ColorPickerPopup:

FontDialog:

FontPickerPopup:

English Description

Usage

Download package from Nuget, or using the release Dll.

Color

ColorDialog

Just like winform's way:

using ColorFontPickerWPF;

ColorDialog colorDialog = new ColorDialog();
//colorDialog.SelectedColor = ((SolidColorBrush)label.Background).Color; //In need
if (colorDialog.ShowDialog() == true)
    label.Background = new SolidColorBrush(colorDialog.SelectedColor);

ColorPickerControl

ColorPickerControl-Style1:

ColorPickerControl-Style2:

Additional Property SelectedColor can be get and set.
Additional Property WithoutColorCells can collapse the left interface when True.

• The xaml way

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:ColorPickerControl Width="auto" Height="auto" SelectedColor="Blue" WithoutColorCells="False"/>

v2.0 support for ValueChanged value change events, variable bindings, and Command (triggered on value change) bindings.

<cf:ColorPickerControl Width="auto" Height="auto" 
    SelectedColor="{Binding SelectedColor}" 
    ValueChanged="colorPicker_ValueChanged" 
    Command="{Binding ColorChangeCommand}"/>

• The C# way

using ColorFontPickerWPF;

var colorPicker = new ColorPickerControl();
//colorPicker.SelectedColor = Colors.Red; //In need
grid.Children.Add(colorPicker);

ColorPickerPopup

Additional Property SelectedColor can be get and set.
Additional Property ColorText can show current color value , support 'None','RGB','HEX','HSL' . The displayed value can be obtained from the control's ColorTextValue read-only variable.

ColorText = "RGB":

ColorText = "HEX":

ColorText = "HSL":

• The xaml way

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:ColorPickerPopup SelectedColor="Yellow" ColorText="RGB"/>

v2.0 support for ValueChanged value change events, variable bindings, and Command (triggered on value change) bindings.

<cf:ColorPickerPopup SelectedColor="{Binding SelectedColor}" 
    ValueChanged="colorPicker_ValueChanged" 
    Command="{Binding ColorChangeCommand}"/>

v2.0.1 added popup open and close events and commands

<cf:ColorPickerPopup 
    PopupOpened="colorPickerPopup_PopupOpened" PopupOpenedCommand="{Binding ColorPopupOpenCommand}"
    PopupClosed="colorPickerPopup_PopupClosed" PopupClosedCommand="{Binding ColorPopupCloseCommand}">

• The C# way

using ColorFontPickerWPF;

var colorPicker = new ColorPickerPopup();
//colorPicker.SelectedColor = Colors.Red; //In need
grid.Children.Add(colorPicker);

Font

FontDialog

To make it easier to use, methods to get and set fonts are provided:

using ColorFontPickerWPF;

FontDialog fontDialog = new FontDialog();
//fontDialog.GetFont(textBlock); //In need
if (fontDialog.ShowDialog() == true)
    fontDialog.SetFont(textBlock);

FontPickerControl

FontPickerControl-style1:

FontPickerControl-style2:

FontPickerControl-style3:

Additional Property SelectedFont can be get and set.
Additional Property WithoutDecorations and WithoutPreviewRow can collapse corresponding area when True.

• The xaml way

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:FontPickerControl Width="auto" Height="auto" WithoutDecorations="False" WithoutPreviewRow="False"/>

v2.0 support for ValueChanged value change events, variable bindings, and Command (triggered on value change) bindings.

<cf:FontPickerControl Width="auto" Height="auto" 
    SelectedFont="{Binding SelectedFont}"
    ValueChanged="fontPicker_ValueChanged"
    Command="{Binding FontChangeCommand}" />

• The C# way

using ColorFontPickerWPF;

var fontPicker = new FontPickerControl();
/*//In need
fontPicker.SelectedFont = new Font()
{ 
    FontFamily = new FontFamily("Microsoft YaHei UI"),
    FontSize = 12
}; 
//fontPicker.Get(textBlock);//Or use a wrapped method to get the control's font directly
*/
grid.Children.Add(fontPicker);

FontPickerPopup

Additional Property SelectedFont can be get and set.
Additional Property FontText can view current font style, default value is 'FontSize: {fontsize}px'. You can write something else, and '{fontsize}' will be replace to font size value.

FontText="":

FontText="Font Example":

FontText="Size:{fontsize}":

• The xaml way

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:FontPickerPopup FontText=""/>

v2.0 support for ValueChanged value change events, variable bindings, and Command (triggered on value change) bindings.

<cf:FontPickerPopup Width="auto" Height="auto" 
    SelectedFont="{Binding SelectedFont}"
    ValueChanged="fontPicker_ValueChanged"
    Command="{Binding FontChangeCommand}" />

v2.0.1 added popup open and close events and commands

<cf:FontPickerPopup
    PopupOpened="fontPickerPopup_PopupOpened" PopupOpenedCommand="{Binding FontPopupOpenCommand}"
    PopupClosed="fontPickerPopup_PopupClosed" PopupClosedCommand="{Binding FontPopupCloseCommand}"/>

• The C# way

using ColorFontPickerWPF;

var fontPicker = new FontPickerPopup();
/*//In need
fontPicker.SelectedFont = new Font()
{ 
    FontFamily = new FontFamily("Microsoft YaHei UI"), 
    FontSize = 12
}; 
//fontPicker.Get(textBlock);// or get font from control
*/
grid.Children.Add(fontPicker);

Additional information

• ColorPicker reference Winform design, in addition to RGB and HSL, HEX format has been added, and added a full screen color picking function.
• “SelectedFont is an instance of the Font class. v2.0 onwards the entity structure has been simplified and the latest structure is as follows:

public class Font
{
    public FontFamily FontFamily { get; set;}
    public FontStyle FontStyle { get; set;}
    public FontWeight FontWeight { get; set;}
    public FontStretch FontStretch { get; set;}
    public TextDecorationType TextDecorationType { get; set;}
    public double FontSize { get; set;}
}
public enum TextDecorationType
{
    None,
    OverLine,
    Strikethrough,
    Baseline,
    Underline,
}

Tip

• Setting with xaml

In earlier versions you had to manually bind each property to achieve the style association, now v2.0 provides an additional property to quickly set or bind to the font class:
For example, bind to FontPickerControl:

<TextBlock cf:FontExtension.FontData="{Binding SelectedFont,ElementName=fontPicker,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />

Or bind to the Font entity of the ViewModel:

<TextBlock cf:FontExtension.FontData="{Binding SelectedFont}"/>

• The C# way

provides wrapped methods fontDialog.GetFont(), fontPickerControl.GetFont(), fontPickerPopup.GetFont() and fontDialog.SetFont(), fontPickerControl.SetFont(), fontPickerPopup.SetFont().

• The interface language is displayed automatically according to the current thread, or you can specify the interface language manually:

using ColorFontPickerWPF;

PickerLanguageManager.settings.UIculture = new CultureInfo("en-US");

14 languages are currently supported, including: Chinese, English, Arabic, Czech, German, Spanish, French, Hungarian, Italian, Japanese, Portuguese, Romanian, Russian, and Swedish.

Version

• v2.0.1 2025/1/4 Add external popup open and close events and commands for popup controls, set the level of disclosure of converters inside controls.
• v2.0.0 2025/1/3 Optimize the default layout of the color picker, reorganize and optimize the code; add ValueChange event and Command command, attribute default bidirectional binding; simplify the splitting of the font entity, and turn it into json for easy preservation; generalize the conversion of fonts, and provide additional attributes for fast binding.
• v1.0.4 2022/12/25 Fix the color dialog language, optimize the method of switching language, no longer force to change to current language before loading.
• v1.0.3 2022/10/17 Add popup control, optimize color control's slider visual effect.
• v1.0.2 2022/10/15 Fix the bug that some parts are not updated after the assignment.
• v1.0.1 2022/10/14 Removed the use of color library, color conversion was changed to self-implemented. Fixed bugs in font dialog. added multi-language support, expanded from 2 to 14 languages.
• v1.0.0 2022/10/13 Basic features. Dialogs and selection controls.

---

中文说明

颜色对话框：

颜色选择下拉：

字体对话框：

字体选择下拉：

使用

从Nuget下载包，或者引用Release中的dll。

颜色

颜色对话框（ColorDialog）

跟 Winform 一样调用:

using ColorFontPickerWPF;

ColorDialog colorDialog = new ColorDialog();
//colorDialog.SelectedColor = ((SolidColorBrush)label.Background).Color; //如果需要显示当前值
if (colorDialog.ShowDialog() == true)
    label.Background = new SolidColorBrush(colorDialog.SelectedColor);

颜色选择控件（ColorPickerControl）

颜色选择控件-样式1：

颜色选择控件-样式2：

附加属性 SelectedColor（选择的颜色）可以设置和获取。
附加属性 WithoutColorCells（不要颜色格子）为True的时候可以折叠左边部分。

• 用 xaml 的方式

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:ColorPickerControl Width="auto" Height="auto" SelectedColor="Blue" WithoutColorCells="False"/>

v2.0开始支持ValueChanged值变更事件、变量绑定、Command（值变更时触发）绑定

<cf:ColorPickerControl Width="auto" Height="auto" 
    SelectedColor="{Binding SelectedColor}" 
    ValueChanged="colorPicker_ValueChanged" 
    Command="{Binding ColorChangeCommand}"/>

• 用 C# 的方式

using ColorFontPickerWPF;

var colorPicker = new ColorPickerControl();
//colorPicker.SelectedColor = Colors.Red; //如果需要显示当前值
grid.Children.Add(colorPicker);

颜色选择下拉（ColorPickerPopup）

附加属性 SelectedColor（选择的颜色）可以设置和获取。
附加属性 ColorText （颜色文本）可以显示当前颜色值，支持颜色模型："None"，"RGB"，"HEX"，"HSL"。显示的值可以通过控件的ColorTextValue只读变量获取。

ColorText = "RGB":

ColorText = "HEX":

ColorText = "HSL":

• 用 xaml 的方式

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:ColorPickerPopup SelectedColor="Yellow" ColorText="RGB"/>

v2.0开始支持ValueChanged值变更事件、变量绑定、Command（值变更时触发）绑定

<cf:ColorPickerPopup SelectedColor="{Binding SelectedColor}" 
    ValueChanged="colorPicker_ValueChanged" 
    Command="{Binding ColorChangeCommand}"/>

v2.0.1还增加了popup打开和关闭事件和命令

<cf:ColorPickerPopup 
    PopupOpened="colorPickerPopup_PopupOpened" PopupOpenedCommand="{Binding ColorPopupOpenCommand}"
    PopupClosed="colorPickerPopup_PopupClosed" PopupClosedCommand="{Binding ColorPopupCloseCommand}">

• 用 C# 的方式

using ColorFontPickerWPF;

var colorPicker = new ColorPickerPopup();
//colorPicker.SelectedColor = Colors.Red; //如果需要显示当前值
grid.Children.Add(colorPicker);

字体

字体对话框（FontDialog）

为了更便于使用，字体提供了获取和设置的封装方法：

using ColorFontPickerWPF;

FontDialog fontDialog = new FontDialog();
//fontDialog.GetFont(textBlock); //如果需要显示当前值
if (fontDialog.ShowDialog() == true)
    fontDialog.SetFont(textBlock);

字体选择控件（FontPickerControl）

字体选择控件-样式1：

字体选择控件-样式2：

字体选择控件-样式3：

附加属性 SelectedFont（选择的字体）可以获取和设置。
附加属性 WithoutDecorations （不要装饰线设置）和 WithoutPreviewRow （不要预览行）值为True的时候可以折叠对应区域。

• 用 xaml 的方式

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:FontPickerControl Width="auto" Height="auto" WithoutDecorations="False" WithoutPreviewRow="False"/>

v2.0开始支持ValueChanged值变更事件、变量绑定、Command（值变更时触发）绑定

<cf:FontPickerControl Width="auto" Height="auto" 
    SelectedFont="{Binding SelectedFont}"
    ValueChanged="fontPicker_ValueChanged"
    Command="{Binding FontChangeCommand}" />

• 用 C# 的方式

using ColorFontPickerWPF;

var fontPicker = new FontPickerControl();
/*//如果需要显示当前值
fontPicker.SelectedFont = new Font()
{ 
    FontFamily = new FontFamily("Microsoft YaHei UI"), 
    FontSize = 12
}; 
//fontPicker.Get(textBlock);//或者用封装的方法直接获取控件字体
*/
grid.Children.Add(fontPicker);

字体选择下拉（FontPickerPopup）

附加属性 SelectedFont（选择的字体）可以获取和设置。
附加属性 FontText（字体文本） 可以显示当前字体样式，默认显示 'FontSize: {fontsize}px'。可以自定义任何内容，并且“{fontsize}”可以作为变量显示当前字号。

FontText="":

FontText="字体预览":

FontText="字号：{fontsize}px":

• 用 xaml 的方式

xmlns:cf="clr-namespace:ColorFontPickerWPF;assembly=ColorFontPickerWPF"
        
<cf:FontPickerPopup FontText=""/>

v2.0开始支持ValueChanged值变更事件、变量绑定、Command（值变更时触发）绑定

<cf:FontPickerPopup Width="auto" Height="auto" 
    SelectedFont="{Binding SelectedFont}"
    ValueChanged="fontPicker_ValueChanged"
    Command="{Binding FontChangeCommand}" />

v2.0.1还增加了popup打开和关闭事件和命令

<cf:FontPickerPopup
    PopupOpened="fontPickerPopup_PopupOpened" PopupOpenedCommand="{Binding FontPopupOpenCommand}"
    PopupClosed="fontPickerPopup_PopupClosed" PopupClosedCommand="{Binding FontPopupCloseCommand}"/>

• 用 C# 的方式

using ColorFontPickerWPF;

var fontPicker = new FontPickerPopup();
/*//如果需要显示当前值
fontPicker.SelectedFont = new Font()
{ 
    FontFamily = new FontFamily("Microsoft YaHei UI"), 
    FontSize = 12
}; 
//fontPicker.Get(textBlock);//或者用封装的方法直接获取控件字体
*/
grid.Children.Add(fontPicker);

补充说明

• 颜色选择器沿用Winform的布局，除了RGB、HSL之外还增加了HEX格式，另外还有全屏取色的功能。
• “SelectedFont” （选择的字体）是 “Font” 类的实例。v2.0之后实体结构简化，最新结构如下：

public class Font
{
    public FontFamily FontFamily { get; set;}
    public FontStyle FontStyle { get; set;}
    public FontWeight FontWeight { get; set;}
    public FontStretch FontStretch { get; set;}
    public TextDecorationType TextDecorationType { get; set;}
    public double FontSize { get; set;}
}
public enum TextDecorationType
{
    None,
    OverLine,
    Strikethrough,
    Baseline,
    Underline,
}

Tip

• 设置用 xaml 的方式

在早期的版本你需要手动绑定每个属性来实现样式关联，现在 v2.0 提供了一个附加属性来快速设置或者绑定font类：

比如绑定到 FontPickerControl：

<TextBlock  cf:FontExtension.FontData="{Binding SelectedFont,ElementName=fontPicker,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

或者绑定到 ViewModel 的 Font 实体：

<TextBlock cf:FontExtension.FontData="{Binding SelectedFont}"/>

• 用 C# 的方式

提供了封装的方法"fontDialog.GetFont()", "fontPickerControl.GetFont()", "fontPickerPopup.GetFont()" 以及 "fontDialog.SetFont()", "fontPickerControl.SetFont()", "fontPickerPopup.SetFont()"。

• 界面语言根据当前线程自动显示，你也可以手动指定界面语言：

using ColorFontPickerWPF;

PickerLanguageManager.settings.UIculture = new CultureInfo("en-US");

目前支持14种语言，包括：中文，英语，阿拉伯语，捷克语，德语，西班牙语，法语，匈牙利语，意大利语，日语，葡萄牙语，罗马尼亚语，俄语，瑞典语。

版本

• v2.0.1 2025/1/4 为下拉控件增加对外的popup open和close事件以及command，调整控件内部转换器的公开程度
• v2.0.0 2025/1/3 优化颜色选择器默认布局，重新整理并优化代码；增加ValueChange事件和Command命令，属性默认双向绑定；字体实体简化拆分，转json便于保存；字体转换通用化，提供附加属性快速绑定
• v1.0.4 2022/12/25 修复颜色对话框语言，优化切换语言方法，不再加载前强制改为当前语言。
• v1.0.3 2022/10/17 添加下拉控件，优化颜色控件的滑动条视觉效果。
• v1.0.2 2022/10/15 修复赋值之后部分不更新的bug。
• v1.0.1 2022/10/14 移除了对颜色库的使用，颜色转换改为自行实现。字体对话框修复bug。新增多语言支持，从2种语言扩展到14种。
• v1.0.0 2022/10/13 基本功能。对话框和选择控件。