RadGridView Selection color

[Marcel]

Hello,

I have a RadGridVIew in which I use the color of rows to indicate a certain property of the row data (e.g. order, invoice, delivery slip etc.).
When the user selects a row the row will be yellow.
My question is how can I change this, the user wants to see the color of the row and a blue border to indicate which row is selected.
I looked at different threads but didnt find any solution.

The style that I use for the GridViewRow is shown below:

<telerik:RadGridView.Resources>
    <Style TargetType="{x:Type telerik:GridViewRow}">
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=DocumentType.DocumentTypeID}" Value="1">
                <Setter Property="Background" Value="#FFEBEB1B" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=DocumentType.DocumentTypeID}" Value="3">
                <Setter Property="Background" Value="LightGreen" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=DocumentType.DocumentTypeID}" Value="9">
                <Setter Property="Background" Value="Cyan" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=DocumentType.DocumentTypeID}" Value="10">
                <Setter Property="Background" Value="LightBlue" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=DocumentType.DocumentTypeID}" Value="4">
                <Setter Property="Background" Value="Gray" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=IsDocumentGeannuleerd}" Value="True">
                <Setter Property="Background" Value="IndianRed" />
            </DataTrigger>

            <!-- THE CODE BELOW IS NOT WORKING -->

            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="Transparent"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</telerik:RadGridView.Resources>

Any help would be greatly appreciated.

Kind Regards,

Marcel

[Lance | Manager Technical Support]

Hello Chris,

In order to change the selected row's appearance you'll need to predefine the template. You can extract it using Blend for Visual Studio (or Expression Blend if you are using an older version of Visual Studio). This page in the documentation will show you the steps needed within the "Modifying the Default Style" section.

In particular, you'll want to modify the Background_Selected element. Since the Background_Selected element is a Border, you'll need to target the Fill property instead of a Background property.

I have used your code and have written a sample application (attached) that achieves what you're looking for. I moved your Style Triggers to the new RowStyle in Windows.Resources. Look for my two code comments in the template that highlight the changes I made to the default style.

Thank you for contacting Support and thank you for choosing Telerik.

Regards,
Lance
Telerik

 

 

[Dush]

Hi Team,

How can select multiple rows (SelectionMode="Extended") without changing selected row color and show border on each selected rows. According to the given example it show border on last select column.

Cheers,

D

 

 

[Stefan]

Hi Dush,

Thank you for the provided image.

The cell to which you refer is the CurrentCell of RadGridView. Speaking generally, the control can have multiple selected items, but cannot have multiple current cells. May I kindly ask you to share some additional information regarding the behavior you are aiming at? Is it just related to the visual appearance of the control?

Regards,
Stefan X1
Progress Telerik

[Dush]

Hi Stefan,

Thanks for your reply.

I need same behavior as given sample(GridViewSelection.zip) with below changes,

1. Sample does not support multi row selection.

2. In provided sample, If you want to select a row (item) in the grid it highlight only cell (SampleBehaviour.png). But my requirement is select whole row (ExpectedBehavior.png) and should be able to select multiple rows.

3. Selected rows should be highlighted using item border (ExpectedBehavior.png)

Cheers,

Dush

 

 

. 

 

 

 

[Stefan]

Hi Dush,

Such behavior can be achieved by modifying the template of GridViewRow and its Border named Background_Selected in particular. Attached to my reply you can find a sample application I prepared for your convenience that demonstrates the approach. Can you please check it out? You should be able to see that I have commented our the inner Border used within the aforementioned element. Thus, only the outer Border will be visualized. Furthermore, you can modify the BorderBrush that is used for it.

Additionally, you may find the following topics useful on this matter.

- Editing Control Templates

- Setting a Theme

I hope this helps.

Regards,
Stefan X1
Progress Telerik

[Dush]

Hi Stefan,

This is the feature needed. Thanks for the grate support and for the references.

Appreciate your help.

Cheers,

Dush

[Pe]

Hello, could I have a style with Template property based on  <ControlTemplate TargetType="{x:Type telerik:GridViewRow}"> without having all the default controlTemplate in my xaml ? 

[Stefan]

Hi,

The framework allows Style inheritance, but the same cannot be achieved with templates. So, when customizing the template of a given element its whole template has to be extracted. I would also like to clarify, that with our next official R3 2018 release we will expose the SelectedBackground property of GridViewRow. With it setting the Background of the selected row would not require editing the whole template of the row.

Regards,
Stefan
Progress Telerik