浮动操作按钮在片段中重复

Question

I had a FAB in one of my activities, and everything was good. Then I added a Fragment in that activity and I moved my FAB inside that Fragment . It seemed to be alright but when I tried to show a Snack Bar , I saw that there are two Floating Action Button s instead of one in that area, One of them was pushed up by Snack Bar and the other one didn't move. In XML, I just have one FAB but when I run my app, there are two FABs but I can't see both unless I show an Snack Bar .

What I exactly want is to find the bug and remove the extra FAB.

Activity XML:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    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"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fl_main_root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/cl_main_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?android:attr/actionBarSize">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/tb_main_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:background="@color/colorPrimary"
            android:minHeight="?android:attr/actionBarSize"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            local:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

        <TextView
            android:id="@+id/tv_main_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginBottom="8dp"
            android:textColor="@color/white"
            android:textSize="18sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

    </androidx.constraintlayout.widget.ConstraintLayout>

    <fragment
        android:id="@+id/f_main_memory"
        android:name="ir.ali_kh_y.project.fragment.MemoryFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="?android:attr/actionBarSize"
        android:layout_marginBottom="56dp"/>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bnv_main_nav"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_gravity="bottom"
        android:background="@color/colorPrimary"
        app:itemIconTint="@color/bottom_nav_item_color_state"
        app:itemTextColor="@color/bottom_nav_item_color_state"
        app:labelVisibilityMode="unlabeled"
        app:menu="@menu/bottom_nav"/>
</FrameLayout>

Fragment XML:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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:id="@+id/cl_memory_root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".fragment.MemoryFragment">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/cl_memory_memories"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rv_memory_memories"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="#ECEFF1"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

        <ImageView
            android:id="@+id/iv_memory_smile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/empty_list"/>

        <TextView
            android:id="@+id/tv_memory_empty"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="8dp"
            android:text="---"
            android:textAlignment="center"
            android:textColor="@color/emptyListContent"
            android:textSize="30dp"
            app:layout_constraintBottom_toTopOf="@+id/iv_memory_smile"
            app:layout_constraintHorizontal_bias="0.504"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>
    </androidx.constraintlayout.widget.ConstraintLayout>

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab_memory_write"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/fab_margin"
        android:clickable="true"
        android:focusable="true"
        app:fabSize="normal"
        app:layout_anchor="@+id/cl_memory_memories"
        app:layout_anchorGravity="left|bottom"
        app:rippleColor="@color/gray"
        app:srcCompat="@drawable/ic_write"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

The code I use in Activity to show Snack Bar :

val snackBar = Snackbar.make(cl_memory_root, "", Snackbar.LENGTH_INDEFINITE)
ViewCompat.setLayoutDirection(snackBar.view, ViewCompat.LAYOUT_DIRECTION_RTL)
snackBar.setAction("") {
   //...
}
snackBar.show()

Answer 1

As Mike M said, I was loading two Fragment s, one in my code and one in the XML layout. So I removed the one in my code and the problem was solved.

Answer 2

<androidx.coordinatorlayout.widget.CoordinatorLayout
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:id="@+id/cl_memory_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff" 
android:clickable="true"
tools:context=".fragment.MemoryFragment">

make background as white and make it clickable in the fragment and voila..