4 Sliding tabs instead of 2

Question

I'm making an app that needs to have 4 Sliding tabs. I found this tutorial:http://www.android4devs.com/2015/01/how-to-make-material-design-sliding-tabs.html?m=1 which I followed and it worked great, but it only shows how to do it with 2 tabs... Somebody else asked this in the comments, and it was replied to saying something that gave me a lot of errors. How do I get this to work with 4 tabs instead of two?

Answer 1

1) In MainActivity:

On line 20, adjust

int Numboftabs =2;

To the correct amount of tabs desired.

2) Repeat step 5 & 6 from the tutorial, but instead of making Tab1 & Tab2, make Tab3/4, ...

Basically you'll need to add a java class file + layout file for every Tab. So here we go:

Make a tab_X.xml (X is the number/name) with the following contents

<?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:textAppearance="?android:attr/textAppearanceMedium"
    android:text="You Are In Tab X"
    android:id="@+id/textView"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true" />
 </RelativeLayout>

Make a java class TabX (replace X with the number of tab, or just replace with name)

package com.android4devs.slidingtab;

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

public class TabX extends Fragment {

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

3) Edit the ViewPagerAdapter class

For example or 3 tabs instead of 2, change the following

//This method return the fragment for the every position in the View Pager
@Override
public Fragment getItem(int position) {

    if(position == 0) // if the position is 0 we are returning the First tab
    {
        Tab1 tab1 = new Tab1();
        return tab1;
    }
    else             // As we are having 2 tabs if the position is now 0 it must be 1 so we are returning second tab
    {
        Tab2 tab2 = new Tab2();
        return tab2;
    }
}

To

//This method return the fragment for the every position in the View Pager
@Override
public Fragment getItem(int position) {

    if(position == 0) // if the position is 0 we are returning the First tab
    {
        Tab1 tab1 = new Tab1();
        return tab1;
    }
    else if(position == 1)
    {
        Tab2 tab2 = new Tab2();
        return tab2;
    }
    else if(position == 2)
    {
        Tab3 tab3 = new Tab3();
        return tab3;
    }
    else if { .... } // add more as desired.
    // but make sure that you use "else" instead of "else if" for the last tab.
}

Everything should be working after you made these changes. I want to mention that the code provided/edited is from the tutorial in OP's question.