Skip to content

Collection view scroll issues with container - grid, border etc #35827

Description

@smstosandeep

Describe the bug
CollectionView scrolling stutters on Android when any layout container (Grid, VerticalStackLayout, Border, ContentView) is used as the DataTemplate root. A bare Label as the DataTemplate root scrolls perfectly smoothly with the same data and item count.

This has been reproduced in a brand new empty MAUI app with no custom code, no ViewModel, no EF, no custom controls — just a CollectionView with 400 strings.


Minimal Reproduction

✅ SMOOTH:

<CollectionView>
    <CollectionView.ItemsSource>
        <x:Array Type="{x:Type x:String}">
            <!-- 400 strings -->
        </x:Array>
    </CollectionView.ItemsSource>
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Label Text="{Binding .}" />
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

❌ STUTTERS:

<CollectionView>
    <CollectionView.ItemsSource>
        <x:Array Type="{x:Type x:String}">
            <!-- 400 strings -->
        </x:Array>
    </CollectionView.ItemsSource>
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Label Text="{Binding .}" />
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

All of the following container types were tested as the DataTemplate root — all stutter:

  • Grid
  • VerticalStackLayout
  • Border
  • ContentView

Steps to Reproduce

  1. Create a new blank MAUI app targeting net10.0-android
  2. Add a CollectionView to the main page with 400 string items
  3. Set DataTemplate root to <Grid><Label .../></Grid>
  4. Run on Android device or emulator and scroll

Expected behavior
Scrolling should be smooth regardless of whether the DataTemplate root is a leaf element or a layout container, as long as the layout is simple.

Actual behavior
Scrolling stutters noticeably when any container wraps the root element. The stutter scales with complexity — 10 Labels inside a Grid is significantly worse than 1.


Versions

  • Microsoft.Maui.Controls: 10.0.70
  • Workload version: 10.0.300-manifests.e0989437
  • Android workload: 36.1.43/10.0.100
  • .NET SDK: 10.0
  • Visual Studio: 18.7.11811.120

Devices affected

  • Android Emulator ✅ reproduces
  • Samsung S24 (real hardware) ✅ reproduces

The issue is 100% reproducible in a clean new app with zero dependencies.

My actual app is using Sqlite,EF core, Generics etc.
My actual code looks like this: (Just for reference)

<KContentPage
    x:Class="Keeper.UI.Views.EncountersView"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="Encounters"
    x:TypeArguments="EncountersViewModel"
    EditTarget="{x:Type EncounterView}"
    PageType="List">
    <KContentPage.Resources>
        <NullOrEmptyConverter x:Key="NullOrEmptyConverter" />
    </KContentPage.Resources>
    <Grid Padding="0" RowDefinitions="auto,*">
        <KSearchBar Placeholder="Search doctor" Text="{Binding Request.SearchText}" />
        <KCollectionView Grid.Row="1" ItemsSource="{Binding Items}">
            <KCollectionView.ItemTemplate>
                <DataTemplate>
                    <KBorder>
                        <Grid ColumnDefinitions="60, *, 150" Style="{StaticResource ListItemStyle}">
                            <KRoundWidget
                                Grid.Column="0"
                                IconGlyph="{Binding EncounterDate, StringFormat='{0:dd MMM}'}"
                                ShowText="True"
                                SubTitle="{Binding EncounterDate, StringFormat='{0:MMM}'}"
                                TextLimit="2"
                                VerticalOptions="Center" />

                            <VerticalStackLayout Grid.Column="1" VerticalOptions="Center">
                                <KLabel LabelText="{Binding DoctorName}" Type="Title" />
                                <KLabel IconGlyph="{x:Static KMaterialIcons.CalendarToday}" LabelText="{Binding EncounterDate, StringFormat='{0:dd MMM yyyy}'}" />
                                <KLabel IconGlyph="{x:Static KMaterialIcons.MedicalServices}" LabelText="{Binding ReasonForVisit}" />
                            </VerticalStackLayout>

                            <VerticalStackLayout
                                Grid.Column="2"
                                HorizontalOptions="End"
                                VerticalOptions="Center">
                                <KLabel
                                    IconColor="DarkGreen"
                                    IconGlyph="{x:Static KMaterialIcons.BloodPressure}"
                                    LabelText="{Binding BP, Converter={StaticResource NullOrEmptyConverter}, ConverterParameter='Not recorded'}" />
                                <KLabel
                                    IconColor="Orange"
                                    IconGlyph="{x:Static KMaterialIcons.OxygenSaturation}"
                                    LabelText="{Binding SpO2, Converter={StaticResource NullOrEmptyConverter}, ConverterParameter='Not recorded'}" />
                                <KLabel
                                    IconColor="Purple"
                                    IconGlyph="{x:Static KMaterialIcons.Thermometer}"
                                    LabelText="{Binding Temp, Converter={StaticResource NullOrEmptyConverter}, ConverterParameter='Not recorded'}" />
                            </VerticalStackLayout>
                        </Grid>
                    </KBorder>
                </DataTemplate>
            </KCollectionView.ItemTemplate>
        </KCollectionView>
    </Grid>
</KContentPage>```

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions