Home / Basics / Image Loader / Picasso Android Library Tutorial – Library #5
Picasso Android Library Tutorial

Picasso Android Library Tutorial – Library #5

This is library #5 in this series 100 Library in Android , in the previous article we had ZXing (Zebra Crossing) Android Library Tutorial. In this article we are having the Picasso Android Library Tutorial which allows for hassle-free image loading in your application—often in one line of code!

Why Picasso ?

Picasso one of the most simple libraries you could work with, with just few lines of code and very well documentation you can save much time for your development task. It takes care of :

  • Handling ImageView recycling and download cancelation in an adapter.
  • Complex image transformations and resizing with minimal memory use.
  • Automatic memory and disk caching, you don’t need to make it yourself.

Our App:

Our app will have a list of users, each user consists of Name and Image, We would load the images from URL and putting a placeholder image to use it while loading out target image. A specific Image would appear if the URL was wrong or the app failed to load the Image.

Also we are attaching an indicator on our target images to know the image source if it was from network (Not Cached Images) or from memory, disk (Cached Images)

Technical Overview:

  1. Our Main Activity will have a recyclerView in layout.
  2. A User class to hold Attributes (Name, Image) and a layout file to represent the single row in the recyclerView.
  3. An adapter to manage data between the User class and the recyclerView.
  4. The image loading will be done inside this adapter.

Picasso Android Library Tutorial

1. Creating Android Project, In Android Studio, create a new project by navigating to File ⇒ New Project and fill all the required details. When it prompts to select a default activity, select Empty Activity and proceed.

2. Install the library using Gradle dependency, open Application build.gradle file and add the following code under dependencies:

3. Picasso Android Library uses Internet and device storage, so we should add these permissions in the manifest file as following code:

4. Open the layout file of the activity activity_main.xml and add below code. This includes just a recyclerView which will load a list of Users.

Now we need to build the User class and its layout file, and an adapter to adapt this data with the recyclerView

Picasso Android Library Tutorial

 

5. Under your package name, create a java class named User and add below code.

6. Add a layout file contains ImageView and TextView, Under res ⇒ layout folder, create an xml layout named single_user_row.xml. This xml renders single list row in the RecyclerView.

7. Lets build our adapter, create another class named UserRecyclerviewAdapter. This class is a custom adapter class which inflates the user_movie_row.xml by applying proper data.

Picasso is used in this adapter by instantiating an object of it and adding the code below in the onBindViewHolder method.

8. The last part, Open your MainActivity class and add this code, this will make an object of the recyclerView, make a list of User objects and then attach it to the adapter object.

9. Run the project and test it. You should able see The Picasso Android Library works and the output should look like this image below, try disabling the network from your device and try to use empty URL and see what’s the results.

Notice that:

  1. Every Image has an indicator, when this indicator goes Red, this means the image isn’t cached and loaded from Network.
  2. When it goes Blue, so it’s cached and loaded from Disk, and when it goes Green, so it’s cached and loaded from Memory.
  3. When the Not-Found-URL images are recycled in the recyclerView, Picasso try to load the image again and again.
  4. The app will load a failure image when the URL is broken or there’s network error.
  5. The first time to run the app it will load it will cache the images, so after the first run the loading would be much faster.

 

Picasso Android Library Tutorial

Summary
Article Title
Picasso Android Library Tutorial - Library #5
Description
Picasso Android Library Tutorial, indicator to know the image source, placeholder image and a recyclerView in layout with adapter where image loading done.
Author
Organization
Android Gifts

About #AndroidGifts

#AndroidGifts

Check Also

Fresco Android Library Tutorial

Fresco Android Library Tutorial – Library #8

This is library #8 in this series 100 Library in Android , in the previous article we …

Leave a Reply