Coloring Cells when there is a difference between cells

4 posts, 0 answers
  1. Scott Manning
    Scott Manning avatar
    20 posts
    Member since:
    Oct 2012

    Posted 27 Nov 2014 Link to this post

    In the project that I am working on, I need to highlight differences, so in col1 I am displaying the source data and in col2 I am showing the target data.  When the cell value in cell1 is not equal to cell2, then I need to color cell 2 to show that there is a difference.  In my small sample app, I am using CellLoaded event and the code below.  This kind of works but from time to time the wrong cells are highlighted.  Also the approach to handle this use case seems kind of brute force and I was wondering if there is a better way to handle this.

    Below is a sample piece of code that I have been using in the test

    private void RowDataGrid_CellLoaded(object sender, CellEventArgs e)
    {
        GridViewCell tgtFld = e.Cell as GridViewCell;

        if (tgtFld != null)
        {
            if (e.Cell.Column.UniqueName.ToUpper().EndsWith("_T"))
            {
                 string fieldName = e.Cell.Column.UniqueName.ToUpper().Replace("_T", "_S");
                 foreach (var item in e.Cell.ParentRow.Cells)
                 {
                 if (item.Column.UniqueName.ToUpper() == fieldName)
                    {
                    if (((GridViewCell)item).Value != tgtFld.Value)
                       {
                           tgtFld.Background = new SolidColorBrush(Colors.Green);
                       }
                       break;
                    }
            }
         }
       }
    }
  2. Boris
    Admin
    Boris avatar
    276 posts

    Posted 28 Nov 2014 Link to this post

    Hello Scott,

    A possible way to go is to use a CellStyleSelector. For a more practical example you can check the CellStyleSelector sdk example. Although GitHub is a very well-known platform we saw a better and easier approach for reviewing our examples by developing our SDK Samples Browser.

    I hope this helps.

    Regards,
    Boris
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. Scott Manning
    Scott Manning avatar
    20 posts
    Member since:
    Oct 2012

    Posted 28 Nov 2014 in reply to Boris Link to this post

    From looking at all of the code sample, it appears that this will work for a business object.  In my project, I have a delimited file that is read in and the number and type of columns will always be different, so I cannot do a business object.  I am reading the delimited data into a datatable and then binding the data table to the WPF grid.  When I display the data, I need to color the different cells.  Will the CellStyleSelector still work in this use case?
  4. Boris
    Admin
    Boris avatar
    276 posts

    Posted 02 Dec 2014 Link to this post

    Hello Scott,

    A possible way to go about this is to apply the CellStyleSelector to the columns in code behind by using the AutoGeneratingColumn event. It occurs each time new column is auto generated by the GridView control and thepassed event arguments are of type GridViewAutoGeneratingColumnEventArgs.
    Lets say you have the ItemsSource property of RadGridView bound to a DataTable and have defined the style selector as a resource in the GridView Resource collection like so:

    <telerik:RadGridView Name="clubsGrid"
                         ItemsSource="{Binding MyDataTable.DefaultView}"                            
                         Margin="5">           
        <telerik:RadGridView.Resources>
            <my:DataTableStyleSelector x:Key="DataTableStyle">
                ...
            </my:DataTableStyleSelector>               
        </telerik:RadGridView.Resources>
    </telerik:RadGridView>

    Then you can apply the StyleSelector to every column or to just some of them, based on some condition as follows:

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
     
            this.clubsGrid.AutoGeneratingColumn += clubsGrid_AutoGeneratingColumn;
        }
     
        void clubsGrid_AutoGeneratingColumn(object sender, GridViewAutoGeneratingColumnEventArgs e)
        {
            e.Column.CellStyleSelector = clubsGrid.Resources["DataTableStyle"] as StyleSelector;       
        }
    }

    Please keep in mind that you will need to handle the condition in your custom StyleSelector class:

    public class DataTableStyleSelector : StyleSelector
        {
            public override Style SelectStyle(object item, DependencyObject container)
            {
                // Your condition
                if (item is DataRowView)
                {
                    return BigStadiumStyle;
                }
                 
                return null;
            }
     
            public Style BigStadiumStyle { get; set; }
            public Style SmallStadiumStyle { get; set; }
        }

    I hope this helps.

    Regards,
    Boris
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top