Multiple Viewpagers In On Activity

I am trying to implement more than one ViewPager in one activity and it is not really working. What's the best way to implement that. I am stuck!! This is The Activity import andro

Solution 1:

This works for me:

Try this code. Not much changes to it.

NOTE: The images I used are just random images.. you can use your own.

publicclassMainActivityextendsActionBarActivity {

    Context context;

    String[] timeSets;
    String[] coreTargets;
    String[] equipments;

    int[] timeImages;
    int[] coreImages;
    int[] equipmentImages;

    MyAdapter adapter1, adapter2, adapter3;

    @OverrideprotectedvoidonCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        context = this;

        coreTargets = newString[]{"Full body", "Core",
                "Legs", "Upper Body"};

        coreImages = newint[]{R.drawable.ic_launcher, R.drawable.abc_ab_share_pack_holo_dark,
                R.drawable.abc_ab_stacked_solid_dark_holo, R.drawable.abc_ab_bottom_solid_dark_holo};

        timeSets = newString[]{"15 Minutes", "20 Minutes",
                "30 Minutes", "45 Minutes"};

        timeImages = newint[]{R.drawable.abc_ab_share_pack_holo_light, R.drawable.abc_ab_transparent_light_holo,
                R.drawable.abc_ic_ab_back_holo_light, R.drawable.abc_spinner_ab_pressed_holo_light};

        equipments = newString[]{"Rope", "Kette Bell",
                "Weight", "Hat"};

        equipmentImages = newint[]{R.drawable.abc_ic_clear, R.drawable.abc_textfield_searchview_holo_dark,
                R.drawable.abc_spinner_ab_focused_holo_light, R.drawable.abc_ab_stacked_solid_dark_holo};

        ViewPagerview1= (ViewPager) findViewById(R.id.viewpager1);
        ViewPagerview2= (ViewPager) findViewById(R.id.viewpager2);
        ViewPagerview3= (ViewPager) findViewById(R.id.viewpager3);

        adapter1 = newMyAdapter(coreTargets, coreImages);
        adapter2 = newMyAdapter(timeSets, timeImages);
        adapter3 = newMyAdapter(equipments, equipmentImages);

        view1.setAdapter(adapter1);
        view2.setAdapter(adapter2);
        view3.setAdapter(adapter3);

    }


    @OverridepublicbooleanonCreateOptionsMenu(Menu menu) {

        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        returntrue;
    }

    @OverridepublicbooleanonOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will// automatically handle clicks on the Home/Up button, so long// as you specify a parent activity in AndroidManifest.xml.intid= item.getItemId();
        if (id == R.id.action_settings) {
            returntrue;
        }
        returnsuper.onOptionsItemSelected(item);
    }

The Adapter

privateclassMyAdapterextendsPagerAdapter {

        String[] desc;
        int[] image;


        publicMyAdapter(String[] desc, int[] image) {

            super();
            this.desc = desc;
            this.image = image;


        }

        @SuppressLint("NewApi")
        @OverridepublicvoidfinishUpdate(ViewGroup container) {
            // TODO Auto-generated method stubsuper.finishUpdate(container);

        }

        @Overridepublic int getCount() {

            return desc.length;

        }

        @OverridepublicbooleanisViewFromObject(View collection, Objectobject) {

            return collection == ((View) object);
        }

        @OverridepublicObjectinstantiateItem(View collection, int position) {

            // Inflating layoutLayoutInflater inflater = (LayoutInflater) collection.getContext()
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            // Setting view you want to display as a row elementView view = inflater.inflate(R.layout.items, null);

            TextView itemText = (TextView) view.findViewById(R.id.textViewMain);

            ImageView imageView = (ImageView) view.findViewById(R.id.imageViewmain);


            try {

                itemText.setText(desc[position]);

                imageView.setImageResource(image[position]);
            } catch (Exception e1) {
                // TODO Auto-generated catch block
                e1.printStackTrace();
            }
            ((ViewPager) collection).addView(view, 0);
            return view;

        }

        @OverridepublicvoiddestroyItem(View collection, int position, Object view) {
            ((ViewPager) collection).removeView((View) view);

        }

    }
}

The layout looks like this :

<ScrollViewxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"android:paddingBottom="@dimen/activity_vertical_margin"tools:context="com.mike.app.MainActivity$PlaceholderFragment"android:background="#ffc42823"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><android.support.v4.view.ViewPagerandroid:layout_width="fill_parent"android:layout_height="200dp"android:id="@+id/viewpager1"android:background="#333333"
            /><Viewandroid:layout_width="fill_parent"android:layout_height="3dp"android:background="#FFFFFF"></View><android.support.v4.view.ViewPagerandroid:layout_width="fill_parent"android:layout_height="200dp"android:id="@+id/viewpager2"android:background="#333333" /><Viewandroid:layout_width="fill_parent"android:layout_height="3dp"android:background="#FFFFFF">></View><android.support.v4.view.ViewPagerandroid:layout_width="fill_parent"android:layout_height="200dp"android:id="@+id/viewpager3"android:background="#333333" /></LinearLayout></ScrollView>

The Items layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.mike.app.MainActivity$PlaceholderFragment"
    android:background="#ff10c7c6"
    android:orientation="horizontal"
    android:gravity="center">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher"
        android:id="@+id/imageViewmain" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:text="Some Text"
        android:textSize="25sp"
        android:id="@+id/textViewMain"
        android:gravity="center" />

</LinearLayout>

Is this what you are looking for ? If yes, this works for me.. Lemme know if this works.