How to replace an Android fragment with another fragment inside a ViewPager?

Question

I have a view pager consisting of 4 tabs. Each tab holds its own fragment.

How would I be able to use fragment transaction to replace the fragment in tab 3 with a new fragment?

I've tried a lot of things, but I have not been able to come up with a solution at all. I've tried looking around on google and stackoverflow, but with no success.

In other words, you want to change custom transaction effect for ViewPager. Am I right? I am sorry, I could not understand the question exactly. — Dorukhan Arslan, Sep 29 '15 at 22:30
When do you want to change the fragment? While scrolling, while looking at the fragment? — mbmc, Sep 29 '15 at 22:41
@tibo, while looking at the tab, and a button is pressed. The button calls onFragmentInteraction function which is implemented by the activity. In side the activity is where I would like the replace to happen — Ebad Saghar, Sep 29 '15 at 22:57
I thought that you want to change default transaction animation with a customized one. I misused "custom" above, I was probably in absent state. As far as I understand, you want to change fragments in ViewPager by pressing on tab buttons. Also, when you slide a fragment, you want to change selected tab as well. It is just like that? — Dorukhan Arslan, Sep 29 '15 at 23:33
@DorukhanArslan, no. This is what I want to do: I have 4 tabs. I selected tab 3. Inside of tab I have a button. I click that button, and the fragment inside of tab 3 is replaced with a new fragment, with out affecting the other tabs. — Ebad Saghar, Sep 29 '15 at 23:42
I am almost sure that there is a way to do what you ask. However, alternatively, if you switch between just two layouts, you can consider put two different contents (content 1 is the current fragment's, content 2 is the new fragment's) into two layouts on the same fragment. After that button is pressed, change visibility of current layout to gone and invisible one to visible. — Dorukhan Arslan, Sep 30 '15 at 00:07
show your codes so i can edit for the solution, if i post now it won't make sense, unless you can live with the thought process — Elltz, Sep 30 '15 at 02:50
@Elltz, I can't upload code due to legal binding (it's work). I can live with the through process — Ebad Saghar, Sep 30 '15 at 07:03
@DorukhanArslan, Could you make an answer, if I don't find any other sufficient answers, I will mark yours as so — Ebad Saghar, Sep 30 '15 at 07:03

score 1 · Accepted Answer · edited May 23 '17 at 10:27

I assume that your fragment has a button that is put in the center. By clicking on it, you can change the layout stays under of this button. The content/layout of the first fragment you mentioned should be replaced with wrapperA and the content/layout of the second one should be replaced with wrapperB. I put a simple red background for wrapperA to distinguish it with wrapperB, wrapperB is also green due to the same reason. I hope this is what you want:

public class SwitchingFragment extends Fragment {

    Button switchFragsButton;
    RelativeLayout wrapperA, wrapperB;
    View rootView;

    @Override
    public View onCreateView(LayoutInflater inflater, final ViewGroup container, Bundle savedInstanceState) {
        rootView = inflater.inflate(R.layout.layout_switch, container, false);
        wrapperA = (RelativeLayout) rootView.findViewById(R.id.wrapperA);
        wrapperB = (RelativeLayout) rootView.findViewById(R.id.wrapperB);

        switchFragsButton = (Button) rootView.findViewById(R.id.switchFragsButton);
        switchFragsButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View arg0) {
                if (wrapperB.getVisibility() == View.GONE) {
                    wrapperB.setVisibility(View.VISIBLE);
                    // There is no need to change visibility of wrapperA since it stays behind when wrapperB is visible.
                    // wrapperA.setVisibility(View.GONE);
                }
                else {
                    wrapperB.setVisibility(View.GONE);
                    // Again, there is no need.
                    // wrapperA.setVisibility(View.VISIBLE);
                }
            }
        });

        return rootView;
    }
}

The layout:

<?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"
    android:layout_gravity="center"
    android:orientation="vertical">

    <!-- The content of first fragment should be in "wrapperA". -->
    <RelativeLayout
        android:id="@+id/wrapperA"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/red"
        android:visibility="visible">

    </RelativeLayout>

    <!-- The content of second fragment should be in "wrapperB". -->
    <RelativeLayout
        android:id="@+id/wrapperB"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/green"
        android:visibility="gone">

    </RelativeLayout>

    <!-- As I said, I assume that the layout switcher button is stable
         and so it should be in front of the switching layouts. -->
    <Button
        android:id="@+id/switchFragsButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:background="@color/black"
        android:text="Switch"
        android:textSize="20sp"
        android:textStyle="bold"
        android:textColor="@color/white"/>

</RelativeLayout>

Alternatively, you can try to change the fragment directly by notifying your FragmentPagerAdapter as described in this link: Replace fragment with another fragment inside ViewPager

How to replace an Android fragment with another fragment inside a ViewPager?

1 Answers1