Search code examples
androidandroidxbottomnavigationview

Make a Bottom Navigation Views background transparent


so I've added a bottom navigation view in my app but there,s a problem. I want my bottom navigation view's background to be transparent(it is currently black) i.e i want it to show the part of the background of the Relative layout (that contains the btmnav )that its covering .I've read somewhere that it does that by default and all i need to do is give the relative layout a background and it'll work...but when i do that, the background of the bottom navigation view remains black.

menu resource file:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:id="@+id/live"
    android:icon="@drawable/ic_live_tv_black_24dp"
    android:title="Live"/>

<item
    android:id="@+id/squad"
    android:icon="@drawable/ic_team_squad_black_24dp"
    android:title="Squad"/>

<item
    android:id="@+id/schedule"
    android:icon="@drawable/ic_schedule_black_24dp"
    android:title="Schedule"/>
<item
    android:id="@+id/feed"
    android:icon="@drawable/ic_rss_feed_black_24dp"
    android:title="Feed"/>

 </menu>

code in layout file

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


    >



     <com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/btmnav"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    app:itemTextColor="#fff3CD70"
    app:itemIconTint="#fff3CD70"


    app:menu="@menu/bottom_navigation" />



    </RelativeLayout>

Before adding the background

After adding the background

What i want


Solution

  • Set the background of 'btmnav' to a color that has a transparent alpha channel.

    Add to your BottonNavigationView android:background="#00ffffff"

    You can also set a theme and set it there:

    android:theme="@style/NavigationTheme"
    

    Styles.xml

    <style name="NavigationTheme" parent="AppTheme">
        <item name="itemIconTint">@android:color/white</item>
        <item name="itemTextColor">@android:color/white</item>
        <item name="android:background">#00ffffff</item>
    </style>