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

Custom ListView not updating

1 Answer 287 Views

ListView

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

Dave asked on 04 Apr 2021, 05:13 PM

I'm having an issue with updates not occurring in a while scrolling ListView with SimpleListViewVisualItem children down - scrolling up works fine. Figuring it has to do with virtualization/cell reuse and the VisualItemFormatting method is incomplete and needs to update the row.

Where am I going wrong?

Thanks,

using System;

using System.ComponentModel;

using System.Drawing;

using System.Windows.Forms;

using Telerik.WinControls.Layouts;

using Telerik.WinControls.UI;

namespace TelerikWinFormsApp4

{

public partial class RadForm1 : Telerik.WinControls.UI.RadForm

{

public RadForm1()

{

InitializeComponent();

this.radListView1.VisualItemCreating += new ListViewVisualItemCreatingEventHandler(this.radListView1_VisualItemCreating);

this.radListView1.VisualItemFormatting += new ListViewVisualItemEventHandler(radListView1_VisualItemFormatting);

// Populate BullJiveTestListItem with fluff

BindingList<BullJiveTestListItem> rows = new BindingList<BullJiveTestListItem>();

for (int alpha = 65; alpha < 85; alpha++) rows.Add(new BullJiveTestListItem(Convert.ToChar(alpha).ToString()));

this.Size = new Size(500, 300);

radListView1.DataSource = rows;

radListView1.ItemSize = new Size(0, 100);

radListView1.FullRowSelect = true;

}

private void radListView1_VisualItemCreating(object sender, ListViewVisualItemCreatingEventArgs e)

{

if (radListView1.ViewType == ListViewType.ListView)

{

e.VisualItem = new RowVisualItem();

}

private void radListView1_VisualItemFormatting(object sender, ListViewVisualItemEventArgs e)

{

if (radListView1.ViewType == ListViewType.ListView)

{

//BullJiveTestListItem v = (BullJiveTestListItem)e.VisualItem.Data.Value;

//????

}

public class RowVisualItem : SimpleListViewVisualItem

{

private LightVisualElement hBox0, hBox1;

private StackLayoutPanel horizontalLayout;

private Point newSize = new Point(0, 100);

protected override void CreateChildElements()

{

base.CreateChildElements();

horizontalLayout = new StackLayoutPanel();

horizontalLayout.Orientation = Orientation.Horizontal;

hBox0 = new LightVisualElement();

hBox0.MinSize = new Size(newSize);

horizontalLayout.Children.Add(hBox0);

hBox1 = new LightVisualElement();

hBox1.MinSize = new Size(newSize);

horizontalLayout.Children.Add(hBox1);

Children.Add(horizontalLayout);

}

protected override void SynchronizeProperties()

{

base.SynchronizeProperties();

if (this.FindAncestor<RadListViewElement>() == null) return;

this.Text = "<html>Text";

hBox0.Size = new Size(newSize);

hBox0.Text = "<html>(hBox0)Value0: " + this.Data["Value0"] + "" +

" (hBox0)Value1: " + this.Data["Value1"] + "";

hBox1.Size = new Size(newSize);

hBox1.Text = "<html>(hBox1)Value2: " + this.Data["Value2"] + "" +

" (hBox1)Value3: " + this.Data["Value3"] + "";

TextAlignment = ContentAlignment.TopLeft;

}

protected override Type ThemeEffectiveType

{

get

{

return typeof(SimpleListViewVisualItem);

}

public class BullJiveTestListItem

{

public BullJiveTestListItem(string s)

{

Value0 = s + "0";

Value1 = s + "1";

Value2 = s + "2";

Value3 = s + "3";

}

public string Value0 { get; set; }

public string Value1 { get; set; }

public string Value2 { get; set; }

public string Value3 { get; set; }

}

1 Answer, 1 is accepted

Accepted

answered on 05 Apr 2021, 01:00 PM

custom-listview-items.gif

Hello, David,

Thank you for the provided code snippet of your custom implementation of SimpleListViewVisualItem.

After debugging it, I noticed that you have set the MinSize property of the LightVisualElements to Point(0,100). This will restrict the LightVisualElements in height and width which is fine. However, in the SynchronizeProperties method, you set the LightVisualElement.Size property to the same size. In this case, when you scroll down the SynchronizeProperties() gets called and the width of your elements becomes 0. This is why you can not see them. The SynchronizeProperties method should be used to extract the data from the data object.

Please refer to the updated code snippet:

protected override void SynchronizeProperties()
{
    base.SynchronizeProperties();

    this.Text = "<html><span style=\"color:black;font-size:14.5pt;\">Text</span>";

   // hBox0.Size = new Size(newSize);
    hBox0.Text = "<html><span style=\"color:green;\">(hBox0)Value0: </span><span style=\"color:DarkMagenta;\">" + this.Data["Value0"] + "</span>" +
                 "<br><span style=\"color:red;\">(hBox0)Value1: </span><span style=\"color:blue;\">" + this.Data["Value1"] + "</span>";
    

    //hBox1.Size = new Size(newSize);
    hBox1.Text = "<html><span style=\"color:darkblue;\">(hBox1)Value2: </span><span style=\"color:purple;\">" + this.Data["Value2"] + "</span>" +
                 "<br><span style=\"color:orange;\">(hBox1)Value3: </span><span style=\"color:gray;\">" + this.Data["Value3"] + "</span>";

    TextAlignment = ContentAlignment.TopLeft;
}

I hope this helps. Let me know if you have any other questions.

Regards,
Nadya
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.