Ghost1372

everything can be handy

ColorPalette

ColorPalette is based on GridView. so you can use SelectedItem, SelectedIndex and other proeprties.

1
public partial class ColorPalette : GridView
1
public partial class ColorPaletteItem : Control

ColorPaletteItem

Attributes

Property
ShowHexCode
ShowColorName
ShowToolTip
ItemShape
ColorName
Color

ColorPalette

Attributes

Property
SelectedColor
ItemWidth
ItemHeight
Colors
IsCopyColorCodeOnClickEnabled
ShowHexCode
ShowColorName
ShowToolTip
ColorSet
ItemShape
ItemsPanel

Events

Name
ColorChanged

Example

1
<dev:ColorPalette />

Custom ColorSet

If you want to use your own color set, you can do it in two ways: by adding items in XAML or by adding colors in C# code.

Xaml Direct

1
2
3
4
5
6
7
8
<dev:ColorPalette ColorSet="Custom">
<dev:ColorPalette.Colors>
<dev:ColorPaletteItem Color="Red" ColorName="Red"/>
<dev:ColorPaletteItem Color="Green" ColorName="Green"/>
<dev:ColorPaletteItem Color="Orange" ColorName="Orange"/>
<dev:ColorPaletteItem Color="Blue" ColorName="Blue"/>
</dev:ColorPalette.Colors>
</dev:ColorPalette>

C# Way

1
<dev:ColorPalette x:Name="ColorPaletteSample" ColorSet="Custom" />
1
2
3
4
5
6
ColorPaletteSample.Colors = new ObservableCollection<ColorPaletteItem2>
{
new ColorPaletteItem2{ Color = Colors.Red, ColorName = "Red" },
new ColorPaletteItem2{ Color = Colors.Yellow, ColorName = "Yellow" },
new ColorPaletteItem2{ Color = Colors.Orange, ColorName = "Orange" },
};

You must set ColorSet to Custom, and then add your ColorPaletteItem instances to the Colors collection — not ItemsSource or Items.

Customize ItemShape

The ColorPalette control accepts ColorPaletteItem elements.
So, if you want to customize the item shape, you can override the ColorPaletteItem style and set its ItemShape property to Custom.
This ensures that the control won’t overwrite your custom ControlTemplate.

ItemsPanel

currently we are using a WrapPanel, but if you want, you can customize ItemsPanel:

1
2
3
4
5
<dev:ColorPalette.ItemsPanel>
<ItemsPanelTemplate>
<dev:UniformGrid Columns="10"/>
</ItemsPanelTemplate>
</dev:ColorPalette.ItemsPanel>

Demo

you can run demo and see this feature.

DevWinUI

0%