How can I use a Color as placeholder image with Picasso?

Question

I want to use Picasso to set a Color as placeholder image.

I tried this:

    int placeHolderColor2 = Color.rgb(20,20,20);

    Picasso.with(context)
         .load(item.getImageUrls().get(0))
         .placeholder(placeHolderColor2)
         .error(R.drawable.card_image)
        .centerCrop()
        .fit()
        .into(viewHolder.imageView);

But it leads to the following error:

10-07 05:36:42.965 5827-5827/? E/AndroidRuntime: android.content.res.Resources$NotFoundException: Resource ID #0xff141414
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.content.res.Resources.getValue(Resources.java:1266)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.content.res.Resources.getDrawable(Resources.java:785)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.content.res.Resources.getDrawable(Resources.java:752)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.squareup.picasso.RequestCreator.getPlaceholderDrawable(RequestCreator.java:676)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.squareup.picasso.RequestCreator.into(RequestCreator.java:637)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.squareup.picasso.RequestCreator.into(RequestCreator.java:601)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.lorentzos.swipecards.ServiceCardDtoListAdapter.createViewFromResource(ServiceCardDtoListAdapter.java:116)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.lorentzos.swipecards.ServiceCardDtoListAdapter.getView(ServiceCardDtoListAdapter.java:66)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.lorentzos.flingswipe.SwipeFlingAdapterView.layoutChildren(SwipeFlingAdapterView.java:161)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.lorentzos.flingswipe.SwipeFlingAdapterView.refresh(SwipeFlingAdapterView.java:152)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at com.lorentzos.flingswipe.SwipeFlingAdapterView.onLayout(SwipeFlingAdapterView.java:138)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.View.layout(View.java:15671)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.ViewGroup.layout(ViewGroup.java:5038)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.RelativeLayout.onLayout(RelativeLayout.java:1076)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.View.layout(View.java:15671)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.ViewGroup.layout(ViewGroup.java:5038)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.FrameLayout.layoutChildren(FrameLayout.java:579)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.FrameLayout.onLayout(FrameLayout.java:514)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.View.layout(View.java:15671)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.ViewGroup.layout(ViewGroup.java:5038)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.LinearLayout.setChildFrame(LinearLayout.java:1703)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.LinearLayout.layoutVertical(LinearLayout.java:1557)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.LinearLayout.onLayout(LinearLayout.java:1466)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.View.layout(View.java:15671)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.ViewGroup.layout(ViewGroup.java:5038)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.FrameLayout.layoutChildren(FrameLayout.java:579)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.widget.FrameLayout.onLayout(FrameLayout.java:514)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at android.view.View.layout(View.java:15671)
10-07 05:36:42.965 5827-5827/? E/AndroidRuntime:     at 

How can I use a Color as placeholder image with Picasso?

Answer 1

You can understand from the error log itself android.content.res.Resources$NotFoundException: Resource ID #0xff141414

Use latest version of Picasso

And try this

Picasso.with(mContext).load("URL").placeholder(R.color.holder_color).error(R.color.error_color).into(viewHolder.imageView);

Answer 2

In my project I used this solution to make a color placeholder

        gradientDrawable = new GradientDrawable();
        gradientDrawable.setShape(GradientDrawable.RECTANGLE);
        gradientDrawable.setColor(color);

Picasso.with(context)
     .load(item.getImageUrls().get(0))
     .placeholder(gradientDrawable)
     .error(R.drawable.card_image)
    .centerCrop()
    .fit()
    .into(viewHolder.imageView);

This approach helps when your ImageView is set to wrap_content, as simple color fill will make your image invisible until the picture is loaded, because, as you know, color doesn't occupy any space.

Answer 3

You can simply use class ColorDrawable. Also better to place color in file colors.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="your_color">#202020</color>
</resources>

And then your java code will look like:

Drawable placeholder = new ColorDrawable(getResources().getColor(R.color.your_color));

Picasso.with(context)
       .load(item.getImageUrls().get(0))
       .placeholder(placeholder)
       .error(R.drawable.card_image)
       .centerCrop()
       .fit()
       .into(viewHolder.imageView);

And if you're using Picasso in 2018 then replace with(context with get():

Drawable placeholder = new ColorDrawable(getResources().getColor(R.color.your_color));

Picasso.get()
       .load(item.getImageUrls().get(0))
       .placeholder(placeholder)
       .error(R.drawable.card_image)
       .centerCrop()
       .fit()
       .into(viewHolder.imageView);