ViewPager重叠AppBarLayout

Question

我正在尝试为包含N Activity的{​​{1}}设置布局。在布局中我使用了Fragments和ViewPager，我遇到的问题是AppBarLayout与ViewPager重叠，如屏幕截图所示：

这是我的AppBarLayout

activity_main.xml

这是我的<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout 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/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:openDrawer="start"> <include layout="@layout/app_bar_main" android:layout_width="match_parent" android:layout_height="match_parent" /> <android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:fitsSystemWindows="true" app:headerLayout="@layout/nav_header_main" app:menu="@menu/activity_main_drawer" /> <android.support.v4.view.ViewPager android:layout_width="match_parent" android:layout_height="wrap_content" app:layout_behavior="@string/appbar_scrolling_view_behavior" android:id="@+id/containter"> </android.support.v4.view.ViewPager> ，其中包含app_bar_main.xml

AppBarLayout

如何防止这些元素重叠？

Answer 1

@Signo，

通过一些布局调整可以解决您的问题。

试试这个：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

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

        <include
            layout="@layout/app_bar_main"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <android.support.v4.view.ViewPager
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:id="@+id/containter" />
        </android.support.v4.view.DrawerLayout>

    </LinearLayout>

Answer 2

首先尝试在视图上方添加一个类似于：

的viewGroup

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
 //... your views here
 </RelativeLayout>

您应该将appBar的高度更改为wrap_content并添加一些ID

<include
            android:id="@+id/app_bar_id"
            layout="@layout/app_bar_main"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

然后在您的视图分页器上定义layout_below属性，如下所示：

  <android.support.v4.view.ViewPager
            android:id="@+id/containter"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/app_bar_id"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"/>