Hi
I have a simple Xamarin forms page that uses this XAML:
<ContentPage.BindingContext>
<vm:MainPageViewModel />
</ContentPage.BindingContext>
<CollectionView ItemsSource="{Binding Items}" RemainingItemsThreshold="1">
<CollectionView.ItemTemplate>
<DataTemplate x:DataType="vm:Item">
<ContentView>
<Frame Margin="20" Padding="20" BorderColor="Gray">
<StackLayout Spacing="5">
<Label Text="{Binding Header}" FontAttributes="Bold" />
<StackLayout BindableLayout.ItemsSource="{Binding SubItems}">
<BindableLayout.ItemTemplate>
<DataTemplate x:DataType="vm:SubItem">
<StackLayout Orientation="Horizontal">
<Label WidthRequest="70" Text="{Binding Column0}" />
<Label WidthRequest="70" Text="{Binding Column1}" />
<Label WidthRequest="70" Text="{Binding Column2}" />
<Label Text="{Binding Column3}" />
</StackLayout>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
<Label Text="{Binding Footer}" FontAttributes="Bold" />
</StackLayout>
</Frame>
</ContentView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
to produce something like this:

However, when trying to scroll the collection view, it pauses and looks very jittery, even with a low number of items. The problem is less prominent in high end phones, but in mid-range phones is terrible.
The data that binds to the collection view is generated by this code:
class MainPageViewModel : INotifyPropertyChanged
{
public MainPageViewModel()
{
Items = new List<Item>();
for (int i = 0; i < 30; i++)
Items.Add(new Item());
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(Items)));
}
public event PropertyChangedEventHandler PropertyChanged;
public IList<Item> Items { get; set; }
}
class Item
{
public Item()
{
for (int i = 0; i < Util.RandomGenerator.Next(0, 5); i++)
SubItems.Add(new SubItem());
}
public string Footer { get; set; } = Util.GetRandomString();
public string Header { get; set; } = Util.GetRandomString();
public IList<SubItem> SubItems { get; set; } = new List<SubItem>();
}
class SubItem
{
public string Column0 { get; set; } = Util.GetRandomString();
public string Column1 { get; set; } = Util.GetRandomString();
public string Column2 { get; set; } = Util.GetRandomString();
public string Column3 { get; set; } = Util.GetRandomString();
}
static class Util
{
public static readonly Random RandomGenerator = new Random();
public static string GetRandomString() => RandomGenerator.Next(10000, 100000).ToString();
}
I think there must be a way to reduce the jitter without removing the data bindings, but don't know what to do. Can you help?
Thanks!