Content behind CoordinatorLayout AppBarLayout

Question

I was creating a settings activity/layout for my app. I have a CoordinatorLayout with an AppBarLayout and Toolbar, then beneath that it includes content_settings.xml. When the content loads the .xml file is behind the app bar.

I'm using this same setup to load the main content and it works fine, but for some reason isn't rendering correctly within the Settings section.

activity_settings.xml

<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_setting" />

The content_settings.xml is just a FrameLayout that is replaced by a PreferenceFragment

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/settings_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

score 73 · Accepted Answer · answered Oct 20 '15 at 06:21

73

add this to your Recyclerview :

app:layout_behavior="@string/appbar_scrolling_view_behavior"

answered Oct 20 '15 at 06:21

Shashank Kumar

1,210
10
18

2

Thanks that worked, I didn't have a Recyclerview, but I added it to the FrameLayout, and it worked. I updated my question. – ENG618 Oct 20 '15 at 06:47
7

This does move things lower so that it isn't going under the toolbar anymore. However when scrolling down, the preferences on the bottom aren't displayed anymore because the FrameLayout (or whatever you use to hold the PreferenceFragment) is behind the black on-screen button bar (back, home, etc). At least, that was what happened for me. Haven't found a good solution yet. – FrozenCow Feb 27 '16 at 20:46

score 4 · Answer 2 · answered Mar 02 '17 at 22:57

In my case the view under the toolbar wasn't scrollable so even though the accepted answer did stop the overlapping it pushed the content down by the height of the toolbar, pushing elements offscreen. The solution in this case was to also remove the

app:layout_scrollFlags

from the Toolbar that I was including/sharing with other layouts that had scrolling views.

Content behind CoordinatorLayout AppBarLayout

2 Answers2

Linked

Related