When i am scrolling in CollectionView it starts to lag, probably loading of next pictures. What can i do with that? How can i optimize it?
Here is XAML:
<Grid BackgroundColor="#00aeef">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<CollectionView x:Name="myCollectionView" Grid.Row="0">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout>
<Frame Padding="0" BackgroundColor="#00d2ff" Margin="20" CornerRadius="30">
<StackLayout Padding="20">
<Label Text="{Binding Airline}" TextColor ="White" FontSize="30" HorizontalOptions="Center"/>
<Image Source="{Binding Url}" HeightRequest="200"/>
<Label Text="{Binding Plane, StringFormat='Plane: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Airline, StringFormat='Airline: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Livery, StringFormat='Livery: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Registration, StringFormat='Reg: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Airport, StringFormat='Airport: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Date, StringFormat='Date: {0}'}" TextColor ="White" FontSize="15"/>
<Label Text="{Binding Comment, StringFormat='Comment: {0}'}" TextColor ="White" FontSize="15"/>
</StackLayout>
</Frame>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</Grid>
And here is my code:
public ShowPlanes()
{
InitializeComponent();
var db = new SQLiteConnection(_dbPath);
var data = db.Table<Airplane>().ToList();
myCollectionView.ItemsSource = data;
NavigationPage.SetHasNavigationBar(this, false);
}
if your images are large try resizing it to your required size may be it will solve it below is very good reference.
https://learn.microsoft.com/en-us/samples/xamarin/xamarin-forms-samples/xamformsimageresize/