Empty listview items after down and up scrolling

Question

Hi,

iOS app, MVVM pardigm, I populate an ObservableCollection of a custom type and through BindingContext populate a ListView on the Page.

that works fine. I can see the ListView items properly and can scroll it.

What I constantly see is when I scroll down and then back up I start seeing empty ListView items. The empty items increase i number the more I scroll up and down.

What I just saw now, while taking pictures of the screen to post here:

When I enter the page with the ListView I see all the items: Full listview.jpeg. Then the iPhone screen switches off after a few seconds and when I turn it on back again, I can see all the items are empty (all but one): Empty listview.jpeg

Anyone else experienced this kind of behaviour and was able to solve it or any idea what I can try doing to fix it?

I happens in all my pages with a ListView.

This is my XAML

<Grid RowDefinitions="*,auto">

        <ScrollView Grid.Row="0" >
            <ListView ItemsSource="{Binding CreationsForDisplay}" SelectionMode="Single" HasUnevenRows="True" SelectedItem="{Binding SelectedFrame}">
                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="models:FrameModel">
                        <ViewCell>

                            <Grid ColumnDefinitions="50,50,*" RowDefinitions="auto" HorizontalOptions="Fill" Padding="0,10">

                                <VerticalStackLayout  Grid.Column="2" Padding="10,12,25,0">
                                    <Label Text="{Binding FrameHeaderForDisplay}" FontSize="20" LineBreakMode="WordWrap" MaxLines="2" FlowDirection="RightToLeft"/>
                                    <Label Text="{Binding creatorType}" FlowDirection="RightToLeft" />
                                </VerticalStackLayout>

                                <Label Grid.Column="0" 
                                       Text="{x:Static helpers:IconFont.ChevronDown}" 
                                       FontSize="20" 
                                       VerticalOptions="Center" 
                                       HorizontalOptions="Center"
                                       FontFamily="MaterialDesignIcons"/>

                            </Grid>


                            <!--<VerticalStackLayout Padding="10,12,25,0" >
                                <Label Text="{Binding FrameHeaderForDisplay}" FontSize="20" LineBreakMode="WordWrap" MaxLines="2" FlowDirection="RightToLeft"/>
                                <Label Text="{Binding creatorType}" FlowDirection="RightToLeft" />
                            </VerticalStackLayout>-->
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </ScrollView>

        <views:FooterImageView Grid.Row="1" />

        <ActivityIndicator IsRunning="{Binding Loading}" Grid.RowSpan="3" VerticalOptions="Center" HorizontalOptions="Center"/>

    </Grid>

Answer 1

Hi and thanks for the response.

I saw on Github some posts about the ListView behaving like this on iOS and are not gonna be treated soon, for example:

https://github.com/dotnet/maui/issues/11640

I switched to CollectionView and it seems to not have these problems (for now, at least not on the iOS Simulator).

Hope this helps someone else in the future until ListView is taken care of.