Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to properly combine NavigationView and BottomNavigationView

I need to use both elements and this is what I have at the moment:

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.widget.DrawerLayout xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:openDrawer="start">

        <android.support.design.widget.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer" />

    </android.support.v4.widget.DrawerLayout>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@color/colorAccent"
        app:menu="@menu/menu_bottom" />
</RelativeLayout>

My problem here is that the BottomNavigationView is in front of the NavigationView, which should not be the case (I'm talking about the y-index). I also tried using a CoordinatorLayout instead, but then the BottomNavigationView is stuck at the display's top.

like image 867
4ndro1d Avatar asked Sep 07 '25 02:09

4ndro1d


1 Answers

I would simply use DrawerLayout as the root element and inside the DrawerLayout you can put a layout for containing the main screen and a NavigationView for the menu. After you can put the BottomNavigationView into the main layout.

<android.support.v4.widget.DrawerLayout xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include layout="@layout/maincontent"/>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>    

maincontent.xml

<FrameLayout..>
...
<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="@color/colorAccent"
    app:menu="@menu/menu_bottom" />
</FrameLayout>    
like image 77
aborocz Avatar answered Sep 08 '25 23:09

aborocz