Pager Sliding Tab Strip with Buttons and Edit Text for appropriate tab

Question

I referred this Pager Sliding Tab Strip.I am getting the output as it is.

But my only problem is I didn't know how to add the button for categories tab,Textview for Home tab,Edittext for Top Paid tab.

There I seen only two layout :

activity_main.xml:

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

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="48dip"
        android:background="@drawable/background_tabs" />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/colors"
        android:layout_below="@+id/tabs"
        tools:context=".MainActivity" />

    <LinearLayout
        android:id="@+id/colors"
        android:layout_width="match_parent"
        android:layout_height="48dip"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="8dip"
        android:layout_marginLeft="4dip"
        android:layout_marginRight="4dip"
        android:orientation="horizontal" >

    </LinearLayout>

   <Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/colors"
    android:layout_alignTop="@+id/pager"
    android:layout_marginLeft="58dp"
    android:layout_marginTop="46dp"
    android:text="Button" />


</RelativeLayout>

fragment_quick_contact.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="wrap_content" >

    <ImageView
        android:id="@+id/image"
        android:layout_width="match_parent"
        android:layout_height="170dip"
        android:scaleType="centerCrop"
        android:src="@drawable/contact" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/image"
        android:background="#77000000"
        android:paddingBottom="14dip"
        android:paddingLeft="8dip"
        android:paddingTop="14dip"
        android:text="Quick Contact"
        android:textColor="#FFFFFFFF"
        android:textSize="18sp" />

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="62dip"
        android:layout_below="@+id/image"
        android:background="@drawable/background_tabs_diagonal"
        app:pstsDividerColor="#00000000"
        app:pstsIndicatorColor="#FF33B5E6"
        app:pstsTabPaddingLeftRight="14dip"  
        app:pstsUnderlineColor="#FF33B5E6" />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="96dip"
        android:layout_below="@+id/tabs" />

</RelativeLayout>

MainActivity,java:

public class MyPagerAdapter extends FragmentPagerAdapter {

    private final String[] TITLES = { "Categories", "Home","Profile" };

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

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

    @Override
    public int getCount() {
        return TITLES.length;
    }

        return SuperAwesomeCardFragment.newInstance(position);
    }

}

If I add a button in activity_main.xml. It just add the button not only in Category tab.But, it added the button in all tabs.

I need to add the button in category tab.Then I have to add the edit text in Home tab.is it possible to do this in Pager Sliding Tab Strip.

Edit: There was no xml layout separately for category tab and home tab.That's why I am getting confused with this.

Answer 1

The user @Calvinfly suggested me,so I can found out the answer.To be more Clear:

In my MainActivity.java inside MyPagerAdapter I set the position like this

    @Override
    public Fragment getItem(int position) {

        switch (position) {
        case 0:
            return new Category();
        case 1:
            return new Home();

        case 2:
            return new TopPaid();

        }  

        return SuperAwesomeCardFragment.newInstance(position);
    }

Answer 2

you should add the button on Category Tab fragment layout, not activity_main layout