RadGridView background color

[Stefano]

Hi people,

I have problem with RadGridView and background color: I can't set it ! I have a MVVM application and the grid is bind with observable collection; all my data are displayed correctly:

<telerik:RadGridView x:Name="dataGrid" ItemsSource="{Binding Model, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" AutoGenerateColumns="False" FrozenColumnCount="1" CanUserDeleteRows="False" CanUserInsertRows="False" GroupRenderMode="Flat" ShowGroupPanel="False" ClipboardPasteMode="Default" SelectionMode="Extended" SelectionUnit="Cell" >

<telerik:GridViewDataColumn Header="Data" DataMemberBinding="{Binding Date}" DataFormatString="{} {0:dd/MM/yyyy}" IsReorderable="False" IsSortable="False" IsFilterable="False" IsReadOnly="True" Width="80" />

<telerik:GridViewDataColumn Header="Flow" DataMemberBinding="{Binding Flow}" IsSortable="False" IsFilterable="False" IsReadOnly="True" Width="110" />

Now I want to color the row and bind it to property named UserInput (boolean) using converter like this:

internal class UserInputConveter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            var userInput = (bool)value;

            if (userInput)
                return new SolidColorBrush(Colors.GreenYellow);

            return new SolidColorBrush(Colors.Transparent);
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

But it doesn't work. I tried:

1)

<telerik:RadGridView.RowStyle>
    <Style TargetType="telerik:GridViewRow">
        <Setter Property="Background" Value="{Binding UserInput,Converter={StaticResource UserInputConveter}}"></Setter>
    </Style>
</telerik:RadGridView.RowStyle>

Result: all my rows disappear!

2)

<telerik:GridViewDataColumn.CellStyle>
    <Style TargetType="telerik:GridViewCell">
        <Setter Property="Background" Value="{Binding Path=UserInput, Converter={StaticResource UserInputConveter}}"></Setter>
    </Style>
</telerik:GridViewDataColumn.CellStyle>

Result: my single cell disappear.

3)

<telerik:GridViewDataColumn Header="Flow" DataMemberBinding="{Binding Flow}" IsSortable="False" IsFilterable="False" IsReadOnly="True" Width="110" Background="{Binding Path=UserInput, Converter={StaticResource userInputConverter}}" />

OR

<telerik:GridViewColumn.Background>
    <SolidColorBrush Color="{Binding Path=UserInput, Converter={StaticResource userInputConverter}}" />
</telerik:GridViewColumn.Background>

Result: the color of cell is thedefault, no change.

Where is my error? How I can do it?

Thanks a lot.

[Stefan]

Hello Stefano,

The built-in mechanism for achieving such customization is through the RowStyleSelector functionality. Can you please check it out and let me know whether it corresponds to your needs?

Additionally, you can take a look at the StyleSelectors section of RadGridView's online demos. The same examples can be found in the local copy of the WPF Demos.

Best Regards,
Stefan X1
Telerik by Progress

[Stefano]

Hi Stefan X1, thanks for answer.
I've tried with RowStyleSelector but it doesn't work.
I have:

1. Create this class 

2. public class UserInputStyleSelector : StyleSelector
       {
           public override Style SelectStyle(object item, DependencyObject container)
           {
               if (item is MyModel)
               {
                   var model = item as MyModel;
                   return model.UserInput
                       ? UserInputStule
                       : CalculatorStyle;
               }
               return null;
           }
           public Style UserInputStule { get; set; }
           public Style CalculatorStyle { get; set; }
       }

2. Added it to resources (my window is rad document pane) 

1. <telerik:RadDocumentPane.Resources>
           ...
           <local:UserInputStyleSelector x:Key="userInputStyleSelector">
               <local:UserInputStyleSelector.UserInputStule>
                   <Style TargetType="telerik:GridViewRow">
                       <Setter Property="Background" Value="Red" />
                   </Style>
               </local:UserInputStyleSelector.UserInputStule>
               <local:UserInputStyleSelector.CalculatorStyle>
                   <Style TargetType="telerik:GridViewRow">
                       <Setter Property="Background" Value="Green" />
                   </Style>
               </local:UserInputStyleSelector.CalculatorStyle>
           </local:UserInputStyleSelector>
       </telerik:RadDocumentPane.Resources>

3. Add style to radgridview 

<telerik:RadGridView x:Name="dataGrid" ItemsSource="{Binding Model, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" AutoGenerateColumns="False" FrozenColumnCount="1" CanUserDeleteRows="False" CanUserInsertRows="False" GroupRenderMode="Flat" ShowGroupPanel="False" ClipboardPasteMode="Default" SelectionMode="Extended" SelectionUnit="Cell" RowStyleSelector="{StaticResource userInputStyleSelector}" >
        <telerik:RadGridView.Columns>
            <telerik:GridViewDataColumn Header="Date" DataMemberBinding="{Binding Date}" DataFormatString="{} {0:dd/MM/yyyy}" IsReorderable="False" IsSortable="False" IsFilterable="False" IsReadOnly="True" Width="80" />
            <telerik:GridViewDataColumn Header="Flow" DataMemberBinding="{Binding Flow}" IsSortable="False" IsFilterable="False" IsReadOnly="True" Width="110" />
        </telerik:RadGridView.Columns>
</telerik:RadGridView>

Result: my grid doesn't show any row, but data is presents.

Where is my error?

Thanks a lot!

 

 

[Stefano]

Hi Stefan X1,

finally I've resolved problem; I've view the sample "Row Style Selectors" on WPF Demos, and I solved my problem.

Thanks for your advice.

Bye bye

[Stefan]

Hi Stefano,

I am glad that the example helped you find a working solution.

Feel free to contact us in case you need any other assistance with our components.

Best Regards,
Stefan X1
Telerik by Progress