Glide: Image is not getting loaded through glide on first run

[Sutirth]

Scenario 1: I have recycler view where I need say profile pic First time entering screen the image does not load. As soon as I refresh the list the image is displayed.

Scenario 2:In another case Image is not loaded on first run.Secondly when it goes out of view and scroll back come in view it displays.

Can someone help me ??

[TWiStErRob]

Please give more info on how you use Glide:
https://github.com/bumptech/glide/blob/master/CONTRIBUTING.md#filing-issues

From the above it sounds like it's related to layout.

[Sutirth]

Glide version = compile 'com.github.bumptech.glide:glide:3.6.1'

Glide load line

GlideUrl glideUrl = new GlideUrl(URL, new LazyHeaders.Builder()
        .addHeader("access_token", ACCESS_TOKEN)
        .build());

Glide.with(getApplicationContext())
        .load(glideUrl)
        .placeholder(R.drawable.badge_placeholder)
        .into(leaderboardFriendsViewHolder.teamUserPic);

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:id="@+id/leaderboardRowRelativeLayout"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/apk/res-auto"
    android:layout_height="match_parent">

<de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/leaderboardUserPic"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="20dp"
        />
</RelativeLayout>

[TWiStErRob]

Your placeholder is still displayed when you expect it to have finished, right? It's because of the cross-fade between the placeholder and the loaded image. Circle ImageView can't handle that: https://github.com/bumptech/glide#compatibility

When you scroll down and back the image is in memory cache which is immediate and Glide doesn't need to display the placeholder, so there's no animation and the circle view can hack the bitmap properly the second time.

[Sutirth]

@TWiStErRob Ya you got me right. How should I solve this issue then??

[TWiStErRob]

Did you read the relevant part at compatibility?
Use a transformation or turn off animation.

[Sutirth]

@TWiStErRob Resolved thnx a ton for help :+1:

[ThuyKhanh]

I added " .dontAnimate()" But issue won't fix.
Glide
.with(itemView.getContext())
.load(model.getImageURL())
.listener(listener)
.dontAnimate()
.into(image);
Do you have any idea ?

[TWiStErRob]

@ThuyKhanh If you're not using circular ImageViews then your problem is a different one. Make sure the view is visible, it has size, and log in the listener in case there's an error. If you can't find a solution based on these pointers, please open a new issue and fill in all the details.

[ThuyKhanh]

This is the image of my app issue - first run: link
This is the image of my app normal case - second run link
/*Glide */

    compile 'com.github.bumptech.glide:glide:3.7.0'
    compile 'com.android.support:support-v4:23.0.0'

public class ExamAnswerPageAdapter extends FirebaseRecyclerAdapter<ExamAnswer, ExamAnswerPageAdapter.ExamAnswerPageViewHolder> {
    public static final String TAG = ExamAnswerPageAdapter.class.getSimpleName();
    public ExamAnswerPageAdapter(Context context, Class<ExamAnswer> modelClass, int modelLayout,Class<ExamAnswerPageViewHolder> holderClass, DatabaseReference ref){
        super(modelClass,modelLayout,holderClass,ref);
    }

    /**
     * populate the view attached to the adapter with item inflated from exam_answer_page_item
     * @param viewHolder
     * @param model
     * @param position
     */
    @Override
    protected void populateViewHolder(final ExamAnswerPageViewHolder viewHolder, final ExamAnswer model, final int position) {
        viewHolder.bind(model);
    }

    @Override
    public void onViewRecycled(ExamAnswerPageViewHolder holder) {
        super.onViewRecycled(holder);
        holder.unbind();
    }

    /**
     * Inner View Holder class.
     * Implement Glide retry read more at: https://github.com/bumptech/glide/issues/1308#issuecomment-230282388
     */
    public static class ExamAnswerPageViewHolder extends RecyclerView.ViewHolder {
        private final RetryListener listener;//use a single listener per holder;
        protected DynamicImageView image;
        private ExamAnswer model;
        boolean condition = true;

        public ExamAnswerPageViewHolder(View view) {
            super(view);
            image = (DynamicImageView) view.findViewById(R.id.exam_answer_page_item_imageview);
            listener = condition ? new AutoRetryListener() : new UserRetryListener();
        }

        public void bind(ExamAnswer model) {
            this.model = model;
            this.listener.reset();
            loadImage();
        }

        public void unbind() {
            this.model = null;
            Glide.clear(image);
        }

        private void loadImage() {
            Glide
                    .with(itemView.getContext())
                    .load(model.getImageURL())
                    .listener(listener)
                    .dontAnimate()
                    .into(image);
        }

        private interface RetryListener extends RequestListener<String, GlideDrawable> {
            void reset();
        }

        private class UserRetryListener implements RetryListener {
            private final View.OnClickListener reloadListener = new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    loadImage(); // force a load in response to user interaction
                }
            };

            @Override
            public void reset() {
                image.setOnClickListener(null);
            }

            @Override
            public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
                android.util.Log.d("GLIDE", String.format(Locale.ROOT,
                        "onException(%s, %s, %s, %s)", e, model, target, isFirstResource), e);
                image.setOnClickListener(reloadListener); // load failed, allow user to try again
                return false; // show error image too
            }

            @Override
            public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                android.util.Log.d("GLIDE", String.format(Locale.ROOT,
                        "onResourceReady(%s, %s, %s, %s, %s)", resource, model, target, isFromMemoryCache, isFirstResource));
                reset(); // load successful, turn off retry-ability
                return false; // show loaded resource
            }
        }

        private class AutoRetryListener implements RetryListener {
            /**
             * Number of retries, remember: the first load is not a retry, so a value of 2 means 3 Glide loads.
             */
            private static final int RETRY_COUNT = 2;
            private int retried;

            public void reset() {
                retried = 0;
            }

            @Override
            public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
                android.util.Log.d("GLIDE", String.format(Locale.ROOT,
                        "onException(%s, %s, %s, %s)", e, model, target, isFirstResource), e);
                if (retried < RETRY_COUNT) { // async recursion's stop condition
                    retried++;
                    loadImage(); // async recursion to try loading image again
                    return true; // we handled the problem
                }
                return false; // let Glide handle the problem
            }

            @Override
            public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                //android.util.Log.d("GLIDE", String.format(Locale.ROOT,
                  //      "onResourceReady(%s, %s, %s, %s, %s)", resource, model, target, isFromMemoryCache, isFirstResource));
                return false;
            }
        }
    }

public class DynamicImageView extends PhotoView{
....
}

    /*Zooming imageview*/
    compile 'com.github.chrisbanes:PhotoView:1.2.6'

I added log to listener., but when image isn't showed on ReclyclerView, I didn't get any error message.

Do you have any idea to resolve this problem ?

[TWiStErRob]

@ThuyKhanh this is a new comment, not a new issue... ;)

// If you later call mImageView.setImageDrawable/setImageBitmap/setImageResource/etc then you just need to call
mAttacher.update(); Sample Usage

See #974 for another PhotoView related issue.

[Crabime]

sorry, the first time to run app still occur such question, all thumbnails on the first screen do not show and and i have posted such question on stackoverflow.

[TWiStErRob]

@Crabime The answer is the same as the resolution of this issue. Posted on SO.
Edit: The above observation was at first glance, see #1508 for more.