Switch between different ViewPagers

Question

I am trying to switch between different ViewPagers (using e.g. a button). It is basically a small tool to optically compare different versions of images. Right now I have only implemented a single ViewPager nested in a RelativeLayout (need the layout for something else). The content is filled by a custom PagerAdapter.

Any ideas on how to change forth and back between multiple ViewPagers?

MainActivity.java

public class MainActivity extends ActionBarActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewPager mViewPager = (ViewPager) findViewById(R.id.view_pager);
        mViewPager.setAdapter(new SheetPagerAdapter());
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
}

SheetPagerAdapter.java

public class SheetPagerAdapter extends PagerAdapter {
    @Override
    public int getCount() {
        return 4;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        SheetView sheetView = new SheetView(container.getContext(), position);
        container.addView(sheetView, LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
        return sheetView;
    }

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

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

SheetView.java

public class SheetView extends RelativeLayout {

    private final String[] images = {
            "page01.jpg",
            "page02.jpg",
            "page03.jpg",
            "page04.jpg"
    };
    private SubsamplingScaleImageView scaleImageView;

    public SheetView(Context context, int page) {
        super(context);
        scaleImageView = new SubsamplingScaleImageView(context);
        this.addView(scaleImageView, RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
        scaleImageView.setImage(ImageSource.asset(images[page]));
    }
}

Answer 1

I finally ended up using a FrameLayout with multiple ViewPagers as child elements. Only the "active" Layout is set visible:

public class MainActivity extends ActionBarActivity {
    private ArrayList<ViewPager> viewPagerList = new ArrayList<>();
    private final int NUM_LAYERS = 10;

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        FrameLayout container = (FrameLayout) findViewById(R.id.frame_container);

        // Add ViewPagers and fill ArrayList
        for(int i = 0; i < NUM_LAYERS; i++) {
            ViewPager vp = new ViewPager(this);
            vp.setVisibility(View.INVISIBLE); // Make invisible
            viewPagerList.add(vp);
            container.addView(vp);
        }

        // Make first ViewPager visible
        viewPagerList.get(0).setVisibility(View.VISIBLE);
    }

    // Switch to other ViewPager
    public void setViewPager(int number) {
        for (ViewPager vp : viewPagerList) {
            vp.setVisibility(View.INVISIBLE);
        }
        viewPagerList.get(number).setVisibility(View.VISIBLE);
    }
}