4
votes

I am using two Viewpager in my app,

1) First Viewpager displays images only

2) I am displaying price

now the issue is i have 4 images displaying in my viewpager1, and in second pager i have price as per selected product. first time it does not show anything, but when i scroll image and goes to next, it shows price..

 pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

                Picasso.with(ProductLandingActivity.this)                            .load(categorylist.get(position).getProductLanding_packLink())
                        .error(R.drawable.nopreview )
                        .placeholder(R.drawable.progress_animation)
                        .into(selectedImage);

                System.out.println("Selected is"+position);
              selectedname.setText(categorylist.get(position).getProductLanding_packDesc());

                for (int i = 0; i < categorylist.get(position).getItems().size(); i++) {
                    System.out.println("ProductPack_ID : " + categorylist.get(position).getItems().get(i).getPackSize_sellingPrice());


                }

                temp = categorylist.get(position).getItems();

              packadapter = new MyPacksPagerAdapter(ProductLandingActivity.this,categorylist);
                pagerpacks.setAdapter(packadapter);

            }

            @Override
            public void onPageSelected(int position) {


            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }


        });

adapter

private class MyPacksPagerAdapter extends PagerAdapter {

        Context context;
        ArrayList<PackListModel> packsizedata ;

        public MyPacksPagerAdapter(Context context,ArrayList<PackListModel> packsizedata) {
            this.context = context;
            this.packsizedata = packsizedata;

        }

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

            final OneActor oneActor;

            View view;
            LayoutInflater infl = ((Activity)context).getLayoutInflater();
            view = infl.inflate(R.layout.list_item_pagerpacktitles, container,false);
            oneActor = new OneActor();
           // oneActor.avatar = (ImageView) view.findViewById(R.id.image);
            oneActor.name = (TextView) view.findViewById(R.id.product_landing_packsname);
            oneActor.cmtCount = (TextView) view.findViewById(R.id.product_landing_packsprice);
            view.setTag(oneActor);


          oneActor.name.setText(temp.get(position).getPackSize_packSize());
            oneActor.cmtCount.setText(temp.get(position).getPackSize_sellingPrice());

            ((ViewGroup) container).addView(view);
            return view;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View)object);
        }

        @Override
        public int getCount() {
            return packsizedata.size();
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return (view == object);
        }
        class OneActor{
           // ImageView avatar;
            TextView name,cmtCount;
        }
    }

By defaulat when i run the app it shows like this,in second pager it is not showing product price,

enter image description here

But when i scroll image it shows price

enter image description here

My Expected output is

enter image description here

This is my json response

http://pastebin.com/fbJang2B

2
add your logic in onPageSelected.Pr38y
i tried that way.now when i scroll price list it crash invalid indexchris
post your crash logcat and code of MyPacksPagerAdapter Pr38y
i added my code in onpage selected..now it start index with 1..chris
@Pr38y can you tellchris

2 Answers

4
votes

First, as mentioned by @NotobharatKumar, you're loading the second adapter on a wrong event of the parent adapter, ie in onPageScrolled method. Second, you're setting a new adapter each time on that specific event, it seems useless. Finally, you are setting datas in an event, (I'm not sure why you're doing this but) I'd prefer to set it in a separate adapter and let the events listener for specific behaviors.

For me, it seems that you have two separate adapters, but one datas list shared by both. Assuming that, you have to set them both at start with their datas respectly, and on the event onPageSelected of the top adapter, you just have to automatically scroll the second. And if they have the same position in the list, onPageSelected should do the work correctly.


So, these modifications should solve your issue:

Your code in onScrollChanged, when you set the image and the text, seems really weird to me. I'd use a first adapter where I'll set all the datas like these two for the first ViewPager:

@Override
public void onCreate(Bundle savedInstansteState) {
    ...
    // set a simple adapter for the first ViewPager
    FirstPagerAdapter imageadapter = 
             new FirstPagerAdapter(ProductLandingActivity.this, categorylist);
    pagerimages.setAdapter(imageadapter);
    ...
}

Then, as usual, set your datas in the FirstPagerAdapter:

@Override
public View getView(int position, View view, ViewGroup container) {
    ...
    // set the content
    Picasso.with(ProductLandingActivity.this)                            
        .load(categorylist.get(position).getProductLanding_packLink())
        .error(R.drawable.nopreview )
        .placeholder(R.drawable.progress_animation)
        .into(selectedImage);

    selectedname.setText(
            categorylist.get(position).getProductLanding_packDesc());
    ...
}

Then no need to (re)load the image or the text when an event is triggered, since they will be holding by the adapter.

You only use getPackSize_packSize() and getPackSize_sellingPrice() in the second adapter, so you should create a separate list to only fill with these datas but outside the swiping event. Start by initializing the second list and the adapters:

// get the Items to fill the pack items list (like you did for `temp`)
ArrayList<Items> packItems = new ArrayList<>();
for (int i = 0; i < categorylist.size(); i++) {
    packItems.add(categorylist.get(position).getItems());
}

// fill the first adapter with your list of products (ie categorylist)
...
pagerimages.setAdapter(imageadapter);
...
// fill the second adapter with the pack items list
packadapter = new MyPacksPagerAdapter(ProductLandingActivity.this, packItems);
pagerpacks.setAdapter(packadapter);

You have to do this when categorylist is created and populated. So place this above code for example in your callback, when you retrieve the datas from your server.

Since the second list packItems is filling in the same order than categorylist, there will be no weird behavior by changing the both positions. Now, in the second adapter, it's preferable to use the local list packsizedata, as follows:

@Override
public Object instantiateItem(ViewGroup container, int position) {
    ...
    oneActor.name.setText(
            packsizedata.get(position).getPackSize_packSize());
    oneActor.cmtCount.setText(
            packsizedata.get(position).getPackSize_sellingPrice());
    ...
}

Finally, control the bottom ViewPager by using onPageSelected event of the first:

pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, 
                            int positionOffsetPixels) { }

    @Override
    public void onPageSelected(int position) {
        // set the second current page regarding the position of the first
        pagerpacks.setCurrentItem(position);
    }

    @Override
    public void onPageScrollStateChanged(int state) { }
});

Hope this will be helpful.

2
votes

You should implement code for action at onPageSelected method because after page changed of your ViewPager then onPageSelected will be called.