从一个片段导航到另一个片段时，第二个片段重叠

Question

On the click of a button I want to navigate from one fragment to another. The problem is that when I press the button the second fragment overlaps the other. I searched for some answers but it doesn't seem to word in my case. I tried adding a background color but it still overlaps. So after I click the button the following thing happens:

Here are my codes:

I gave the first fragment an ID:

    <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
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=".ui.home.HomeFragment"
android:background="#FFF">

<FrameLayout
    android:id="@+id/fragment_container"
    android:layout_width="match_parent"
    android:layout_height="1dip"
    app:layout_constraintBottom_toTopOf="parent"
    android:background="#FFF"/>

The ID of the button is: nextFragment

The code inside the class of the first fragment is:

        nextFragment = v.findViewById(R.id.nextFragment);
        nextFragment.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v){
            Fragment fragment = new NotificationsFragment();
            FragmentManager fragmentManager = getParentFragmentManager();
            fragmentManager.beginTransaction()
                    .replace(R.id.fragment_container, fragment)
                    .addToBackStack(null)
                    .commit();
        }
    });

Hope i gave enough information, if not don't hesitate to ask for more. Thanks in advance.

Answer 1

The problem is that you are using fragment_container as the first fragment instead of the container for your first fragment.

In your MainActivity you have to load your first fragment inside that container. Not use it as a fragment.

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    if(savedInstanceState == null) {
        Fragment firstFragment = new YourFirstFragment();
        FragmentManager manager = getFragmentManager();
        FragmentTransaction transaction = manager.beginTransaction();
        transaction.replace(R.id.fragment_container, firstFragment);
        transaction.commit();
    }
}

After that, in your first fragment, when you will replace the fragment it will work great.

Answer 2

So the solution was simple.. I gave an Id to a framelayout inside the first fragment instead of to the root layout. Now the next thing is that the tab on the bottom also has to change when the button is pressed.