I want to show 3 different fragments for 3 different tabs in view-pager ,Tabbed activity Android

Question

I am very new to android , this time i created a view-pager tabbed activity by looking a video tutorial. the problem or the need is to show 3 different fragments if the user slides the position like tab1(shows first fragment),tab2 (shows second fragment) tab3 (shows third fragment) Now it is showing one and only fragment for all tabs

this is my adapter class named datafragment package com.example.jaison.news;

public class datafragment extends Fragment {
View view;
ViewPager viewPager;
TabLayout tabLayout;


@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    view= inflater.inflate(R.layout.sample,container,false);


    viewPager = (ViewPager) view.findViewById(R.id.viewpager);
    viewPager.setAdapter(new sliderAdapter(getChildFragmentManager()));
    tabLayout = (TabLayout) view.findViewById(R.id.sliding_tabs);
    tabLayout.post(new Runnable() {
        @Override
        public void run() {
            tabLayout.setupWithViewPager(viewPager);
        }
    });

    return view;

}




private class sliderAdapter extends FragmentPagerAdapter{

    final  String tabs[]={"tab1", "tab2","tab3"};
    public sliderAdapter(FragmentManager fm) {
        super(fm);
    }


    @Override
    public Fragment getItem(int position) {
        Fragment fragment = null;

        return fragment;
    }


    @Override
    public int getCount() {


       return 3;
    }
   @Override
   public CharSequence getPageTitle(int position) {
        return tabs[position];
   }
}




 }

for those who did not get my point , all i need is implement the code something just like this, but i am not sure about this..

        switch (position) {
            case 0:

                //showing first fragment


            case 1: 

                    //showing second fragment


            case 2:
                //showing third fragment
            default:
                return new Fragment();
        }

refer this https://www.androidhive.info/2015/09/android-material-design-working-with-tabs/ — MinnuKaAnae, Jul 28 '17 at 05:57
you should create 3 different fragment xml files and 3 fragment classes, follow above link step by step you will get the solution — MinnuKaAnae, Jul 28 '17 at 06:00
I know how to create fragments, the next part is little difficult for me . asswitching position — Jaison Joseph, Jul 28 '17 at 06:02

score 3 · Accepted Answer · answered Jul 28 '17 at 06:01

3

change your getItem method like this

 @Override
public Fragment getItem(int position) {
    Fragment fragment = null;
    switch (position){
        case 0:
            fragment = new Tab1Fragment();
            break;
        case 1:
            fragment = new Tab2Fragment();
            break;
       case 2:
            fragment = new Tab3Fragment();
            break;
    }
    return fragment;
}

answered Jul 28 '17 at 06:01

Sandeep dhiman

1,863
2
17
22

working.......... actually i am very new, i like your answer, its very simple and all i need is that – Jaison Joseph Jul 28 '17 at 06:14

score 0 · Answer 2 · answered Jul 28 '17 at 06:02

You need to create an instance of your viewPagerAdapter and then add items to it. Something like this:

ViewPagerAdapter viewpagerAdapter = new ViewPagerAdapter(getChildFragmentManager());

viewPager.setAdapter(viewpagerAdapter);

// then add items to it as you add items to a recyclerview adapter or to any list

viewpagerAdapter.addFragment(new Fragment1(), "title1");

And the custom code for the viewpager Adapter is:

public class ViewPagerAdapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

    public ViewPagerAdapter(FragmentManager manager) {
        super(manager);
    }

    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }

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

    public void addFragment(Fragment fragment, String title) {
        mFragmentList.add(fragment);
        mFragmentTitleList.add(title);
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return mFragmentTitleList.get(position);
    }
}

Also since you are new to programming, would advice you to use proper nomenclature, for eg. names of classes always begin with initial letter Uppercase

class ClassName 

void methodName

score 0 · Answer 3 · answered Jul 28 '17 at 06:09

MainActivity

import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;

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

    toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    viewPager = (ViewPager) findViewById(R.id.viewpager);
    setupViewPager(viewPager);

    tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(viewPager);
}

private void setupViewPager(ViewPager viewPager) {
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
    adapter.addFragment(new OneFragment(), "ONE");
    adapter.addFragment(new TwoFragment(), "TWO");
    adapter.addFragment(new ThreeFragment(), "THREE");
    viewPager.setAdapter(adapter);
}

class ViewPagerAdapter extends FragmentPagerAdapter {
    private final List<Fragment> mFragmentList = new ArrayList<>();
    private final List<String> mFragmentTitleList = new ArrayList<>();

    public ViewPagerAdapter(FragmentManager manager) {
        super(manager);
    }

    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }

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

    public void addFragment(Fragment fragment, String title) {
        mFragmentList.add(fragment);
        mFragmentTitleList.add(title);
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return mFragmentTitleList.get(position);
    }
}
}

OneFragment.java

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


public class OneFragment extends Fragment{

public OneFragment() {
    // Required empty public constructor
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_one, container, false);
}

}

fragment_one.xml

<RelativeLayout 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">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/one"
    android:textSize="40dp"
    android:textStyle="bold"
    android:layout_centerInParent="true"/>

 </RelativeLayout>

Likewise create few more fragment activities with same code we used for OneFragment.java.

thanks for your effort , but in this i am combining viewpager with navigation drawer — Jaison Joseph, Jul 28 '17 at 06:13
follow this https://stackoverflow.com/a/45302902/5594218, design for navigation drawer with tabs — MinnuKaAnae, Jul 28 '17 at 06:16

score 0 · Answer 4 · edited Jan 21 '21 at 18:52

See this simple complete example: Here I used TabLayout also which is often used with ViewPager, so will be useful for you on next.

It requires API:

compile 'com.android.support:design:25.3.1'

You can ignore and remove all parts of TabLayout from xml and java files if want to go simpler at this instance.

1. activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v4.view.ViewPager
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/viewPager"/>

    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        app:tabIndicatorColor="@color/colorPrimaryDark"
        app:layout_scrollFlags="scroll|enterAlways"
        android:id="@+id/tabLayout"/>

</RelativeLayout>

2. Fragment Tab1.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:text="TAB 1"
    android:id="@+id/textTab1"/>

</RelativeLayout>

3. Fragment Tab2.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:text="TAB 2"
    android:id="@+id/textTab2"/>

</RelativeLayout>

4. Fragment Tab3.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:text="TAB 3"
    android:id="@+id/textSpacerNoTitleab3"/>

</RelativeLayout>

5. MainActivity.java

public class MainActivity extends AppCompatActivity
    implements TabLayout.OnTabSelectedListener, ViewPager.OnPageChangeListener{

ViewPager viewPager;
TabLayout tabLayout;

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

    viewPager = (ViewPager) findViewById(R.id.viewPager);
    tabLayout = (TabLayout) findViewById(R.id.tabLayout);

    tabLayout.addTab(tabLayout.newTab().setText("Page 1"));
    tabLayout.addTab(tabLayout.newTab().setText("Page 2"));
    tabLayout.addTab(tabLayout.newTab().setText("Page 3"));
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
    tabLayout.addOnTabSelectedListener(this);

    viewPager.setAdapter(new VPAdapter(getSupportFragmentManager()));
    viewPager.addOnPageChangeListener(this);
}

@Override
public void onTabSelected(TabLayout.Tab tab) {
    w("onTabSelected(): "+tab.getPosition());
    viewPager.setCurrentItem(tab.getPosition());
}

@Override
public void onTabUnselected(TabLayout.Tab tab) {

}

@Override
public void onTabReselected(TabLayout.Tab tab) {

}

@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override
public void onPageSelected(int position) {
    w("onPageSelected(): "+position);
    TabLayout.Tab tab = tabLayout.getTabAt(position);
    if(tab!=null)tab.select();
}

@Override
public void onPageScrollStateChanged(int state) {

}

void w(String string){
    Log.w("MKN",getClass().getSimpleName()+" "+string);
}
}

6. Fragment class Tab1.java public class Tab1 extends Fragment {

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    super.onCreateView(inflater, container, savedInstanceState);
    return inflater.inflate(R.layout.tab1,container,false);
}
}

7. Fragment class Tab2.java

public class Tab2 extends Fragment {
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    super.onCreateView(inflater, container, savedInstanceState);
    return inflater.inflate(R.layout.tab2,container,false);
}
}

8. Fragment class Tab3.java

public class Tab3 extends Fragment {
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    super.onCreateView(inflater, container, savedInstanceState);
    return inflater.inflate(R.layout.tab3,container,false);
}
}

9. Adapter class VPAdapter.java

public class VPAdapter extends FragmentPagerAdapter {

public VPAdapter(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    if(position == 0) return new Tab1();
    if(position == 1) return new Tab2();
    if(position == 2) return new Tab3();

    throw new IllegalStateException("Unexpected position " + position);
}

@Override
public int getCount() {
    return 3;
}
}

score -1 · Answer 5 · answered Jul 28 '17 at 06:01

Use this :

private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        // adding the fragments here with titles
        adapter.addFragment(new OneFragment(), "ONE");
        adapter.addFragment(new TwoFragment(), "TWO");
        adapter.addFragment(new ThreeFragment(), "THREE");
        viewPager.setAdapter(adapter);
    }

    class ViewPagerAdapter extends FragmentPagerAdapter {
        private final List<Fragment> mFragmentList = new ArrayList<>();
        private final List<String> mFragmentTitleList = new ArrayList<>();

        public ViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }

        @Override
        public Fragment getItem(int position) {
            return mFragmentList.get(position);
        }

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

        public void addFragment(Fragment fragment, String title) {
            mFragmentList.add(fragment);
            mFragmentTitleList.add(title);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mFragmentTitleList.get(position);
            //return null;
        }
    }

then set it like this:

ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);

tabLayout = (TabLayout) view.findViewById(R.id.sliding_tabs);
tabLayout.setupWithViewPager(viewPager);

hope it helps!!!

Fragment instances hosted by a ViewPager's FragmentPagerAdapter should be instantiated inside `FragmentPagerAdapter.getItem()`, and should never be instantiated i the Activity that hosts it. — EpicPandaForce, Jan 21 '21 at 18:53

I want to show 3 different fragments for 3 different tabs in view-pager ,Tabbed activity Android

5 Answers5