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

Gridview Cell back color

3 Answers 290 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Mohammad Anas
Top achievements
Rank 1
Mohammad Anas asked on 04 Apr 2018, 08:12 AM

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.

 

3 Answers, 1 is accepted

Sort by
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 04 Apr 2018, 01:30 PM
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.
0
Mohammad Anas
Top achievements
Rank 1
answered on 05 Apr 2018, 04:02 PM

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)
            {

            }
        }

 

 

0
Accepted
Dess | Tech Support Engineer, Principal
Telerik team
answered on 06 Apr 2018, 12:06 PM
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.
Tags
GridView
Asked by
Mohammad Anas
Top achievements
Rank 1
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Mohammad Anas
Top achievements
Rank 1
Share this question
or