Using FFImageLoading:CachedImage in ListView - xamarin

Question

Been looking for an example online about this but can't seem to find one. Basically, i would like to use a FFImageLoading:CachedImage in a ListView with the source bound to a string with a url e.g. http://blah.com/image.jpg. This is what i have tried thus far but no image seems to be loaded.
<ListView IsVisible="true" ItemsSource="{x:Static local:viewmodel.TSViewModel.myArticles}">
<ListView.ItemTemplate >
<DataTemplate>
<ViewCell>
<ViewCell.View>
<StackLayout Orientation="Vertical">
<ffimageloading:CachedImage
HorizontalOptions="Center" VerticalOptions="Center"
WidthRequest="95" HeightRequest="95"
DownsampleToViewSize="true"
Source = "{Binding ImageUrl}">
</ffimageloading:CachedImage>
<Label Text="{Binding Title}" LineBreakMode="WordWrap" FontSize="Small"/>
</StackLayout>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
If there is something i'm doing wrong or i'm just not supposed to use it this way or there are better alternatives, please help me out. Also, i'm a beginner with xamarin forms and mvvm. Any help would be greatly appreciated.
Update: So the images do load but only once I move away from the images page to another page then back to the images page. The images are being loaded in a content page within a tabbed page so maybe that has something to do with it. Any ideas on how to load them the first time the tabbed page is opened?
HomePage.xaml.cs
using TestApp.view;
using Xamarin.Forms;
using TestApp.database;
namespace TestApp
{
public partial class HomePage : TabbedPage
{
public HomePage(TestAppDatabase db)
{
InitializeComponent();
Children.Add(new Bakeries(db));
Children.Add(new Bars());
Children.Add(new Butcheries());
Children.Add(new Restaurants());
Children.Add(new Supermarkets());
Children.Add(new Entertainment());
}
}
}
Bakeries.xaml.cs
using System.Collections.Generic;
using TestApp.model;
using TestApp.database;
using Xamarin.Forms;
namespace TestApp.view
{
public partial class Bakeries : ContentPage
{
public Bakeries(TestApp db)
{
InitializeComponent();
List<Eateries> bakeries = (List<Eateries>) db.GetBakeries();
bakeriesList.ItemsSource = bakeries;
}
}
}

Answer 1

According to the API docs located here. https://github.com/molinch/FFImageLoading/wiki/Xamarin.Forms-API
You must add this line to your platform specific project (AppDelegate.cs, MainActivity.cs, etc) before you use FFImageLoading:
CachedImageRenderer.Init();