How to Display Low Resolution Image as the Place Holder

Image for post
Image for post

Fresco is a powerful system for displaying images in Android applications.

There are situations where the original image is quite big and would take considerable amount of time to load. In such scenarios, it is advisable to display a low resolution image or thumbnail image until the original image loads. Fresco makes it very easy to implement.

If you are building with Gradle, simply add the following line to the dependencies section of your build.gradle file:

implementation 'com.facebook.fresco:fresco:2.0.0'

For more information on adding Fresco to your app, check out their repository.

Fresco needs to be initialised. You should only do this 1 time, so placing the initialisation in your Application is a good idea.

public class MyApplication extends Application {
public void onCreate() {

Add the SimpleDraweeView to the layout:


First, bind the SimpleDraweeView to your View.

SimpleDraweeView image;

Next, setup your image view using newDraweeControllerBuilder

private void setupImageView() {
DraweeController controller = Fresco.newDraweeControllerBuilder() .setLowResImageRequest(ImageRequest.fromUri(media.getThumbUrl())) .setImageRequest(ImageRequest.fromUri(media.getImageUrl()))

Fresco lets you specify a low res and original image request.

  • use setLowResImageRequest to set the temporary image. It need not be a static placeholder. It can be fetched and displayed from the server.
  • use setImageRequest to set the original image.

You can read more about ImageRequests here. Also, there’s more documentation about requesting multiple images here.

Written by

Grad Student at ASU | Student Researcher at The Luminosity Lab | Ex Senior Software Engineer, Zeta | Volunteer, Wikimedia Foundation

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store