Styling a checkbox in RadGridView

[Charlie]

Hello. I am currently trying to accomplish a couple of things with checkbox columns in a RadGridView. My experience with styling in XAML is zero, so good examples would be helpful.

 

I would like to be able to take the standard checkbox control and 

1. Make it larger (for both view and edit mode)

2. When in view mode, style the checkbox control in some way to make it stand out (like Bold or a different color).

 

The documentation does not provide any examples at all on how to apply styles outside of telling you to create a ControlTemplate and then applying that ControlTemplate to a Style. I believe this is tailored to a developer that already knows how to do these things. 

I would like to apply this per-grid for the time being.

[Dilyan Traykov]

Hello Charlie,

In order to achieve the desired look for the view and edit mode of the GridViewCheckBoxColumn, you will need to modify the control templates for the GridViewCheckBox and CheckBox elements respectively.

This can be done by either modifying the default styles of the controls in Microsoft Blend or by manually extracting and modifying the template from the theme file.

You can then place these styles inside the Resources of your RadGridView to apply them only to this particular instance.

To help you out, I'm attaching a sample project where I've modified the templates of the controls for the Office_Black theme. You can follow the same pattern in order to apply custom styling for the other themes as well.

Please let me know if you need any additional assistance on the matter.

Regards,
Dilyan Traykov
Telerik by Progress

[Paul]

This can't be the only way. I want to make the checkbox not look disabled and I have to worry about VisualStateManager and ObjectAnimationUsingKeyFrames?

[Dilyan Traykov]

Hello Paul,
Extracting and modifying the template is in fact needed to achieve the result desired by Charlie with the Office_Black theme.
Depending on the appearance you wish to accomplish and the theme you're using, however, it may not be necessary to extract the whole template and you could only modify the style of the GridViewCheckBox element.
For example, you can define the following style when using the Material theme:

            <telerik:RadGridView.Resources>
                <Style TargetType="telerik:GridViewCheckBox" BasedOn="{StaticResource GridViewCheckBoxStyle}">
                    <Setter Property="Foreground" Value="Yellow" />
                    <Setter Property="Background" Value="Blue" />
                </Style>
            </telerik:RadGridView.Resources>

And it will be rendered like this:

Please note, however, that for the purpose, I've also set the SecondaryOpacity of the MaterialPalette to 1.
If you would specify the theme(s) you're using and would further elaborate on the desired result, I'd be more than happy to suggest a solution that does not involve extracting the control template if this is possible.

[Paul]

Thanks Dilyan,
I was able to get around the problem by using a <DataTemplate> with  <CheckBox>