在工具欄下顯示內容

Question

你好，我試圖簡單地把我的內容放在工具欄下面，但是當我運行我的應用程序時，一些內容隱藏在它後面，當它應該在它下面時。

我已經閱讀了關於使用框架佈局試圖分開它，但我有一點卡住了。我目前正在使用該軟件提供的基本android studio導航抽屜模板，並且想知道我必須做些什麼改變。

我的協調佈局

<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> 

我需要什麼樣的變化做什麼呢？

Answer 1

許多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> 

Answer 2

app:layout_behavior="@string/appbar_scrolling_view_behavior" 

將此代碼添加到您的幀標籤

Answer 3

由於@布賴恩晃和@Karakuri使用layout_behaviour物業說：

app:layout_behavior="@string/appbar_scrolling_view_behavior" 

似乎是一個非常好的解決方案。即使您目前沒有任何動畫，但您計劃將來也可以繼續使用CoordinatorLayout和AppBarLayout，以防將來添加動畫。

---

屬性似乎做的一般從我的理解，是計算整個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>