Gridview Cell back color

4 posts, 1 answers
  1. Mohammad Anas
    Mohammad Anas avatar
    5 posts
    Member since:
    Apr 2018

    Posted 04 Apr 2018 Link to this post

    i have several issues kindly respond

    1) I want to highlight (specific) cell back color for 2-sec on value changed. 

    2) somehow i highlighted back color(which is not correct way) but issue is when i scroll horizontally and vertically or resize splitter, cell color move to different cell as well.

    kindly respond me how to fix this issue.

     

  2. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    4086 posts

    Posted 04 Apr 2018 Link to this post

    Hello, Mohammad Anas,   

    The appropriate way to customize grid cells is to use the CellFormatting event. It gives you the opportunity to apply the desired style for the grid cells. Additional information is available in the following help article: https://docs.telerik.com/devtools/winforms/gridview/cells/formatting-cells

    An alternative approach is to use the Style property of the cell. An example is available here: https://docs.telerik.com/devtools/winforms/gridview/cells/formating-examples/style-property

    I would like to pay attention to the fact that RadGridView uses virtualization. Hence, cell elements are created only for the currently visible cells and are being reused during operation like scrolling, filtering, grouping etc. It is important to reset the applied style for the rest of the cells when you customize the appearance for specific cells only.

    I hope this information helps. If you have any additional questions, please let me know. 

    Regards,
    Dess
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Mohammad Anas
    Mohammad Anas avatar
    5 posts
    Member since:
    Apr 2018

    Posted 05 Apr 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    i am using timer for highlight cell on change value. its working properly but when i scroll / split resize /click on cell all cell highlighted together then timer control not working properly.

    1) kindly guide me if any better way to highlight specific cell except than timer.

    2) all cell shouldn't be highlighted when click / scroll or split resize.

    p.s i have mentioned below my code kindly review.

    Thanks in Advance.

     

     

            void radGridView1_CellFormatting(object sender, Telerik.WinControls.UI.CellFormattingEventArgs e)
            {
                if (e.CellElement.ColumnInfo.HeaderText == "Bid Volume")
                {
                    if (e.CellElement.RowInfo.Cells["col_bvol"].Value != null && e.Row.Tag != null && e.Row.Tag.ToString().Contains(e.Column.Name))
                    {
                        SetColor(e.CellElement, Color.FromArgb(153, 204, 255), Color.Aqua);
                    }
                    else
                    {
                        e.CellElement.BackColor = System.Drawing.Color.FromArgb(153, 204, 255);
                        e.CellElement.NumberOfColors = 1;
                        e.CellElement.DrawFill = true;
                        e.CellElement.GradientStyle = Telerik.WinControls.GradientStyles.Linear;
                    }
                }
                else if (e.CellElement.ColumnInfo.HeaderText == "Bid Price")
                {
                    if (e.CellElement.RowInfo.Cells["col_bprice"].Value != null && e.Row.Tag != null && e.Row.Tag.ToString().Contains(e.Column.Name))
                    {
                        SetColor(e.CellElement, Color.FromArgb(153, 204, 255), Color.Aqua);
                    }
                    else
                    {
                        e.CellElement.BackColor = System.Drawing.Color.FromArgb(153, 204, 255);
                        e.CellElement.NumberOfColors = 1;
                        e.CellElement.DrawFill = true;
                        e.CellElement.GradientStyle = Telerik.WinControls.GradientStyles.Linear;
                    }
                }

            else
                {
                    e.CellElement.ResetValue(LightVisualElement.DrawFillProperty, ValueResetFlags.Local);
                    e.CellElement.ResetValue(LightVisualElement.ForeColorProperty, ValueResetFlags.Local);
                    e.CellElement.ResetValue(LightVisualElement.NumberOfColorsProperty, ValueResetFlags.Local);
                    e.CellElement.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local);
                }
            }

            public async void SetColor(GridCellElement cell, Color defaultColor, Color changeColor)
            {
                try
                {
                    cell.DrawFill = true;
                    cell.BackColor = changeColor;
                    await Task.Delay(2000);
                    cell.BackColor = defaultColor;
                }

                catch (Exception ex)
                {

                }
            }

     

     

  4. Answer
    Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    4086 posts

    Posted 06 Apr 2018 Link to this post

    Hello, Mohammad Anas,   
     
    It is appropriate to use either the CellFormatting event or the Style property of the cell. These are two different approaches for customizing grid cells and it is not recommended to be mixed because you can obtain undesired style if they are not properly managed. 
     
    Due to the UI virtualization in RadGridView, cell elements are created only for currently visible cells and are being reused during operations like scrolling, filtering, grouping and so on. In order to prevent applying the formatting to other columns' cell elements (because of the cell reuse), all customization should be reset for the rest of the cell elements. In other words, each 'if' statement that manipulates the cell's style must have an 'else' clause to reset the applied style. 

    I have prepared a sample code snipept which result is illustarted in the attached gif file. After a certain cell is edited its color is changed for 2 seconds only. It is easily achieved by the second approach that was suggested in my initial reply:
    Timer timer = new Timer();
    public Form1()
    {
        InitializeComponent();
        this.radGridView1.CellValueChanged += radGridView1_CellValueChanged;
    }
     
    GridViewCellInfo lastEditedCell = null;
     
    private void radGridView1_CellValueChanged(object sender, Telerik.WinControls.UI.GridViewCellEventArgs e)
    {
        lastEditedCell = e.Row.Cells[e.Column.Name];
        lastEditedCell.Style.DrawFill = true;
        lastEditedCell.Style.BackColor = Color.Yellow;
        lastEditedCell.Style.CustomizeFill = true;
       
        timer = new Timer();
        timer.Interval = 2000;
        timer.Tick+=timer_Tick;
        timer.Start();
    }
     
    private void timer_Tick(object sender, EventArgs e)
    {
        timer.Stop();
        timer.Tick-=timer_Tick;
        lastEditedCell.Style.CustomizeFill = false;
     
    }

    I hope this information helps. If you have any additional questions, please let me know. 

    Regards,
    Dess
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top