在导航抽屉中着色Android状态栏

时间:2014-10-25 23:50:00

标签: android navigation-drawer android-theme android-5.0-lollipop android-appcompat

在这个应用程序中,我已经在我的活动中添加了一个导航抽屉片段。我使用5.0,所以我能够设置primaryColor和primaryColorDark以获得正确的颜色。我决定尝试将我的导航抽屉设计为与5.0中的Google Now抽屉非常相似,其中导航抽屉拥有它自己的状态栏背景。 (无法发布图片,信誉不足>。>)

我已经关注了这个问题的建议here,这已经提供了相当多的帮助。当我把它拉出来时,我已经在状态栏下画了我的导航抽屉。唯一的麻烦是,我无法弄清楚如何设置抽屉中显示的状态栏的颜色。目前,它只显示白色。

以下是我的样式和代码的相关部分:

活动布局:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Main"
    android:fitsSystemWindows="true">

    <!-- main content -->
    ...

    <!-- Drawer fragment -->
    <fragment
        android:id="@+id/navigation_drawer"
        android:layout_width="@dimen/navigation_drawer_width"
        android:layout_height="match_parent"
        android:layout_gravity="left|start"
        android:theme="@style/DrawerTheme"
        android:fitsSystemWindows="true"
        android:choiceMode="singleChoice"
        android:name="com.myname.appname.NavigationDrawerFragment"
        tools:layout="@layout/fragment_navigation_drawer" />

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

片段布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/navDrawerFragment"
    android:theme="@style/DrawerTheme"
    android:background="@color/WindowBackground"
    tools:context=".NavigationDrawerFragment"
    android:fitsSystemWindows="true">

     <!-- content here -->

</RelativeLayout>

上面的每个链接,设置活动状态栏的颜色(此部分正常工作):

public void onCreate(Bundled savedInstanceState) {
    super.onCreate(savedInstanceState);

    // ....

    drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    drawerLayout.setDrawerShadow(R.drawable.drawer_shadow, Gravity.START);
    drawerLayout.setStatusBarBackgroundColor(getResources().getColor(R.color.colorPrimaryDark));

    // ....
}

最后,我对活动的相关风格,以及我尝试过的&#39;分配给片段。

<style name="StatusBarActivityTheme" parent="MyAppTheme">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>


<style name="DrawerTheme" parent="MyAppTheme">
    <item name="android:statusBarColor">#000000</item>
    <item name="android:colorPrimaryDark">#000000</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
</style>

提前感谢您提供的任何帮助!我怀疑我的问题与Google Now的主屏幕如何具有透明状态栏有关,并且只在导航抽屉期间对其进行着色,但任何相反的新闻都会很棒!

1 个答案:

答案 0 :(得分:17)

使用您的设置,导航抽屉只是一个视图,在状态栏下方绘制其背景(您已定义为android:background="@color/WindowBackground")(您通过{{1将颜色设置为透明) }})。系统仅查看Activity主题以设置状态栏颜色;为孩子分配StatusBarActivityTheme无效。

简单的解决方案是将导航抽屉片段布局的android:statusBarColor更改为您想要的颜色。如果您希望图像下方的部分保持白色,则可以选择在抽屉布局中使用android:background或其他颜色添加空视图。


如果您希望Nav抽屉中的内容延伸到状态栏下方,则需要更多工作。它首先被偏移的原因是因为您将android:background="@color/WindowBackground"属性设置为true,而该属性又调用视图的默认fitSystemWindows()。正如文档所解释的那样,此方法采用插入(即我们的情况下状态栏的高度)并将其应用为视图的填充(在您的情况下,这将成为您的Nav Drawer片段的android:fitsSystemWindows的顶部填充)。

绕过此填充的一种方法是覆盖视图的RelativeLayout方法。我引导您访问Google的开源IO计划应用程序 - 具体来说,他们使用ScrimInsetsScrollView作为Nav Drawer的根元素。此修改后的fitSystemWindows()会应用您选择的颜色的稀松布(通过自定义ScrollView属性设置)和消耗插入内容,即不再填充!

app:insetForeground可以用作模型为任何View后代编写自己的版本,真的 - 看到几乎相同的ScrimInsetsFrameLayout