Search code examples
androidkotlinbackgroundbottomnavigationviewandroid-bottomnavigationview

Android Kotlin; Why is it showing white background from Bottomnavigationview despite of setting background transparent?


The problem is that it is showing a white background in the bottomnavigationview, but I want it to have transparent. Why is it doing this?

So looks my android app :

enter image description here

Here is my code:

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:itemRippleColor="#00931E30"
        android:outlineAmbientShadowColor="#00931E30"
        android:outlineSpotShadowColor="#00931E30"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0"
        app:menu="@menu/bottom_menu"
        tools:visibility="visible">

I have also tried setting the background of the bottomnavigationview with this:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="@android:color/transparent" />
</shape>

as well as through programming:

 bottomNavigationView.background = ColorDrawable(Color.TRANSPARENT)
 bottomNavigationView.itemBackgroundResource = R.drawable.transparent

I don't know where the issue is and would be grateful if anyone knows the solution.

The entire XML of the activity looks so:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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.MainActivity">

    <ImageView
        android:id="@+id/imgBackground"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="centerInside"
        android:src="@drawable/ic_launcher_track"
        tools:ignore="MissingConstraints" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:itemRippleColor="#AD931E30"
        android:background="#028C8C8C"
        android:outlineAmbientShadowColor="#00931E30"
        android:elevation="10dp"
        android:layout_alignParentBottom= "true"
        android:visibility="visible"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintVertical_bias="1.0"
        app:menu="@menu/bottom_menu"
        tools:visibility="visible"
        >



        <com.google.android.material.tabs.TabItem
            android:background="#00424242"
            android:id="@+id/go_to_home"
            android:layout_width="100dp"
            android:layout_height="70dp"
            android:onClick="goToHome"
            android:text="schmutz">

        </com.google.android.material.tabs.TabItem>

        <com.google.android.material.tabs.TabItem
            android:id="@+id/go_to_dash"
            android:layout_width="100dp"
            android:layout_height="70dp"
            android:layout_marginLeft="100dp"
            android:onClick="goToDash"
            android:text="schmutz" />

        <com.google.android.material.tabs.TabItem
            android:id="@+id/go_to_not"
            android:layout_width="100dp"
            android:layout_height="70dp"
            android:layout_marginLeft="180dp"
            android:onClick="goToNotification"
            android:text="schmutz" />

        <com.google.android.material.tabs.TabItem
            android:id="@+id/go_to_profile"
            android:layout_width="100dp"
            android:layout_height="70dp"
            android:layout_marginLeft="260dp"
            android:text="schmutz"
            android:onClick="goToProfile"/>

    </com.google.android.material.bottomnavigation.BottomNavigationView>

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tab_tablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabIndicatorColor="#00B8B8B8"
        app:tabIndicatorHeight="3dp"
        app:tabMode="fixed"
        tools:ignore="MissingConstraints" />

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="675dp"
        android:layout_alignParentBottom="true"
        android:layout_marginTop="?attr/actionBarSize"
        android:layout_marginBottom="?attr/actionBarSize"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintVertical_bias="1.0" />

    <fragment
        android:id="@+id/fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="1000dp"
        android:layout_marginBottom="56dp"
        app:defaultNavHost="true"
        app:flow_horizontalAlign="center"
        app:flow_verticalAlign="center"
        app:navGraph="@navigation/my_nav"
        tools:layout_editor_absoluteX="-27dp"
        tools:layout_editor_absoluteY="278dp">
    </fragment>
</RelativeLayout>

Solution

  • try this code;

    BottomNavigationView navView = findViewById(R.id.nav_view);
    navView.setBackgroundColor(ContextCompat.getColor(getApplicationContext(), android.R.color.transparent));