CODEWITHSUNDEEP
androidandroid-toolbarandroid-coordinatorlayoutandroid-appbarlayoutcoordinator-layout
Mervin Hemaraju
Mervin Hemaraju

Reputation: 2187

Android Material Toolbar appearing behind fragment

I have an app where i need a Bottom Bar as my main navigation and Toolbar for title and a settings icon. So far what i have achieved is this:

activity.xml

<?xml version="1.0" encoding="utf-8"?>

<layout 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">

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:id="@+id/Layout_Root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--
        ********************************************************
        **** This is the app bar layout which contains the
        **** main Material Toolbar.
        ********************************************************
        -->

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/Layout_AppBar_Main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        app:liftOnScroll="true">

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/Toolbar_Main"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorOnSurface"
            android:paddingStart="8dp"
            android:paddingEnd="8dp"
            app:layout_scrollFlags="scroll|enterAlways|snap" />
    </com.google.android.material.appbar.AppBarLayout>

    <fragment
        android:id="@+id/Navigation_Host"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_anchorGravity="bottom"
        app:layout_anchor="@id/Layout_AppBar_Main"
        app:defaultNavHost="true"
        app:navGraph="@navigation/navigation_main" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/Bottom_Navigation_Main"
        styleBackground="@{true}"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:visibility="visible"
        app:menu="@menu/menu_bottom_navigation_main" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

</layout>

Everything works fine except the toolbar is appearing behind the fragment. The Toolbar works normally only if i change android:layout_height="match_parent" to android:layout_height="wrap_content" in my <fragment> but i don't want this since i need my fragment to fill the screen. Can someone please help ?

Upvotes: 0

Views: 472

Answers (1)

Viatcheslav Ehrmann
Viatcheslav Ehrmann

Reputation: 746

You forgot to add app:layout_behavior="@string/appbar_scrolling_view_behavior

Do something like this.

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >

    <fragment
        android:id="@+id/Navigation_Host"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_anchorGravity="bottom"
        app:layout_anchor="@id/Layout_AppBar_Main"
        app:defaultNavHost="true"
        app:navGraph="@navigation/navigation_main" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/Bottom_Navigation_Main"
        styleBackground="@{true}"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:visibility="visible"
        app:menu="@menu/menu_bottom_navigation_main" />
</FrameLayout>

Upvotes: 0

Related Questions