http://www.ipragmatech.com/wp-content/uploads/2018/12/Image-Loader.png

Nowadays image or media takes important role of Mobile Application industry, for attraction and understandable applications. In this booming market of Android Application, developers are using different predefined libraries to build a quick and reliable product. We have worked almost all image loading libraries, all are not perfect, each library has pros and cons, let's Describe for frequently used libraries pros and cons.

 Note: Did you know you can create a Bitmap with image loaders by your drawable or with your image URL

Image Loaders

Picasso: Picasso is very simple to implement, as well as it’s library size is smaller than others. Sometimes it, through some configuration it can be used to load images even faster. Complex image transformations with minimal memory use. It is not recommended if you have to load numerous high-resolution images. Also, it has no support for GIF or WEBp, if you build a small application and limited features then Picasso is perfect.

Copyright 2013 Square, Inc. Read more: Picasso Universal Image Loader: It is the oldest approach in image loading, It uses minimum memory to load images, even less than Glide. In the case of Network image use, crop image speed not recommended. Also, it has no support for GIF or WebP. Copyright 2011-2015 Sergey Tarasevich Read more: Universal Image Loader

Glide: Nowadays it is a more powerful library to load images. Glide’s loading times are faster and it uses a small amount of memory for cache, also easy to implement. It has a large size and allows specifying a size for a view. Glide also uses only a little higher memory than Fresco. But it has lost of features why we use Glide rather other libraries like UI not freeze, fast loading different size of big images from the internet into view. We can use RecyclerView specific preloader like a charm. BitmapPool to re-use memory and thus lesser GC events, Also Support of GIF and WebP, Highly recommend for large Application.

Fresco: Fresco’s loading times are very fast (small and medium size of images). Its library has lots of additional functionality and options, Fresco is written in C/C++. It uses ashmem(asynchronous shared memory) heap instead of VM heap. It has very good documentation and support available. It does not use ImageView instead it uses SimpleDraweeView(a custom view that extends ImageView) which makes a few things easier. Making image circular or rounded rectangle, specifying border, placeholder or error image can be easily done via XML. It supports both memory cache and disk cache. However, it does not cache images in multiple sizes, it has used a huge size of the cache. This is the only thing I found in Glide better. But in case of support GIF and WebP, you need to add three additional libraries. It is also a very good library for complex and large Applications, but its application not easy like glide or Picasso.also used Huge size for its library.there are No Callbacks with View, Bitmap parameters. Highly recommend if you need animation and complex views.

Steps to Implement Image Loader in Android Mobile Application

Step 1. Add Dependencies open your build.gradle(Module: app) add particular image loader's dependencies and sync gradle

dependencies {

// Picasso
implementation 'com.squareup.picasso:picasso:2.71828'

//Universal Image Loader
implementation 'com.nostra13.universalimageloader:universal-image-loader:1.9.5'

//Glide
implementation 'com.github.bumptech.glide:glide:4.8.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'
 
//Fresco
implementation 'com.facebook.fresco:fresco:1.11.0'

  // For animated GIF support
  implementation 'com.facebook.fresco:animated-gif:1.11.0'

  // For WebP support, including animated WebP
  implementation 'com.facebook.fresco:animated-webp:1.11.0'
  implementation 'com.facebook.fresco:webpsupport:1.11.0'

  // For WebP support, without animations
  implementation 'com.facebook.fresco:webpsupport:1.11.0'

}

Step 2. Add ImageView into your XML file Add an ImageView orSimpleDraweeView or equivalent XML view to insert an image on that view.

// Picasso // UIL // GLIDE
<ImageView
android:id="@+id/image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/profile_photo"
android:contentDescription="@string/image_loader" />

//fresco
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/my_image_view"
android:layout_width="130dp"
android:layout_height="130dp"
fresco:placeholderImage="@drawable/my_drawable"
/>

Step3. Method and class invocation Each library has their own methods, add their methods to load an image into your view. Here we implement some simple code to load an image by different image loaders.

 
simple code to load a image on a ImageView
@Override public void onCreate(Bundle savedInstanceState) {
   ImageView imageView = (ImageView) findViewById(R.id.image_view);
   String imageUri = "http://www.ipragmatech.com/wp-content/uploads/2018/12/Image-Loader.png";
    //Picasso
    Picasso.get().load(imageUri).into(imageView);     

     //UIL
     imageLoader.displayImage(imageUri, imageView);

     // Glide
     Glide.with(this).load(imageUrl).into(imageView);
   //Fresco
   Uri uri = Uri.parse("http://www.ipragmatech.com/wp-content/uploads/2018/12/Image-Loader.png");
   SimpleDraweeView mSimpleDraweeView = (SimpleDraweeView) findViewById(R.id.my_image_view);
   draweeView.setImageURI(uri);
   
  }

Step 4. Add on Features and Functionality As per each documentation, there are no methods to implements animations, zoom, circle view, disk cache management, preload and so on.GOTO their official documentation to implement your feature.

//Glide
// For GIf
    Glide.with(this)
    .load(imageUrl)
    .asGif()
    .placeholder(R.drawable.loading2)
    .crossFade()
    .into(imageView);
//Fresco
// for Animation or GIF
   ControllerListener controllerListener = new BaseControllerListener() {
    @Override
    public void onFinalImageSet(
        String id,
        @Nullable ImageInfo imageInfo,
        @Nullable Animatable anim) {
        if (anim != null) {
          // app-specific logic to enable animation starting
          anim.start();
        }
    }
};
     Uri uri;
     DraweeController controller = Fresco.newDraweeControllerBuilder()
    .setUri(uri)
    .setControllerListener(controllerListener)
    // other setters
    .build();
    mSimpleDraweeView.setController(controller);

Conclusion:

If you want to implement image loaders into your Android app then you will find these steps easier. Implementation of Image loader has very easy steps as described above. But if you want to implement more features according to your application need you must go through official documentation. there are a lot of methods to fulfill your needs.

References:

use more alternative libraries:

Posted from my blog with : https://www.ipragmatech.com/choose-your-image-loader-according-to-your-android-app-smartly/