Author: Areeb Jamal

In Open Event Orga App (Github Repo), we used Picasso to load images from URLs and display in ImageViews. Picasso is easy to use, lightweight, and extremely configurable but there has been no new release of the library since 2015. We were using Picasso in binding adapters in order to dynamically load images using POJO properties in the layout XML itself using Android Data Binding. But this configuration was a little buggy. The first time the app was opened, Picasso fetched the image but it was not applied to the ImageView. When the device was rotated or the activity was resumed, it loaded just fine. This was a critical issue and we tried many things to fix it but none of it quite fit our needs. We considered moving on to other Image Loading libraries like Glide, etc but it was too heavy on the size and functionality for our needs. The last resort was to update the library to develop version using Sonatype’s snapshots Repository. Now, the Picasso v2.6.0-SNAPSHOT is very stable but not released to the maven central repository, and a newer develop version v3.0.0-SNAPSHOT was launched too. So we figured we should use that. This blog will outline the steps to include the develop version of Picasso, configuring it for our needs and making it work with Android Data Binding. Setting up Dependencies Firstly, we need to include the sonatype repository in the repositories block of our app/build.gradle repositories { ... maven { url 'https://oss.sonatype.org/content/repositories/snapshots/' } }   Then we need to replace the Picasso dependency entry to this: compile 'com.squareup.picasso:picasso:3.0.0-SNAPSHOT'   Note that if you used Jake Wharton’s OkHttp3 Downloader for Picasso, you won’t need it now, so you need to remove it from the dependency block And you need to use this to import the downloader import com.squareup.picasso.OkHttp3Downloader;   Next, we set up our Picasso DI this way Picasso providesPicasso(Context context, OkHttpClient client) { Picasso picasso = new Picasso.Builder(context) .downloader(new OkHttp3Downloader(client)) .build(); picasso.setLoggingEnabled(true); return picasso; }   Set the singleton instance in our application: Picasso.setSingletonInstance(picasso);   And we are ready to use it. Creating Adapters Circular Image Adapter We show event logos as circular images, so we needed to create a binding adapter for that: @BindingAdapter("circleImageUrl") public static void bindCircularImage(ImageView imageView, String url) { if(TextUtils.isEmpty(url)) { imageView.setImageResource(R.drawable.ic_photo_shutter); return; } Picasso.with() .load(Uri.parse(url)) .error(R.drawable.ic_photo_shutter) .placeholder(R.drawable.ic_photo_shutter) .transform(new CircleTransform()) .tag(MainActivity.class) .into(imageView); }   If the URL is empty, we just show the default photo, and otherwise we load the image into the view using standard CircleTransform Note that there is no context argument in the with method. This was implemented in Picasso recently where they removed the need for context for loading images. Now, they use a Dummy ContentProvider to get application context, which is inspired by how Firebase does it. Now, we can just normally use this binding in layout to load the event thumbnail like this <ImageView android:layout_width="@dimen/image_small" android:layout_height="@dimen/image_small" android:contentDescription="@string/event_thumbnail" app:circleImageUrl="@{event.thumbnailImageUrl}" />   This gives us a layout like this: Next we need to load the header…