We are using XamColorPicker in our application to select a color, and based on our requirement we want to customize the color picker control.
In below screen Currently “Color From Global theme” has ten colors and User supplied(Derived colors) are based on “Color From Global theme”
We want only one color in “Color From Global theme” and user supplied(derived colors) should as it is ten colors(no change in derived colors).
Please let me how to implement the customization in the control.
Please find the attachment.
Customized control
Hi,
I’m not exactly sure what you are trying to do but in order to generate something like your picture represents you would need to retemplating the xamColorPicker style.
I am going to attach my sample as an example.
I replaced the ColorPalettes ComboBox with a rectangle and then replaced the CurrentColorStrip with a small rectangle to represent your single color.
The ColorPallete colors provide the colors to the CurrentColorStrip and for the derived colors, so they need to be included.
Please let me know if you have any questions.
Thanks for reply,
It’s closer to what I was thinking but there is no action on click of the rectangle(newly added red rectangle). current color should change on selection of rectangle similar to other colors.
Small correction---
We need tow rectangles Red and Green instead of single rectangle
When we select one item( red or green) then the current color(selected color) should be changed as sleeted rectangle. i.e. behavior should be same as combo box with two items red and green color.
I was wondering if you had any further questions or if there was anything more I could help you with.
Here is an approach you can use in the attached sample.
Assuming the first two colors in your Current Color Palette are the colors you want displayed in the “Color From Global Theme” then you can add the style for the XamColorPicker to your application and then add a resources collection to the ColorStrip. In this resource collection you can add a style for the ColorItemBox and set a converter to change the visibility of all but the first two boxes to collapsed:
:ColorStrip x:Name="CurrentColorStrip"
igPrim:ColorStripManager.Manager="{StaticResource StripManager}"
ColorPalette="{Binding CurrentPalette, Mode=OneWay,
RelativeSource={RelativeSource TemplatedParent}}" >
<igPrim:ColorStrip.Resources>
<Style TargetType="igPrim:ColorItemBox">
<Setter Property="Visibility" Value="{Binding Converter={StaticResource VC}}" />
Style>
igPrim:ColorStrip.Resources>
igPrim:ColorStrip>
If you want the colors to have no relation to the derived colors, you can add a converter on the binding to the ItemsSource for the CollorPallete and return a completely new collection of colors:
<igPrim:ColorStrip x:Name="CurrentColorStrip" igPrim:ColorStripManager.Manager="{StaticResource StripManager}" ColorPalette="{Binding CurrentPalette, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource VC}" >
See commented out code.
Let me know if you have any questions and if this meets your needs.