Changing the highlight/selection color for an entire row

[Rob Peters]

I have a gridview item with a red background and a white text.
When i move the mouse above the gridview i get a yellow highlight, that causes the text to be unreadable.

Is there a easy way to set the row background/foreground color for the highlight, and selection?

For example:
Highlight: background = yellow, foreground=black
Selection: background = orange, foreground=black

With regards,
Rob

[Ваня]

You cah achieve this effect by setting the style ro the rows in the grdiview and the corresponding triggers-I have used your notes about this and here is the code sample:

<Window x:Class="HightLighted.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">

    <Grid>

        <telerik:RadGridView ItemsSource="{Binding}" Background="Red" Foreground="White" AutoGenerateColumns="False" HorizontalAlignment="Left" Margin="24,36,0,0" Name="radGridView1" VerticalAlignment="Top">

            <telerik:RadGridView.RowStyle>

                <Style TargetType="{x:Type telerik:GridViewRow}">

                    <Setter Property="Background" Value="Red"/>

                    <Setter Property="Foreground" Value="White"/>

                    <Style.Triggers>

                        <Trigger Property="IsSelected" Value="True">

                            <Setter Property="Background" Value="DarkOrange"/>

                            <Setter Property="Foreground" Value="black"/>

                        </Trigger>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter Property="Background" Value="LightYellow"/>

                            <Setter Property="Foreground" Value="black"/>

                        </Trigger>

                    </Style.Triggers>

                </Style>

            </telerik:RadGridView.RowStyle>

            <telerik:RadGridView.Columns>

                <telerik:GridViewDataColumn Header="EmployeeID" DataMemberBinding="{Binding EmployeeID}"/>

            </telerik:RadGridView.Columns>

        </telerik:RadGridView>

    </Grid>

</Window>

Hope it helps:

[Rob Peters]

Hi Vanya,

Thanks for your help!

What this does, it quickly shows the color defined in the trigger, but there is still that yellow rectangle thats popping up on front.
Also when selecting, the color from the property is applied, but another rectangle is put on top (kind of yellow)

Do you know how to turn this off, or change that color?

Edit: When setting the Mouseover/Selection foreground to black, solved my reading problem, but one has to like the yellow...

With kind regards,
Rob

[Ваня]

HI,

Bellow you can see the style I have used for the gridview using your notes-It seems that there is a little difference  between your picture and mine in the colors .......may be you have commented the line for the foreground in the IsSelected property of the trigger It does not matter......

See the picture or if you have modified the style  just paste the code to see what is going on ....... 

Hope this helps.......

Note: the second row has a light yellow background because the mouse cursor is over it -the cursor is not visible

[Vlad]

Hi,

 Generally the best way to override the default grid styles for the row is copy the style in Blend and change (or even remove) desired states.

Best wishes,
Vlad
the Telerik team

[Rob Peters]

Hello Vlad,

I'm no Blend expert (not to mention that is sometimes give undisired effects when installed),
Is it possible to post an example how to set that 'yellow' rectangle to blue for example?

Maybe an idea to make this a property for the next release?
Or if possible a selection that is always readable when mouseover/selected....

With kind regards,
Rob

[Vlad]

Hello Rob,

 Exposing these colors as properties will limit the grid to just solid colors. You will not have cool gradients, borders, animations, etc. I've attached screenshot how you can do this easily in Blend.

Best wishes,
Vlad
the Telerik team

[Rob Peters]

Hello Vlad,

I'm sorry, i cannot get/create that template in blend 4.

----
Start Blend
New Project, WPF Application
Add reference for gridview
Place radgridview on window
Create sample data, set it as itemssource for the gridview
RadGridView->Edit Template -> Edit Copy
Now all items (rows) are inside PART_GridViewVirtualizingPanel?
----

I aggree that it's a very cool effect!, but that effect should also (have) set the foreground color, because now all items with a white foreground (or yellow for example), are unreadable, making the control not look right.

With the help of Venya (trigger) i now have set the foreground to black on the mouseover/isselected event, but if possible, i would appriciate if you could show me how to do this in blend or directly in xaml.

With kind regards,
Rob

[Ваня]

Hi,

Vlad is really right that MS Blend is a good alternative-the easiest way  you can do to edit the template of the GridViewRow is to simply drag from the Assets Library GridViewRow (RightClick) wherever onto the design surface->Edit template ->Edit a Copy Create a Style resource and check the radioButton "Apply to ALL" ......[ I am using MS BLEND 3] and from there you can modify whatever you want (finally simply delete this Row from the window and use the style created)-from the picture bellow you can see how you can do that I believe that now it will be absolutely clear - I modified the fontsize wheh the rows is selected to be 36pt and the foreground to be LightYellow-read carefully the code and I hope that it is clear.....

<Window x:Class="WPFAPP.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="476" Width="696" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">

<Window.Resources>

<Style TargetType="{x:Type telerik:GridViewRow}">

<Setter Property="IsTabStop" Value="False"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:GridViewRow}">

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{x:Null}">

<telerik:SelectiveScrollingGrid x:Name="grid" Background="{x:Null}">

<telerik:SelectiveScrollingGrid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="*"/>

</telerik:SelectiveScrollingGrid.ColumnDefinitions>

<telerik:SelectiveScrollingGrid.RowDefinitions>

<RowDefinition Height="*"/>

<RowDefinition Height="Auto"/>

<RowDefinition Height="Auto"/>

<RowDefinition Height="Auto"/>

</telerik:SelectiveScrollingGrid.RowDefinitions>

<Border x:Name="SelectionBackground" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Margin}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Column="2" Grid.ColumnSpan="2" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}"/>

<Border x:Name="Background_Over" Margin="1,1,1,2" Opacity="0" Grid.Column="2" Grid.ColumnSpan="2" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" BorderBrush="{x:Null}" BorderThickness="1" CornerRadius="1">

<Border BorderBrush="White" BorderThickness="1" Background="#FFCD750E"/>

</Border>

<Border x:Name="Background_Selected" Margin="1,1,1,2" Opacity="0" Grid.Column="2" Grid.ColumnSpan="2" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" BorderBrush="#FFFFC92B" BorderThickness="1" CornerRadius="1">

<Border BorderBrush="White" BorderThickness="1" Background="#FF061261"/>

</Border>

<Border x:Name="Background_Invalid" Margin="1,1,1,2" Opacity="0" Grid.Column="2" Grid.ColumnSpan="2" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" BorderBrush="#FFCE7D7D" BorderThickness="1" CornerRadius="1">

<Border BorderThickness="1">

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFCDCDC"/>

<GradientStop Color="#FFFCC1C1" Offset="1"/>

</LinearGradientBrush>

</Border.Background>

<Border.BorderBrush>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFEBF4FD"/>

<GradientStop Color="#FFDBEAFD" Offset="1"/>

</LinearGradientBrush>

</Border.BorderBrush>

</Border>

</Border>

<telerik:GridViewToggleButton Width="25" IsTabStop="{TemplateBinding IsTabStop}" IsHitTestVisible="{Binding IsExpandable, RelativeSource={RelativeSource TemplatedParent}}" Grid.Column="2" telerik:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">

<telerik:GridViewToggleButton.Opacity>

<Binding Path="IsExpandable" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToOpacityConverter/>

</Binding.Converter>

</Binding>

</telerik:GridViewToggleButton.Opacity>

<telerik:GridViewToggleButton.Visibility>

<Binding Path="HasHierarchy" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</telerik:GridViewToggleButton.Visibility>

</telerik:GridViewToggleButton>

<Border Grid.Column="2" telerik:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical">

<Border.Visibility>

<Binding Path="HasHierarchy" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Border.Visibility>

</Border>

<telerik:DataCellsPresenter x:Name="PART_DataCellsPresenter" IsTabStop="False" Grid.Column="3">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:DataCellsPresenter>

<Border x:Name="PART_RowBorder" VerticalAlignment="Bottom" Grid.Column="1" Grid.ColumnSpan="4" Grid.RowSpan="4" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" BorderBrush="{TemplateBinding HorizontalGridLinesBrush}">

<Border.BorderThickness>

<Binding Path="HorizontalGridLinesWidth" ConverterParameter="Bottom" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:GridLineWidthToThicknessConverter/>

</Binding.Converter>

</Binding>

</Border.BorderThickness>

</Border>

<Border Grid.Column="2" Grid.ColumnSpan="2" Grid.Row="2" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" Background="#FFBBBBBB" BorderBrush="#FF848484" BorderThickness="0,1" Padding="6">

<Border.Visibility>

<Binding Path="IsExpanded" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Border.Visibility>

<ContentPresenter x:Name="PART_HierarchyChildPresenter" telerik:SelectiveScrollingGrid.SelectiveScrollingClip="True" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" ContentTemplate="{TemplateBinding ContentTemplate}"/>

</Border>

<telerik:DetailsPresenter x:Name="PART_DetailsPresenter" IsTabStop="False" Visibility="Collapsed" Grid.Column="2" Grid.ColumnSpan="2" Grid.Row="1" DetailsProvider="{TemplateBinding DetailsProvider}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:DetailsPresenter>

<telerik:IndentPresenter x:Name="PART_IndentPresenter" IsTabStop="False" Grid.Column="1" Grid.RowSpan="4" IndentLevel="{TemplateBinding IndentLevel}" telerik:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:IndentPresenter>

<Border x:Name="PART_IndicatorPresenter" VerticalAlignment="Stretch" Width="25" Visibility="{TemplateBinding RowIndicatorVisibility}" Grid.Column="0" Grid.RowSpan="3" telerik:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" BorderBrush="#FF848484" BorderThickness="0,0,1,1">

<Border x:Name="NavigatorIndicatorBackground" Background="#FFE4E4E4" BorderBrush="White" BorderThickness="1">

<Grid>

<Grid x:Name="ErrorIndicator" HorizontalAlignment="Center" VerticalAlignment="Center" Width="16" Height="16" Visibility="Collapsed">

<Path Stretch="Fill" Margin="1" Data="M3,12.999999L4,12.999999 5,12.999999 6,12.999999 7,12.999999 8,12.999999 9,12.999999 10,12.999999 11,12.999999 11,13.999999 10,13.999999 9,13.999999 8,13.999999 7,13.999999 6,13.999999 5,13.999999 4,13.999999 3,13.999999z M11,11.999999L12,11.999999 12,12.999999 11,12.999999z M2.0000001,11.999999L3,11.999999 3,12.999999 2.0000001,12.999999z M12,10.999999L13,10.999999 13,11.999999 12,11.999999z M1,10.999999L2.0000001,10.999999 2.0000001,11.999999 1,11.999999z M13,2.9999992L14,2.9999992 14,3.9999992 14,4.9999992 14,5.9999992 14,6.9999992 14,7.9999992 14,8.9999992 14,9.9999992 14,10.999999 13,10.999999 13,9.9999992 13,8.9999992 13,7.9999992 13,6.9999992 13,5.9999992 13,4.9999992 13,3.9999992z M0,2.9999992L1,2.9999992 1,3.9999992 1,4.9999992 1,5.9999992 1,6.9999992 1,7.9999992 1,8.9999992 1,9.9999992 1,10.999999 0,10.999999 0,9.9999992 0,8.9999992 0,7.9999992 0,6.9999992 0,5.9999992 0,4.9999992 0,3.9999992z M12,1.9999999L13,1.9999999 13,2.9999992 12,2.9999992z M1,1.9999999L2.0000001,1.9999999 2.0000001,2.9999992 1,2.9999992z M11,0.99999994L12,0.99999994 12,1.9999999 11,1.9999999z M2.0000001,0.99999994L2.9999998,0.99999994 2.9999998,1.9999999 2.0000001,1.9999999z M2.9999998,0L3.9999998,0 5,0 6,0 7,0 8,0 9,0 10,0 11,0 11,0.99999994 10,0.99999994 9,0.99999994 8,0.99999994 7,0.99999994 6,0.99999994 5,0.99999994 3.9999998,0.99999994 2.9999998,0.99999994z">

<Path.Fill>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFC9999" Offset="0"/>

<GradientStop Color="#FFC26666" Offset="1"/>

</LinearGradientBrush>

</Path.Fill>

</Path>

<Path Fill="White" Stretch="Fill" Margin="7,3" Data="M1.4901161E-07,8L1.0000001,8 2.0000002,8 2.0000002,9 2.0000002,10 1.0000003,10 1.0000003,9 1.0000001,10 1.4901161E-07,10 1.4901161E-07,9z M1.4901161E-07,0L1.0000001,0 2.0000002,0 2.0000002,1 2.0000002,2 2.0000002,3 2.0000002,4.0000001 2.0000002,5 2.0000002,5.9999999 2.0000002,7 1.0000001,7 1.4901161E-07,7 1.4901161E-07,5.9999999 1.4901161E-07,5 1.4901161E-07,4.0000001 1.4901161E-07,3 1.4901161E-07,2 0,1z"/>

<Path Stretch="Fill" Data="M4,15L5,15 6,15 7,15 8,15 9,15 10,15 11,15 12,15 12,16 11,16 10,16 9,16 8,16 7,16 6,16 5,16 4,16z M12,14L13,14 13,15 12,15z M3,14L4,14 4,15 3,15z M13,13L14,13 14,14 13,14z M2,13L3,13 3,14 2,14z M14,12L15,12 15,13 14,13z M1,12L2,12 2,13 1,13z M7,11L7,12 7,13 8,13 9,13 9,12 9,11 8,11z M15,4L16,4 16,5 16,6 16,7 16,8 16,9 16,10 16,11 16,12 15,12 15,11 15,10 15,9 15,8 15,7 15,6 15,5z M0,4L1,4 1,5 1,6 1,7 1,8 1,9 1,10 1,11 1,12 0,12 0,11 0,10 0,9 0,8 0,7 0,6 0,5z M14,3L15,3 15,4 14,4z M7,3L7,4 7,5 7,6 7,7 7,8 7,9 7,10 8,10 9,10 9,9 9,8 9,7 9,6 9,5 9,4 9,3 8,3z M1,3L2,3 2,4 1,4z M13,2L14,2 14,3 13,3z M4,2L5,2 6,2 7,2 8,2 9,2 10,2 11,2 12,2 12,3 13,3 13,4 14,4 14,5 14,6 14,7 14,8 14,9 14,10 14,11 14,12 13,12 13,13 12,13 12,14 11,14 10,14 9,14 8,14 7,14 6,14 5,14 4,14 4,13 3,13 3,12 2,12 2,11 2,10 2,9 2,8 2,7 2,6 2,5 2,4 3,4 3,3 4,3z M2,2L3,2 3,3 2,3z M12,1L13,1 13,2 12,2z M3,1L4,1 4,2 3,2z M4,0L5,0 6,0 7,0 8,0 9,0 10,0 11,0 12,0 12,1 11,1 10,1 9,1 8,1 7,1 6,1 5,1 4,1z">

<Path.Fill>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="Red" Offset="0"/>

<GradientStop Color="#FF990000" Offset="1"/>

</LinearGradientBrush>

</Path.Fill>

</Path>

</Grid>

<Grid x:Name="NavigatorIndicator" HorizontalAlignment="Center" VerticalAlignment="Center" Width="9" Height="9" Visibility="Collapsed">

<Path Stroke="#E5343434" StrokeThickness="1" Data="M0.5,0.5L8.5,4.4375 0.5,8.5z">

<Path.Fill>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="White"/>

<GradientStop Color="#FF4D4D4D" Offset="1"/>

</LinearGradientBrush>

</Path.Fill>

</Path>

</Grid>

<Grid x:Name="EditIndicator" HorizontalAlignment="Center" VerticalAlignment="Center" Width="16" Height="10" Visibility="Collapsed">

<Path Fill="#7F848484" Stretch="Fill" Data="M14,9L15,9 15,10 14,10z M1,9L2,9 2,10 1,10z M15,8L16,8 16,9 15,9z M0,8L1,8 1,9 0,9z M15,1L16,1 16,2 15,2z M0,1L1,1 1,2 0,2z M14,0L15,0 15,1 14,1z M1,0L2,0 2,1 1,1z"/>

<Path Fill="#FFCBCBCB" Stretch="Fill" Margin="1" Data="M0.99999994,6.9999995L2,6.9999995 3,6.9999995 4,6.9999995 5,6.9999995 6,6.9999995 7,6.9999995 8,6.9999995 9,6.9999995 10,6.9999995 11,6.9999995 12,6.9999995 13,6.9999995 13,7.9999995 12,7.9999995 11,7.9999995 10,7.9999995 9,7.9999995 8,7.9999995 7,7.9999995 6,7.9999995 5,7.9999995 4,7.9999995 3,7.9999995 2,7.9999995 0.99999994,7.9999995z M13,0.99999994L14,0.99999994 14,1.9999999 14,2.9999995 14,3.9999995 14,4.9999995 14,5.9999995 14,6.9999995 13,6.9999995 13,5.9999995 13,4.9999995 13,3.9999995 13,2.9999995 13,1.9999999z M0,0.99999994L0.99999994,0.99999994 0.99999994,1.9999999 0.99999994,2.9999995 0.99999994,3.9999995 0.99999994,4.9999995 0.99999994,5.9999995 0.99999994,6.9999995 0,6.9999995 0,5.9999995 0,4.9999995 0,3.9999995 0,2.9999995 0,1.9999999z M11,0L12,0 13,0 13,0.99999994 12,0.99999994 11,0.99999994 10,0.99999994 9,0.99999994 8,0.99999994 7,0.99999994 6,0.99999994 5,0.99999994 4,0.99999994 3,0.99999994 2,0.99999994 0.99999994,0.99999994 0.99999994,2.3841858E-07 2,2.3841858E-07 3,2.3841858E-07 4,2.3841858E-07 5,2.3841858E-07 6,2.3841858E-07 7,2.3841858E-07 8,2.3841858E-07 9,2.3841858E-07 10,2.3841858E-07z"/>

<Path Fill="#FF848484" Stretch="Fill" Data="M2,9L3,9 4,9 5,9 6,9 7,9 8,9 9,9 10,9 11,9 12,9 13,9 14,9 14,10 13,10 12,10 11,10 10,10 9,10 8,10 7,10 6,10 5,10 4,10 3,10 2,10z M14,8L15,8 15,9 14,9z M1,8L2,8 2,9 1,9z M15,2L16,2 16,3 16,4 16,5 16,6 16,7 16,8 15,8 15,7 15,6 15,5 15,4 15,3z M3,2L4,2 5,2 6,2 6,3 5,3 5,4 5,5 5,6 5,7 6,7 6,8 5,8 4,8 3,8 3,7 4,7 4,6 4,5 4,4 4,3 3,3z M0,2L1,2 1,3 1,4 1,5 1,6 1,7 1,8 0,8 0,7 0,6 0,5 0,4 0,3z M14,1L15,1 15,2 14,2z M1,1L2,1 2,2 1,2z M2,0L3,0 4,0 5,0 6,0 7,0 8,0 9,0 10,0 11,0 12,0 13,0 14,0 14,1 13,1 12,1 11,1 10,1 9,1 8,1 7,1 6,1 5,1 4,1 3,1 2,1z"/>

<Path Fill="White" Stretch="Fill" Margin="2" Data="M4,0L5,0 6,0 7,0 8,0 9,0 10,0 11,0 12,0 12,1 12,2 12,3 12,4 12,5.0000001 12,6 11,6 10,6 9,6 8,6 7,6 6,6 5,6 4,6 4,5.0000001 3,5.0000001 3,4 3,3 3,2 3,1 4,1z M0,0L1,0 1,1 2,1 2,2 2,3 2,4 2,5.0000001 1,5.0000001 1,6 0,6 0,5.0000001 0,4 0,3 0,2 0,1z"/>

</Grid>

</Grid>

</Border>

</Border>

</telerik:SelectiveScrollingGrid>

</Border>

<ControlTemplate.Triggers>

<Trigger Property="IsSelected" Value="True">

<Setter Property="Opacity" TargetName="Background_Selected" Value="1"/>

<Setter Property="Foreground" Value="LightYellow"/>

<Setter Property="FontSize" Value="36"/>

</Trigger>

<Trigger Property="IsMouseOver" Value="True">

<Trigger.EnterActions>

<BeginStoryboard>

<Storyboard>

<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Background_Over" Storyboard.TargetProperty="Opacity">

<SplineDoubleKeyFrame KeyTime="00:00:00.2000000" Value="1"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</BeginStoryboard>

</Trigger.EnterActions>

<Trigger.ExitActions>

<BeginStoryboard>

<Storyboard>

<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Background_Over" Storyboard.TargetProperty="Opacity">

<SplineDoubleKeyFrame KeyTime="00:00:00.2000000" Value="0"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</BeginStoryboard>

</Trigger.ExitActions>

</Trigger>

<Trigger Property="IsContentValid" Value="False">

<Setter Property="Opacity" TargetName="Background_Invalid" Value="1"/>

<Setter Property="Visibility" TargetName="ErrorIndicator" Value="Visible"/>

<Setter Property="Visibility" TargetName="EditIndicator" Value="Collapsed"/>

<Setter Property="Visibility" TargetName="NavigatorIndicator" Value="Collapsed"/>

</Trigger>

<Trigger Property="IsCurrent" Value="True">

<Setter Property="Background" TargetName="NavigatorIndicatorBackground">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FF848484" Offset="0"/>

<GradientStop Color="#FFE4E4E4" Offset="1"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="Visibility" TargetName="NavigatorIndicator" Value="Visible"/>

</Trigger>

<Trigger Property="IsInEditMode" Value="True">

<Setter Property="Visibility" TargetName="EditIndicator" Value="Visible"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Background" Value="Red"/>

<Setter Property="Foreground" Value="White"/>

<Setter Property="BorderBrush" Value="#FFCBCBCB"/>

<Setter Property="BorderThickness" Value="0"/>

<Setter Property="FontWeight" Value="Normal"/>

<Setter Property="VerticalContentAlignment" Value="Stretch"/>

<Setter Property="HorizontalContentAlignment" Value="Stretch"/>

<Setter Property="Padding" Value="0"/>

<Setter Property="SnapsToDevicePixels" Value="True"/>

</Style>

</Window.Resources>

    <Grid>

        <telerik:RadGridView AutoGenerateColumns="True" ItemsSource="{Binding}" Height="290" HorizontalAlignment="Left" Margin="17,22,0,0" Name="radGridView1" VerticalAlignment="Top" Width="631" />

    </Grid>

</Window>

[Ваня]

here is the picture

[Salini]

Hi,

I am using RadGridView with IsMouseOver property. I want the row color as #CF7600 when mouse hovers on it. I have set the IsMouseOver property with background color. But when I put mouse on the row, for a fraction of second #CF7600 color shows up and turns back to light yellow (default color). Can you check this and tell me what the problem is.
<telerik:RadGridView.RowStyle>
    <Style TargetType="{x:Type telerik:GridViewRow}">
               <Style.Triggers>
     <Trigger Property="IsMouseOver" Value="true">
      <Setter Property="Background" Value="#CF7600"/>       
     </Trigger>
    </Style.Triggers>
   </Style>
  </telerik:RadGridView.RowStyle>

Regards,
Salini

[Vanya Pavlova]

Hello Salini,

If you want to achieve the desired result simply you have to edit the  GridViewRow's ControlTemplate and especially the brushes used in  Background Over and Background Selected,please see the following  link.
I have prepared an example for you that  uses your color in Background_Over  and pink In Background_Selected.
Please see the attached application and let me know if you need any further assistance. 

Kind regards,
Vanya Pavlova
the Telerik team

[Salini]

Thank you. It worked.

[Valdomiro]

Good Afternoon,

I'm having trouble for customize the colors of mouseover color and selected color in Expression Blend 4.

I'll like an intstruction for insert between the tags <telerik:RadgridView></telerik:RadgridView>.

Thank You,

Valdomiro.

[Vanya Pavlova]

Hello Valdomiro,



In order to change the colors when a GridViewRow is in MouseOver and Selected States, you need to change the brushes used in Background_Over and Background_Selected border elements within its template.
Please use the attached example that demonstrates this approach.


If you need any further assistance please let me know.


Greetings,
Vanya Pavlova
the Telerik team

[Seb]

I have selected a gridview row and it is colored with "Chartreuse". 

Why is only the border of this row in this color? Where can I change this property?

When I leave the focus of this grid by clicking on another button, the color changes in a kind of gray. Why does it change to this color? Where can I change this property?

I have attached two example pictures.

Kind regards

Sebastian

[Seb]

Ok I have found the answer in this URL:

 

http://www.telerik.com/support/code-library/remove-the-selectedunfocused-state-for-the-radgridview

 

[Stefan]

Hi Sebastian,

Actually, the Background is being set, however as the theme is applied over it you are observing this visual behavior. As explained and demonstrated in a sample project by my colleague Vanya, the proper way to achieve this customization is to modify the template of GridViewRow. Please refer to the attachment from the previous answer.

Best Regards,
Stefan X1
Telerik

[Pavel]

This is ridiculously difficult for just changing a selected row background. How about adding a simple SelectedRowBackground (of type Brush) to the control?