Search code examples
androidandroid-framelayoutdrawerlayoutandroid-bottomnavigationview

android - Implement DrawerLayout with BottomNavigationView and FrameLayout


Im currently creating an app, which has a BottomNavigationView and a FrameLayout for fragments. I would like to implement a DrawerLayout or Hamburger Menu too, however, as said in this video

A DrawerLayout should only contain two views, one for the ActivityFragment and one for the NavigationView

Is it possible then to implement the DrawerLayout while having the BottomNavigationView? If yes, how?

This is my activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <FrameLayout
        android:id="@+id/framelayoutFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/bottomNavigationView"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        app:backgroundTint="@color/colorSecondaryDark"
        app:elevation="0dp"
        app:itemIconTint="@drawable/selector"
        app:itemTextColor="@drawable/selector"
        app:labelVisibilityMode="selected"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/menu_bottomnavgation" />

</androidx.constraintlayout.widget.ConstraintLayout>

Solution

  • Yes, you can implement the DrawerLayout while having the BottomNavigationView, try this :

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.drawerlayout.widget.DrawerLayout 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"
        tools:openDrawer="start"
        android:id="@+id/drawer_layout">
    
        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <androidx.appcompat.widget.Toolbar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/tool_bar"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />
    
            <FrameLayout
                android:id="@+id/frame"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                app:layout_constraintBottom_toTopOf="@id/btm_nav"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@id/tool_bar" />
    
        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/btm_nav"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:menu="@menu/nav"
            android:background="#FFFFFF"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            />
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    
        <com.google.android.material.navigation.NavigationView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/nav_dr"
            app:menu="@menu/nav"
            android:layout_gravity="start"/>
    </androidx.drawerlayout.widget.DrawerLayout>