Search code examples
androidandroid-viewpagertogglebuttonandroid-pageradapterrecycle

Viewpager: lose the state of toggle button when swiping


I am creating a Gallery with image and like button using Viewpager and PagerAdapter. Please refer to my code:

public class GalleryAdapter extends PagerAdapter {

private Activity _activity;
private ArrayList<MyPhotoItem> _imageCollection;

// Components in fullsceen layout
ImageView imgDisplay;
private ToggleButton btnLike;

// Variable for btnLike
private boolean isChecked;

// constructor
public GalleryAdapter(Activity activity,
        ArrayList<MyPhotoItem> images) {
    this._imageCollection = images;
}

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

@Override
public boolean isViewFromObject(View view, Object object) {
    return view == ((RelativeLayout) object);
}

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

    inflater = (LayoutInflater) _activity
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    View viewLayout = inflater.inflate(R.layout.layout_gallery_image,
            container, false);


    imgDisplay = (ImageView) viewLayout
            .findViewById(R.id.layout_gallery_imgDisplay);
    Picasso.with(this._activity.getApplicationContext())
            .load(_imageCollection.get(position).url).into(imgDisplay);

    btnLike = (ToggleButton) viewLayout
            .findViewById(R.id.layout_gallery_likeButton);
    btnLike.setOnCheckedChangeListener(null);
    btnLike.setChecked(isChecked);
    btnLike.setOnCheckedChangeListener(new OnCheckedChangeListener() {

        @Override
        public void onCheckedChanged(CompoundButton buttonView,
                boolean isChecked) {
            if (isChecked) {
                isChecked = true;

            } else {
                isChecked = false;

            }
        }

    });

    ((ViewPager) container).addView(viewLayout);

    return viewLayout;
}


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

}

@Override
public int getItemPosition(Object object) {
    return PagerAdapter.POSITION_NONE;
}

}

My current issue: the Viewpager doesn't keep the toggle button state when I swiping to another pages and going back the previous ones (supposed 5 photos loaded in Viewpager). I went through a couple of Stackoverflow posts, but none of them can solve my problem properly.

Any advices will be appreciated. Thanks in advance.


Solution

  • thanks for your replies. Though most of them were not direct answers for my case, they gave me some clues to come to my solution. This may not the best solution, but it solved my issue.

    The solution:

    1/ Add a flag to keep status of Toggle in the Object:

    public class MyPhotoItem {
    ...
      public boolean like_flag;
    ...
    }
    

    2/ Customise a bit the OnCheckedChangeListener:

    class OnLikeCheckedChangeListener implements OnCheckedChangeListener {
        int mPosition;
    
        // constructor
        public OnLikeCheckedChangeListener(int position) {
            this.mPosition = position;
        }
        @Override
        public void onCheckedChanged(CompoundButton buttonView,
                boolean isChecked) {
         if (isChecked){ 
                _imageCollection.get(_position).like_flag = true;
                notifyDataSetChanged();
          }
         else{
                _imageCollection.get(_position).like_flag = false;
                notifyDataSetChanged();
         }
      }
    }
    

    3/ Setup the Toggle status base on Flag:

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
      ...
      // Init Toggle status
        if (_imageCollection.get(position).like_flag) {
            btnLike.setChecked(true);
        } else {
            btnLike.setChecked(false);
        }
      btnLike.setOnCheckedChangeListener(new OnLikeCheckedChangeListener(
                position));
      ...
     }
    

    That's it. The Toggle status is persisted during swiping the Viewpager. Anyone has better solution or good practices, please feel free to comment.

    Enjoy coding !