材料设计：打开导航抽屉时更改工具栏颜色

Question

我正在尝试重新创建在 google play 商店中看到的材料设计工具栏，其中导航抽屉不会与工具栏本身重叠，但会与它的选项卡重叠。我的主要活动如下所示，左侧是关闭的抽屉，右侧是打开的抽屉：

这是我的activity_main.xml：

<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <include
        android:id="@+id/toolbar"
        layout="@layout/toolbar"/>

    <android.support.v4.widget.DrawerLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="?attr/colorPrimaryDark" />

            <FrameLayout
                android:id="@+id/spotview_content_fragment"
                android:layout_weight="2"
                android:layout_width="match_parent"
                android:layout_height="0px" />

        </LinearLayout>
        <ListView android:id="@+id/left_drawer"
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp"
            android:background="#111"/>
    </android.support.v4.widget.DrawerLayout>
</LinearLayout>

还有我的toolbar.xml：

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimaryDark"/>

我还没有为抽屉添加任何其他代码。如您所见，抽屉没有与工具栏重叠，而是与选项卡重叠，就像我想要的那样。但是，选项卡的橙色阴影较深，而工具栏则没有。我怎样才能让工具栏也像在 Play 商店中一样变得更暗？我认为这样看起来会更好，因此选项卡和工具栏看起来像是属于一起的。提前致谢！

Answer 1

如果您希望工具栏变暗，则必须将其放在DrawerLayout 中，然后将其中的所有其他内容移动到工具栏下方。 DrawerLayout 代码将使工具栏变暗，就像 Play 商店一样。

还要确保你的工具栏高度是@dimen/abc_action_bar_default_height_material

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:tools="http://schemas.android.com/tools"
              android:layout_height="match_parent"
              android:layout_width="match_parent"
              android:orientation="vertical"
              tools:context=".MainActivity">


    <android.support.v4.widget.DrawerLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <include
                android:id="@+id/toolbar"
                layout="@layout/toolbar"/>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical"
                android:layout_below="@+id/toolbar">

                <View
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:background="?attr/colorPrimaryDark"/>

                <FrameLayout
                    android:id="@+id/spotview_content_fragment"
                    android:layout_weight="2"
                    android:layout_width="match_parent"
                    android:layout_height="0px"/>

            </LinearLayout>
        </RelativeLayout>

        <ListView
            android:id="@+id/left_drawer"
            android:layout_marginTop="@dimen/abc_action_bar_default_height_material"
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp"
            android:background="#111"
            android:layout_below="@+id/toolbar"/>

    </android.support.v4.widget.DrawerLayout>
</LinearLayout>