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

CellStyleSelector style randomly changes when scrolling horizontally

3 Answers 81 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Roger
Top achievements
Rank 1
Roger asked on 11 Dec 2019, 07:37 PM

We are having an issue with the CellStyleSelector randomly changing the style when scrolling left and right in the GridView.

We have it narrowed down to our comparison in the StyleSelector code. We need to compare the cell value to the Min and Max columns to see if it is within the range. If it is, set the style to Valid, if not set it to Invalid.

This works on loading of the grid, but the scrolling causes it to glitch.

Code where the value of comparison (cell) changes and causes glitch:

public class ValidationStyle : StyleSelector
{
    public override Style SelectStyle(object item, DependencyObject container)
    {
        if (item is ExpandoObject)
        {
            var inspection = (IDictionary<string, object>)item;
 
            var cell = container.GetValue(GridViewCell.ValueProperty);
 
            if (!(cell == null || cell.ToString() == ""))
            {
                double.TryParse(cell.ToString(), out double cellValue);
 
                inspection.TryGetValue("Max", out object maxValue);
                inspection.TryGetValue("Min", out object minValue);
 
                if ((double)minValue <= cellValue && cellValue <= (double)maxValue)
                {
                    return Valid;
                }
                else
                {
                    return Invalid;
                }
            }
        }
        return null;
    }
    public Style Valid { get; set; }
    public Style Invalid { get; set; }
}

 

Code example using a fixed value of comparison (cell) and does not glitch:

public class ValidationStyle : StyleSelector
{
    public override Style SelectStyle(object item, DependencyObject container)
    {
        if (item is ExpandoObject)
        {
            var inspection = (IDictionary<string, object>)item;
 
            int? cell = 1;
 
            if (!(cell == null || cell.ToString() == ""))
            {
                double.TryParse(cell.ToString(), out double cellValue);
 
                inspection.TryGetValue("Max", out object maxValue);
                inspection.TryGetValue("Min", out object minValue);
 
                if ((double)minValue <= cellValue && cellValue <= (double)maxValue)
                {
                    return Valid;
                }
                else
                {
                    return Invalid;
                }
            }
        }
        return null;
    }
    public Style Valid { get; set; }
    public Style Invalid { get; set; }
}

 

We have poured over these forums and every example for StyleSelector uses a fixed value for comparison. 

We have applied this concept to the NegativeStyleSelector.zip in this forum and it also glitches: https://www.telerik.com/forums/apply-cellstyleselector-in-code-behind

Any help would be appreciated!

Thanks!

3 Answers, 1 is accepted

Sort by
0
Dilyan Traykov
Telerik team
answered on 13 Dec 2019, 12:03 PM

Hello,

Thank you very much for the provided images and code snippets.

As stated by my colleague in the forum thread you referenced, generally, we do not recommend working directly with the visual elements (such as GridViewCell) as this might result in inconsistent behavior due to the UI Virtualization mechanism of the RadGridView control.

With this said, instead of acquiring the Value property of the cell, I can recommend using the DataMemberBinding property of the parent column to get the actual value of the desired property of the item.

            var cell = container as GridViewCell;
            var propertyName = cell.DataColumn.DataMemberBinding.Path.Path;
            var value = item.GetType().GetProperty(propertyName).GetValue(item);
Could you please give this a try and let me know if it works for you? If that is not the case, please send over a small sample project which exhibits the issue so that I can further investigate possible solutions.

Regards,
Dilyan Traykov
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Roger
Top achievements
Rank 1
answered on 13 Dec 2019, 03:54 PM

Hey, Dilyan

We got it to work with a minor tweak. Your code worked when we used it on the NegativeStyleSelector.zip example since it is using the Club class for the data binding in the grid.

Since we are using an ExpandoObject for our data binding, I had to get the value of the cell a little differently.

    public class ValidationStyle : StyleSelector
    {
        public override Style SelectStyle(object item, DependencyObject container)
        {
            if (item is ExpandoObject)
            {
                var inspection = (IDictionary<string, object>)item;
 
                var cell = container as GridViewCell;
                var propertyName = cell.DataColumn.DataMemberBinding.Path.Path;
 
                inspection.TryGetValue(propertyName, out object value);
 
                if (!(value == null || value.ToString() == ""))
                {
                    double.TryParse(value.ToString(), out double cellValue);
 
                    inspection.TryGetValue("Max", out object maxValue);
                    inspection.TryGetValue("Min", out object minValue);
 
                    if ((double)minValue <= cellValue && cellValue <= (double)maxValue)
                    {
                        return Valid;
                    }
                    else
                    {
                        return Invalid;
                    }
                }
            }
            return null;
        }
 
        public Style Valid { get; set; }
        public Style Invalid { get; set; }
    }
 
}

 

We had much confusion reading the other post that say not to use the visual elements. All of the them mentioned not working directly with the GridViewCell, but in your reply you are using it. The example code was very helpful in showing how you can use GridViewCell, but only look at the data part of it, not the visual parts.

Thanks for the help!

0
Accepted
Dilyan Traykov
Telerik team
answered on 16 Dec 2019, 11:46 AM

Hi Roger,

I'm happy to hear that you've managed to achieve the desired result and that you found my example helpful.

Please let me know if I can further assist you with anything else.

Regards,
Dilyan Traykov
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
GridView
Asked by
Roger
Top achievements
Rank 1
Answers by
Dilyan Traykov
Telerik team
Roger
Top achievements
Rank 1
Share this question
or