如何更改汉堡菜单图标的颜色?

时间:2019-03-14 17:26:44

标签: android hamburger-menu

首先,我想澄清的是,我愿意更改汉堡导航菜单图标本身的颜色,而不是导航菜单中图标的颜色。

我遵循了本教程:https://developer.android.com/training/implementing-navigation/nav-drawer#DrawerButton

结果,我在应用程序栏中有一个NavMenu图标(汉堡)。问题:图标为黑色(Vector可绘制的默认颜色)。

我创建了一种新样式:

<!-- Hamburger menu -->
<style name="MyDrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@color/colorTextTitle</item>
</style>

然后我将此样式添加到主题中

<style name="customTheme" parent="Theme.AppCompat.NoActionBar">
    <!-- Hamburger menu -->
    <item name="drawerArrowStyle">@style/MyDrawerArrowToggle</item>
</style>

确保此样式是我的应用程序在清单中使用的样式:

<application>
    android:theme="@style/customTheme"
</application>

并将此主题也应用于工具栏(以防万一...)

<FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorToolbarBackground"
            app:theme="@style/customTheme"
            app:popupTheme="@style/customTheme"
            app:title="@string/app_name"
            app:titleTextColor="@color/colorTextBody">

        </android.support.v7.widget.Toolbar>
    </FrameLayout>

操作结果:这些都没有任何效果。汉堡包图标极度保持黑色。

你们中的任何一个都能向我解释我犯了什么错误以及如何改变这种颜色吗?

2 个答案:

答案 0 :(得分:2)

我建议您看一下Google / Android Studio提供的示例。

  1. 创建一个名为test-hamburger的新项目(名称为可选;-))
  2. 显然选择“抽屉”模板。我没有选中“使用AndroidX”,但应该可以使用。
  3. 我选择了MinAPI 23 / Target 28。

拥有示例应用程序后,运行它并观察工具栏为绿色,文本/淡色为白色。

打开values/styles.xml(不是v21版本,请**):

这是现有主题的外观:

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

您需要向其添加以下行: <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>

当然要定义样式:

    <style name="DrawerArrowStyle" parent="@style/Widget.AppCompat.DrawerArrowToggle">
        <item name="spinBars">true</item>
        <item name="color">@android:color/holo_red_dark</item>
    </style>

总而言之,您的样式现在应如下所示:

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
    </style>

    <style name="DrawerArrowStyle" parent="@style/Widget.AppCompat.DrawerArrowToggle">
        <item name="spinBars">true</item>
        <item name="color">@android:color/holo_red_dark</item>
    </style>

运行时,它看起来像:

Running

答案 1 :(得分:0)

使用它作为工具栏的样式

<style name="Toolbar">
    <item name="android:textColorPrimary">@color/colorAccent</item>
    <item name="android:textColor">@color/colorAccent</item>
    <item name="android:textColorSecondaryInverse">@color/colorAccent</item>
    <item name="android:textColorSecondary">@color/colorAccent</item>
</style>

我希望对您有帮助