AppBarLayout is not on the top of the screen

Issue

My issue is, that AppBarLayout, together with toolbar is appearing not on top of the screen, thus blocking the view of the included content. It can be seen in the image. I am sure I am just missing something here.

enter image description here

Also, here is the xml code

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

</android.support.design.widget.AppBarLayout>

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

EDIT: with my theme set to NoActionBar

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

it looks like this:

enter image description here

Solution

In res/values/styles set your style to NoActionBar theme, like:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

Now, you should lose your regular ActionBar and you can work with your toolbar.

EDIT: What OP tried to acomplish was position included layout below AppBar layout in CoordinatorLayout. That’s accomplished by adding app:layout_behavior="@string/appbar_scrolling_view_behavior" to include layout.

Answered By – JoKr

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published