1) MainActivity.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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="@+id/tablayout_id"
android:background="@color/colorPrimary"
app:tabMode="fixed"
app:tabGravity="fill"/>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/viewpager_id"
android:layout_below="@+id/tablayout_id"/>
</RelativeLayout>
2) MainActivity.java
public class MainActivity extends AppCompatActivity {
TabLayout tableLayout;
ViewPager viewPager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.viewpager_id);
tableLayout = (TabLayout) findViewById(R.id.tablayout_id);
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new OneFragment(), "One"); // Add Fragments as per your Need
adapter.addFragment(new TwoFragment(), "Two");
adapter.addFragment(new ThreeFragment(), "Three");
viewPager.setAdapter(adapter);
tableLayout.setupWithViewPager(viewPager);
}
}
3) ViewPagerAdapter.java
On Above Video I Used FragmentPagerAdapter for ViewPagerAdapter
but i strongly recommended you to used FragmentStatePagerAdapter it will help to load your fragment batter tahn FragmentPagerAdapter
public class ViewPagerAdapter extends FragmentStatePagerAdapter{
private final List<Fragment> fragmentList = new ArrayList<>();
private final List<String> fragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int i) {
return fragmentList.get(i);
}
@Override
public int getCount() {
return fragmentTitleList.size();
}
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return fragmentTitleList.get(position);
}
public void addFragment(Fragment fragment, String title){
fragmentList.add(fragment);
fragmentTitleList.add(title);
}
}
4) Now Add Your Fragment As Per Your Need
i) OneFragment
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="@drawable/btn_bg1"
android:layout_marginLeft="10dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
tools:context=".OneFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="One"
android:layout_gravity="center"
android:textColor="#000000"
android:textStyle="bold"
android:textSize="50sp"/>
</FrameLayout>
i) TwoFragment
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="@drawable/btn_bg1"
android:layout_marginLeft="10dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
tools:context=".TwoFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="One"
android:layout_gravity="center"
android:textColor="#000000"
android:textStyle="bold"
android:textSize="50sp"/>
</FrameLayout>
iii) ThreeFragment
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="@drawable/btn_bg1"
android:layout_marginLeft="10dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
tools:context=".ThreeFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="One"
android:layout_gravity="center"
android:textColor="#000000"
android:textStyle="bold"
android:textSize="50sp"/>
</FrameLayout>
