This is a migrated thread and some comments may be shown as answers.

RadGridView Selection color

8 Answers 505 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Marcel
Top achievements
Rank 1
Marcel asked on 21 Jun 2014, 04:46 PM
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

8 Answers, 1 is accepted

Sort by
0
Lance | Manager Technical Support
Telerik team
answered on 23 Jun 2014, 11:51 AM
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
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
Dush
Top achievements
Rank 1
answered on 07 Jun 2017, 03:08 AM

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

 

 

0
Stefan
Telerik team
answered on 09 Jun 2017, 04:35 PM
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
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Dush
Top achievements
Rank 1
answered on 14 Jun 2017, 02:43 AM

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

 

 

 

 

 

0
Stefan
Telerik team
answered on 16 Jun 2017, 01:13 PM
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
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Dush
Top achievements
Rank 1
answered on 18 Jun 2017, 08:30 AM

Hi Stefan,

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

Appreciate your help.

Cheers,

Dush

0
Pe
Top achievements
Rank 1
answered on 27 Jul 2018, 09:14 AM
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 ? 
0
Stefan
Telerik team
answered on 27 Jul 2018, 03:16 PM
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
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
GridView
Asked by
Marcel
Top achievements
Rank 1
Answers by
Lance | Manager Technical Support
Telerik team
Dush
Top achievements
Rank 1
Stefan
Telerik team
Pe
Top achievements
Rank 1
Share this question
or