ViewPager inside RecyclerView: ImageView not showing in the first page

Question

I have a ViewPager as the row of a RecyclerView. It is like a "featured products" row.

I set the adapter of the ViewPager in the onBindViewHolder of the RecyclerView. ViewPager contains a TextView and an ImageView. ImageView is loaded from an URL via Glide in instantiateItem. The list of items in the ViewPager is 4.

The problem is, the ImageViews of the first two items in the ViewPager are not loaded. If I swipe the ViewPager to the 3rd item and back, I see the first ImageView successfully.

TextViews work fine. The problem is only with the images.

If I debug the code, I observe that the code block that belongs to Glide is reached.

If I use the ViewPager as a standalone view in the fragment (not as a row of the RecyclerView) I observe no problems.

There is a similar question: Image not loading in first page of ViewPager (PagerAdapter) But that unfortunately does not apply to my case. I declare my variables locally and with the final modifier already.

PagerAdapter's instantiateItem is like follows:

@Override
public Object instantiateItem(ViewGroup container, int position) {

    final LayoutInflater inflater = (LayoutInflater) container.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    final View v = inflater.inflate(viewpager_layout, container, false);

    final ImageView imgProduct = (ImageView) v.findViewById(R.id.imgProduct);
    final TextView lblName = (TextView) v.findViewById(R.id.lblName);

    final Product product = data.get(position);

    lblName.setText(product.name);

    Glide
            .with(ctx)
            .load(product.url)
            .asBitmap()
            .thumbnail((float) 0.4)
            .placeholder(R.drawable.placeholder)
            .error(R.drawable.placeholder)
            .animate(R.animator.fade_in)
            .into(imgProduct);
}

RecyclerView's onBindViewHolder looks like:

@Override
public void onBindViewHolder(final DataObjectHolder holder, int position) {

    int listType = getItemViewType(position);
    final ProductList item = data.get(position);

    if (listType == 0) {

        final List<Product> lstProducts = GetProducts(item.products);

        final MyPagerAdapter myAdapter = new MyPagerAdapter(ctx, lstProducts);
        holder.viewPager.setAdapter(myAdapter);
        myAdapter.notifyDataSetChanged(); // this changes nothing also..
    }
    else {
        // removed..
    }
}

I work with the AppCompat library by the way. All suggestions are welcome. Thank you.

I found a solution, but I did not understand the actual reason behind the problem. What I did was to update the Glide code block as given in http://stackoverflow.com/a/34379795/665726 This worked for me. — Kemal Taşkın, Feb 17 '16 at 16:08

score 0 · Answer 1 · answered Feb 17 '16 at 14:40

0

Glide sets images asynchronously and helps to avoid any lag in UI thread. If there are many images it does take some time for the image to set in, but it doesn't cause any lag.

answered Feb 17 '16 at 14:40

Shashank Udupa

2,173
1
19
26

No, this is not the case. As I said in the question, the ViewPager works when it is not in a RecyclerView, and the images are loaded very fast. In my case, the first two images are not loaded at all. This is not a delay issue. – Kemal Taşkın Feb 17 '16 at 15:19

score 0 · Answer 2 · answered Feb 17 '16 at 15:00

It's a simple Asynchronous request issue, when you swipe to the third tab and come back, till the data would have come and come and then it's gets binded with the UI.

I had faced the similar issue in my project.

I am assuming that you are using a new fragment for each view pager

One thing you can do is...

1.While creating fragment in viewPager in **getItem()**, set a tag with fragment.

2. create a viewPager **addOnPageChangeListener** and on page selected, get that fragment by tag and check if image is loaded or not.

3. If not loaded, then show some loader, and wait for the response, after response hide the loader

I am sorry but no, this is not the case. As I said in the question, the ViewPager works when it is not in a RecyclerView, and the images are loaded very fast. — Kemal Taşkın, Feb 17 '16 at 15:18

ViewPager inside RecyclerView: ImageView not showing in the first page

2 Answers2