Xamarin Forms ListView Performance

user_5724982 0
Viewed 4936

I have a Xamarin.Forms ListView in my App and this ListView uses different ItemTemplates selected by a DataTemplateSelector. With some of the Templates it works great, but also some of them are producing performance problems. Here is the code of a bad Template: 

<DataTemplate x:Key="Template1">
    <ViewCell>
        <Grid Padding="10,0,10,0">
            <Grid.Resources>
                <ResourceDictionary>
                    <Style TargetType="Label" BasedOn="{StaticResource LabelStyle}"/>
                    <Style TargetType="BoxView" BasedOn="{StaticResource InactiveStyle}"/>
                </ResourceDictionary>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Image Grid.Column="0" Grid.RowSpan="3" Source="Icon.png" HeightRequest="30" WidthRequest="30" Margin="0,0,10,0" VerticalOptions="Center" HorizontalOptions="Center"/>

            <BoxView Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="2" IsVisible="{Binding Inactive}"/>
            <Label Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="2" x:Name="Label1" Text="{Binding Column1}" FontAttributes="Bold"/>

            <BoxView Grid.Column="1" Grid.Row="1" IsVisible="{Binding Inactive}"/>
            <Label Grid.Column="1" Grid.Row="1" Text="{Binding Column2}" HorizontalOptions="Start"/>

            <BoxView Grid.Column="2" Grid.Row="1" IsVisible="{Binding Inactive}"/>
            <Label Grid.Column="2" Grid.Row="1" Text="{Binding Column3}" HorizontalOptions="End"/>

            <BoxView Grid.Column="1" Grid.Row="2" IsVisible="{Binding Inactive}"/>
            <Label Grid.Column="1" Grid.Row="2" Text="{Binding Column4}" HorizontalOptions="Start" />

            <BoxView Grid.Column="2" Grid.Row="2" IsVisible="{Binding Inactive}"/>
            <Label Grid.Column="2" Grid.Row="2" Text="{Binding Column5}" HorizontalOptions="End"/>
        </Grid>
    </ViewCell>
</DataTemplate>

I also have found this: Xamarin ListView Performance but I was not able to get it scroll faster. It looks like it can not create the cells fast enough, so that the list scrolls jerky (Android & iOS). What can I do to get this faster?

EDIT: I switched to CachingStrategy="RetailElement" and was able to optimize a few things. But always when the OnSelectTemplate Method is called the scrolling gets slow. Even when this Method does just return a template in the first line. So for me this looks like the Template needs to long time to be build. But I dont know why :(

xamarin.forms xamarin xamarin.android xamarin.ios c#
3 Answers

Concerning the scroll, you need to activate the appropriate RecyclingMode:

<ListView CachingStrategy="RecycleElement">

If you use a DataTemplate selector use:

 <ListView CachingStrategy="RecycleElementAndDataTemplate" />

You'll probably have to adapt your DataTemplate creation process. But with this technique, OnSelectTemplate will be called only when necessary.

Moreover, if it is not enough you should perhaps split your dataTemplate in 2 depending on the Inactive state using your DataTemplateSelector logic to avoid the IsVisible Binding on your element that could be expensive.

user_40247920
user_24238400

For starters, move the resource dictionary from inside the template to the containing page.

Then, like others have said:

  1. Make the first column fixed width
  2. Replace the boxviews with your own custom label that implements strikethrough
  3. Use a caching strategy
user_41490
Related