Android - PageViewer View stuck on screen

Question

i'm trying to get this pageviewer with fragments to work however i'm stumbled on a problem where the view stays on screen on swipe. Ideally, i'd want it to only be on a particular layout yet i'm not too sure why it "carries over" to other screens (it also stays on screen during the transition between fragments).

Any feedback will be appreciated!

Link to Imgur Screenshots

Main:

private void initUI()
{
    // ---------Page Viewer with Fragments -----------

    viewPager = (ViewPager) findViewById(R.id.pager);
    actionBar = getSupportActionBar();
    mAdapter = new TabsPagerAdapter(getSupportFragmentManager());

    viewPager.setAdapter(mAdapter);
    actionBar.setHomeButtonEnabled(false);
    actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

    // Adding Tabs
    for (String tab_name : tabs) {
        actionBar.addTab(actionBar.newTab().setText(tab_name)
                .setTabListener(this));
    }


    viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

        @Override
        public void onPageSelected(int position) {
            // on changing the page
            // make respected tab selected
            actionBar.setSelectedNavigationItem(position);
        }

        @Override
        public void onPageScrolled(int arg0, float arg1, int arg2) {
        }

        @Override
        public void onPageScrollStateChanged(int arg0) {
        }
    });
}


    @Override
    public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
        viewPager.setCurrentItem(tab.getPosition());
    }

    @Override
    public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {

    }

    @Override
    public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {

    }
}

---

Adapter:

public class TabsPagerAdapter extends FragmentPagerAdapter {

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

@Override
public Fragment getItem(int index) {

    switch (index) {
        case 0:
            // Main Frag
            return new Fragment1();
        case 1:
            // Second Frag
            return new Fragment2();
        case 2:
            // Third Frag
            return new Fragment3();
    }

    return null;
}

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

---

Fragment classes are basically this:

public class Fragment1 extends Fragment {

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {

    View rootView = inflater.inflate(R.layout.main, container, false);

    return rootView;
}
}

Main Layout:

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

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

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

</RelativeLayout>

Answer 1

The EditText is in the main layout, the same layout that the ViewPager is in. It should be inflated within the tab. You'll need to create a separate layout for each tab.

Main layout

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

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

</RelativeLayout>

layout_fragment_1.xml

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

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</RelativeLayout>

Then you need to inflate the new layout in fragment 1.

View rootView = inflater.inflate(R.layout.layout_fragment_1, container, false);

return rootView;