Source

Easily load any image from any source: internet, file, application bundle, resources, ... These are defined per platform: Android, iOS, Windows Phone.

Callbacks

In order to be notified when the image is successfully loaded or when there were errors:

Note by default callback are executed on background thread, you can change it with a custom config:

var config = new FFImageLoading.Config.Configuration()
{
    ExecuteCallbacksOnUIThread = true
};
ImageService.Instance.Initialize(config);

Success

ImageService.Instance.LoadUrl(urlToImage)
.Success(() =>
{
  // your code here...
})

An overload exists to get dimensions and image source: Success((size, loadingResult) => {}) The image source, of type LoadingResult, indicates if it was loaded from web, disk cache, memory cache, file, bundle, ...

Error

.Error(exception =>
{
  // your code here...
})
.Into(_imageView);

Process finished

Finish callback is invoked when image loading process finished, whatever the result, success, failure or cancellation:

ImageService.Instance.LoadUrl(urlToImage)
.Finish(workScheduled =>
{
  // your code here...
})
.Into(_imageView);

Argument workScheduled, of type IScheduledWork, indicates if it succeeded, failed or was cancelled.

Placeholders

It is possible to define placeholders while image is loading or when an error occured.

Loading

ImageService.Instance.LoadUrl(urlToImage)
.LoadingPlaceholder("loading.png") // placeholder loaded from file
.Into(_imageView);

By default placeholders are loaded from file but you can also specify the ImageSource (see below).

Error

ImageService.Instance.LoadUrl(urlToImage)
.ErrorPlaceholder("http://mydomain.com/error.png", ImageSource.Url) // placeholder loaded from a URL
.Into(_imageView);

Preload

It is possible to preload requests so they are cached ahead of time. In that case the request should finish with .Preload() and should not have any target (ie: .Into(target)).

// In this example urlToImage will be added to cache without being assigned to any target.
ImageService.Instance.LoadUrl(urlToImage).Preload();

Limit memory usage

Reduce image dimensions

Take advantage of DownSample to reduce memory usage from images. You can redefine width/height to the visible size. Users won't notice the difference but their phone memory will! Even though method allows two optional parameters you should only provide either width or height. Aspect ratio will be kept based on provided value.

// In this example height will be calculated to match width while keeping the same aspect ratio.
ImageService.Instance.LoadUrl(urlToImage).DownSample(width: 150).Into(_imageView);

Remove transparency

The alpha channel contains the transparency information. Transparency causes images to consume twice more memory. If you don't need transparency, and hence want to save memory, use:

// In this example height will be calculated to match width while keeping the same aspect ratio.
ImageService.Instance.LoadUrl(urlToImage).TransparencyChannel(false).Into(_imageView);

On Android transparency is disabled by default. This feature is not yet implemented on iOS or Windows Phone.

Transformations

Transformations allow a whole new range of possibilities. Crop an image on the fly, change its colors, make it rounded... They are explained here.

Example:

// Image will have gray colors only.
ImageService.Instance.LoadUrl(urlToImage)
.Transform(new GrayscaleTransformation())
.Into(imgDisplay);

Other

Retry

If your download failed, or something wrong happened, it can be automatically retried.

In this example, if loading from the URL failed then it will try 3 more times with a 200ms interval between each trial:

ImageService.Instance.LoadUrl(urlToImage)
.Retry(3, 200)
.Into(_imageView);

Fading animation while loading image

By default a fading animation starts when an image is loaded.

• If there was a placeholder it fades from it to the destination image.
• If there was no placeholder it fades from white to the image. It can be disabled per image:

ImageService.Instance.LoadUrl("urlToImage")
.FadeAnimation(false)
.Into(_imageView);