工具栏填满整个屏幕

Question

我对抽屉布局和片段的使用还不熟悉。

我使用了创建带有DrawerLayout的活动的tutorial。它在getActionBar()上给了我一个空指针异常，因此我在活动主界面中添加了工具栏并改用getSupportActionBar()。

现在它看起来像是工具栏填满整个屏幕，因为标题位于屏幕中央，而工具栏的背景也覆盖整个屏幕。这是xml代码：

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- Toolbar -->
    <android.support.v7.widget.Toolbar
        android:id="@+id/my_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:elevation="4dp"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
    <!-- The main content view -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#FFFFFF" />
    <!-- The navigation drawer -->
    <ListView
        android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#FFFFFF"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp" />
</android.support.v4.widget.DrawerLayout>

我尝试将layout_height替换为56dp，也尝试创建一个带有工具栏的单独布局文件并将其包含到此xml中，但没有成功。

为什么我的工具栏占据整个屏幕？

- Janneman96

---

这是什么值？：android:layout_height="?attr/actionBarSize" - Booger

那是56dp。如果我将其删除并直接设置layout_height="56dp"，它仍然是全屏显示。 - Janneman96

将您的主题属性移动到高度属性之前（也许高度是在其中设置）。 - Booger

Answer 1

DrawerLayout 需要在其中放置 2 个视图，但你提供了3个。

第一个视图是“背景”，它是你屏幕上的内容。第二个视图，抽屉（即导航栏），应该可以动画地进出。

你提供了3个视图。所以你的工具栏是“内容”——因此全屏显示，而你的抽屉才是实际的内容。

要解决问题，请尝试像这样操作：

<DrawerLayout>

  <!-- The main content view -->
  <LinearLayout>
    <Toolbar/>
    <FrameLayout
       android:id="@+id/content_frame"/>
  </LinearLayout>

  <!-- The navigation drawer -->
  <ListView/>
</DrawerLayout>

- David Medenjak

---

此外，Android Studio 的预览存在一个错误。它只显示一个带有标题的工具栏和我的自定义工具栏。我将我的工具栏设置为红色，以便更容易地找到它：http://imgur.com/a/qmc4G - Janneman96

这不是一个 bug，而是您布局所使用的主题。您可以更改预览中使用的主题以隐藏默认主题。 - David Medenjak

我在这里找到了它：https://dev59.com/LFwY5IYBdhLWcg3wLFSw - Janneman96

Answer 2

DrawerLayout只接受两个子视图。尝试在FrameLayout中添加工具栏。 或者您可以创建如下。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <!-- The ActionBar -->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|enterAlways" />
    <!-- The main content view -->
    <FrameLayout
        android:id="@+id/flContent"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

<android.support.design.widget.NavigationView
    android:id="@+id/navigation_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:background="@android:color/white"
    app:headerLayout="@layout/layout_drawer_header"
    app:itemTextColor="#000000"
    app:menu="@menu/global">
</android.support.design.widget.NavigationView>

- Chait