Search code examples
androidandroid-layoutnavigationbarandroid-layout-editor

2 Navigationbars (top and bottom) in android


imag

So I need two navigationbars (one at the bottom and one on the top). But as you can already see on the picture above there is no room for the navigation bar on the bottom because of the map (the navigation bar is below the screen). How can I show the bottom navigation bar WITHOUT setting hardcoding width and heights of the map.

This is my xml file:

<?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:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Main3Activity">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_info"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="?android:attr/windowBackground"
        app:menu="@menu/bottom_nav_menu" />

    <fragment
        android:id="@+id/map2"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MapsActivity"></fragment>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_viedw"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="?android:attr/windowBackground"
        app:menu="@menu/bottom_nav_menu" />

</LinearLayout>


Solution

  • As you are using ConstraintLayout, there's no need to use LinearLayout as ConstraintLayout is more efficient and is meant to keep the layout hierarchy flat. You can try as shown below:

    <?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:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".Main3Activity">
    
        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/nav_info"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="?android:attr/windowBackground"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:menu="@menu/bottom_nav_menu" />
    
        <fragment
            android:id="@+id/map2"
            android:name="com.google.android.gms.maps.SupportMapFragment"
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintBottom_toTopOf="@+id/nav_viedw"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/nav_info"
            tools:context=".MapsActivity" />
    
        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/nav_viedw"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="?android:attr/windowBackground"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="@+id/nav_info"
            app:menu="@menu/bottom_nav_menu" />
    
    
    </androidx.constraintlayout.widget.ConstraintLayout>