how to set an image in viewpager for collapsing toolbar layout in android?

Question

I am trying to implement CollapsingToolbarLayout (imageView)+tablayout in my project, whenever i touch tab(fragment), in imageView of collaping toolbar layout need to be change based on veiwpager position. for that i initialised images array and called image view at getpostion of viewpager adapter and added array postion to image view like this

@Override
public Fragment getItem(int position) 
{
    for(int i = 0; i < imgid.length; i++) 
    {
        if(i == position) 
        {
            himage.setImageResource(imgid[i]);
        }
    }
    return mFragmentList.get(position);
} 

But at first time only those images displayed ,then last image only coming to all tabs.

my requirement is whenever i touch my tabs ,based on my tab position ,its need to apply image in imageview of collapsingtoolbarlayout. please help how to do it? Thanks in Advance

Answer 1

Try doing this.

viewPager.addOnPageChangeListener(new OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            int pos = tabLayout.getSelectedTabPosition();
            if (pos == 0) {
                imageView.setImageResource(R.drawable.your_image_for_first);
            } else if (pos == 1) {
                imageView.setImageResource(R.drawable.your_image_for_second);
            } 
        }

        @Override
        public void onPageSelected(int position) {

        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });