Controls behind statusbar with ViewPager & fitsSystemWindow

问题

I have a ViewPager with Fragments which contain fullscreen images and some bottom aligned controls.

I want to make sure the controls do not disappear behind the translucent navigation bar with fitsSystemWindow but I can't seem to make it work...

It does work when I use the same xml without the ViewPager so it seems the ViewPager "breaks" the ability to use fitsSystemWindow.

Code I have for the activity:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</FrameLayout>

This is what I have for the fragment:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="#000"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/initial_background_image"
        android:scaleType="centerCrop"/>

    <RelativeLayout
        android:id="@+id/buttons_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/button_icon_offset"
        android:layout_marginBottom="@dimen/button_icon_offset"
        android:layout_marginRight="@dimen/button_icon_offset"
        android:fitsSystemWindows="true"
        android:layout_gravity="bottom">

        <Button
            android:id="@+id/info_button"
            style="@style/button_icon"
            android:layout_gravity="left|bottom"
            android:background="@drawable/button_info"
            android:textAlignment="center"/>

        <Button
            android:id="@+id/share_button"
            style="@style/button_icon"
            android:layout_alignTop="@id/info_button"
            android:layout_marginRight="@dimen/button_icon_divider"
            android:layout_toLeftOf="@+id/like_button"
            android:background="@drawable/button_share"/>

        <Button
            android:id="@+id/like_button"
            style="@style/button_icon"
            android:layout_alignParentRight="true"
            android:background="@drawable/button_like"/>
    </RelativeLayout>
</FrameLayout>

So this is what I end up with... But I want the buttons to appear above the navigation bar.

回答1:

First, see this answer concerning WindowInsets. Then you'll understand, that your root layout - FrameLayout, won't ever dispatch WindowInsets to ViewPager.

Use ViewCompat.setOnApplyWindowInsetsListener() API to dispatch WindowInsets to ViewPager and make your ViewPager fit window insets, i.e. apply android:fitsSystemWindows="true" to both ViewPager and it's parent.

回答2:

Just change/remove this in your style.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    ...    
    <item name="android:windowDrawsSystemBarBackgrounds">false</item>
    ...
</style>

if still not working? and you're using NestedScrollView then add "android:clipToPadding"

<android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/light_green"
            android:clipToPadding="false" <--add this
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

回答3:

You could add margin bottom to the buttons to place them above the nav bar.

android:layout_marginBottom="?attr/actionBarSize"

来源：https://stackoverflow.com/questions/43847905/controls-behind-statusbar-with-viewpager-fitssystemwindow