Fragment transaction from main activity doesn't work

Question

I'm writing my first android app using fragments but I can't figure out why it doesn't change view from main activity to fragment. This is my mainActivity.java:

public class MainActivity extends AppCompatActivity {

Button fragment1_BTN, fragment2_BTN;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    fragment1_BTN = findViewById(R.id.frag1_btn);
    fragment2_BTN = findViewById(R.id.frag2_btn);

    fragment1_BTN.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            replaceFragment(new Frag1());
        }
    });

    fragment2_BTN.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            replaceFragment(new Frag2());
        }
    });
}

private void replaceFragment(Fragment fragment){
    FragmentManager fragmentManager = getSupportFragmentManager();
    FragmentTransaction transaction = fragmentManager.beginTransaction();
    transaction.replace(R.id.frameLayout, fragment);
    transaction.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
    transaction.commit();
}}

This is my activity_main.xml:

<?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=".MainActivity">

<FrameLayout
    android:id="@+id/frameLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:gravity="center">

    <Button
        android:id="@+id/therapists_btn"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:backgroundTint="@color/teal_700"
        android:text="button 1"
        android:layout_marginRight="10dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/patients_btn" />

    <Button
        android:id="@+id/patients_btn"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_marginLeft="10dp"
        android:backgroundTint="@color/teal_700"
        android:text="button 2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/therapists_btn"
        app:layout_constraintTop_toTopOf="parent" />

</LinearLayout>
</FrameLayout> </androidx.constraintlayout.widget.ConstraintLayout>

The problem is that when I click on button 1 I see the view of first fragment and also of main activity. How can I see only the fragment view?

Answer 1

your frameLayout container for Fragments is placed before LinearLayout, Fragments View is loaded into it and is visible, but also rest of Views is drawn after that (as order in XML) on top of it. just setVisibility(View.GONE) for this LinearLayout when you are loading Fragment (set for it some id and use findViewById as for buttons). another approach would be to put your LinearLayout inside container - you are using replace method so Fragment will remove your buttons, but in that case these are gone forever then and you don't have an easy option for bringing them back (with your current code - only whole Activity restart)

it would be way better (by design) if your Activity wouldn't have these buttons at all, only container, and on start would check if container has anything loaded (e.g. getChildCount()==0), if not then load some initial Fragment for preventing displaying empty Activity