Why bottom navigation fragment become black in color and not working in android?

I don't know why fragment is not working. I am creating bottom navigation. My code is here. Please solve my problem.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/draw">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bot_nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="@menu/bottom_navigation_menu" />

This is the fragment part. Please solve my problem. The app is not working.
This is the fragment part. Please solve my problem. The app is not working.

    <fragment
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="@id/bot_nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/bot_navigation"
/>
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="MissingConstraints">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="false"
app:popupTheme="@style/AppTheme.AppBarOverlay." />
</com.google.android.material.appbar.AppBarLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

This is the bot_navigation.xml code. Please check it also.

<?xml version="1.0" encoding="utf-8"?>
<navigation 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/bot_navigation"
tools:ignore="UnusedNavigation">
<fragment
android:id="@+id/navigation_feed"
android:name="com.example.reducestress.ui.feed.feed"
android:label="@string/title_feed"
tools:layout="@layout/feed_fragment" />
<fragment
android:id="@+id/navigation_diary"
android:name="com.example.reducestress.ui.diary.diary"
android:label="@string/title_diary"
tools:layout="@layout/diary_fragment" />
<fragment
android:id="@+id/navigation_profile"
android:name="com.example.reducestress.ui.profile.profile"
android:label="@string/title_profile"
tools:layout="@layout/profile_fragment" />
</navigation>

With the new JetPack Navigation, you need to add the fragments you want to show to your NavGraph. You can find your NavGraph under the navigation directory from the res directory. In your case, your NavGraph is bot_navigation.xml.

If you don't see the fragment you want to show, once you are inside your NavGraph, there will be this icon

Click it and you will see a list of the available fragments and activities. Just click the one you want.

If your fragments are already placed, make sure the id's match with the id's in your bottom_navigation_menu.xml. Also, make sure that in your host activity you are setting up the Navigation with the right NavController and with the right BottomNavigationView.

Let me know if it helped.

try to change <fragment to <FrameLayout its work for me when i use FrameLayout
and turn black when i change it to <fragment

You forgot in navigation app: startDestination = "@ id / navigation_feed instead of navigation_feed put the fragment that should be launched first and i think you should remove unusedNavigation

The code that should look like:

<?xml version="1.0" encoding="utf-8"?>
<navigation 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/bot_navigation"
app:startDestination="@id/navigation_feed">
...
</navigation>