显示工具栏下的内容

您好,我试图简单地把我的内容下面的工具栏,但在我运行我的应用程序的时候,一些内容隐藏在它后面,当它应该在下面。

我已经阅读了关于使用框架布局来尝试分离它,但我有一点卡住了。 我目前正在使用该软件提供的基本的Android工作室导航抽屉模板,并想知道我必须做出什么样的改变。

我的协调员布局

<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> <FrameLayout android:id="@+id/fragment_container" android:layout_width="match_parent" android:layout_height="match_parent"/> </android.support.design.widget.CoordinatorLayout> 

我的抽屉布局

 <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.widget.DrawerLayout> 

我需要做些什么改变?

Solutions Collecting From Web of "显示工具栏下的内容"

许多ViewGroups允许他们的孩子重叠。 这些包括FrameLayout,RelativeLayout,CoordinatorLayout和DrawerLayout。 一个不允许孩子重叠的是LinearLayout。

你的问题的答案真的取决于最终结果应该是什么。 如果您只是想要一个始终在屏幕上的工具栏,并且其下面有一些内容,那么您根本不需要CoordinatorLayout和AppBarLayout,您可以使用带有两个子项的垂直LinearLayout:

 <LinearLayout android:orientation="vertical" ...> <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" ... /> <FrameLayout android:id="@+id/fragment_container" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" ... /> </LinearLayout> 

注意FrameLayout的布局属性。

如果你想做滚动内容的工具栏滚动和滚动的花哨的东西,那么你需要一个AppBarLayout,你需要给你的内容区域一个特殊的属性,像这样:

 <android.support.design.widget.CoordinatorLayout> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" ... > <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_scrollFlags="scroll" ... /> </android.support.design.widget.AppBarLayout> <FrameLayout android:id="@+id/fragment_container" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" ... /> </android.support.design.widget.CoordinatorLayout> 
 app:layout_behavior="@string/appbar_scrolling_view_behavior" 

将此代码添加到您的框架标记

正如@Brian Hoang和@Karakuri所说的使用layout_behaviour属性:

 app:layout_behavior="@string/appbar_scrolling_view_behavior" 

似乎是一个非常好的解决scheme。 即使您目前没有任何animation,但您打算将来也可以保留CoordinatorLayout和AppBarLayout,以防将来添加animation。


一般来说,我的理解属性似乎做的是计算整个AppBarLayout UI组件的高度。 无论高度如何,使用layout_behaviour属性和@ string / appbar_scrolling_view_behaviour的UI组件都将自动显示在AppBarLayout下方。

通过这种方式,不需要硬编码应该在AppBarLayout下的UI中的任何上边距。

在下面的代码中, include_app_bar_with_tabs_layout(AppBarLayout)具有200dp的固定高度(可以是wrap_content或其他任何东西)。 然后,包含屏幕内容的RelativeLayout使用layout_behaviour属性。


看看下面的代码和UI图像:

 <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <include layout="@layout/include_app_bar_with_tabs_layout" android:layout_width="match_parent" <!-- this can be anything, even wrap_content --> android:layout_height="200dp" /> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/Green" <!-- this tells it to be below the include_app_bar_with_tabs_layout (AppBarLayout) --> app:layout_behavior="@string/appbar_scrolling_view_behavior"> <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@+id/adView" /> <com.google.android.gms.ads.AdView android:id="@id/adView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" app:adSize="BANNER" app:adUnitId="@string/banner_ad_unit_id" tools:background="@color/green" tools:layout_height="50dp" /> </RelativeLayout> </android.support.design.widget.CoordinatorLayout> 

在这里输入图像说明