如何设置工具栏文本和后退箭头颜色

Posted 2023-04-13

【中文标题】如何设置工具栏文本和后退箭头颜色

【英文标题】：How to set Toolbar text and back arrow color

【发布时间】：2015-01-14 04:07:50

【问题描述】：

工具栏背景为深色，我希望文本和后退箭头为白色。我尝试了以下，但它不起作用。

<style name="Theme.MyTheme" parent="Theme.AppCompat.Light.NoActionBar">

        <item name="colorPrimary">@color/blue</item>
        <item name="colorPrimaryDark">@color/blue_darker</item>
        <item name="colorAccent">@color/purple</item>
        <!-- item name="android:textColorPrimary">@color/white</item--> // I don't want to set this, changes everywhere. 
        <item name="android:textColorSecondary">@color/white</item>
        <item name="android:toolbarStyle">@style/AppTheme.ToolbarStyle</item>
        <item name="toolbarStyle">@style/AppTheme.ToolbarStyle</item>

        <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowStyle</item>

    </style>

    <style name="AppTheme.ToolbarStyle" parent="Base.Widget.AppCompat.Toolbar">
        <!--<item name="actionOverflowButtonStyle">@style/AppTheme.OverflowButtonStyle</item>-->
        <item name="android:textColor">@color/white</item> // doesn't work
        <item name="titleTextAppearance">@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse</item>
        <item name="android:titleTextAppearance">@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse</item>
        <item name="subtitleTextAppearance">@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle</item>
    </style>

【问题讨论】：

尝试将app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"添加到您的<android.support.v7.widget.Toolbar>；后退箭头和文字将是白色的，就像@yubarajpoudel 说的那样。

【参考方案1】：

您可能是从错误的父级扩展而来。如果没有，您可以尝试将style 直接添加到toolbar 布局中，如果您想覆盖主题的设置。

在您的工具栏布局中：

 <android.support.v7.widget.Toolbar
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:id="@+id/toolbar"
      android:layout_
      android:layout_
      android:minHeight="?attr/actionBarSize"
      app:theme="@style/ToolBarStyle"
      app:popupTheme="@style/ToolBarPopupStyle"
      android:background="@color/actionbar_color" />

按照你的风格：

 <!-- ToolBar -->
  <style name="ToolBarStyle" parent="Theme.AppCompat">
      <item name="android:textColorPrimary">@android:color/white</item>
      <item name="android:textColorSecondary">@android:color/white</item>
      <item name="actionMenuTextColor">@android:color/white</item>      
      <item name="actionOverflowButtonStyle">@style/ActionButtonOverflowStyle</item>
      <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
 </style>

【讨论】：

将此样式添加到styles.xml 文件时出现错误

你不需要drawerArrowStyle部分来回答问题

【参考方案2】：

将以下内容添加为toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_
    android:layout_
    android:fitsSystemWindows="true"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:background="?attr/colorPrimary">

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

然后在你需要的布局中

<include layout="@layout/toolbar"/>

享受

【讨论】：

是的，有效！特别是app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar".

应该是<include layout="@layout/toolbar"/>

【参考方案3】：

在Activity里面，可以使用

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    toolbar.setTitleTextColor(getResources().getColor(android.R.color.white));

如果您喜欢为标题颜色和返回箭头白色选择 xml，只需在 style.xml 中添加此样式。

 <style name="ToolBarStyle" parent="Theme.AppCompat">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
</style>

工具栏看起来像：

 <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_
        app:theme="@style/ToolBarStyle"
        android:layout_
  />

【讨论】：

这行得通！这么多随机答案 - 我认为需要注意的是这适用于： android.support.v7.widget.Toolbar 嵌套在： android.support.design.widget.AppBarLayout 非常感谢

java解决方案不改变箭头颜色

【参考方案4】：

此解决方案可能更简单。但它确实需要更高的 API 版本（23）。只需将此代码添加到 XML 中的工具栏：

<Toolbar
    android:id="@+id/toolbar"
    android:layout_
    android:layout_
    android:minHeight="?android:attr/actionBarSize"
    android:background="?android:attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:titleTextColor="#ffffffff" />

【讨论】：

@VygintasB 真实

不需要设置android:titleTextColor="#ffffffff"，只需要设置android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 和app:popupTheme="@style/ThemeOverlay .AppCompat.Light"

【参考方案5】：

如果您使用AndroidX（截至 2019 年 7 月） 你可以添加这些：

<androidx.appcompat.widget.Toolbar
  android:id="@+id/toolbar"
  android:layout_
  android:layout_
  app:layout_collapseMode="pin"
  app:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
  app:popupTheme="@style/ThemeOverlay.MaterialComponents.Light"/>

注意！如果您的 Toolbar 直接放置在 AppBarLayout 内而不是 CollapsingToolbarLayout 内，则此功能已测试过

【参考方案6】：

这个方法帮助了我。

<style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primaryDark</item>
        <item name="colorAccent">@color/highlightRed</item>
        <item name="actionBarTheme">@style/ToolbarStyle</item>
</style>

<style name="ToolbarStyle" parent="Widget.AppCompat.ActionBar">
        <item name="android:textColorPrimary">@color/white</item>
</style>

【参考方案7】：

<android.support.design.widget.AppBarLayout
        android:layout_
        android:layout_
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_
            android:layout_
            android:background="?attr/colorPrimaryDark"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>

【讨论】：

如果您有appbarlayout，这就是答案。谢谢！

【参考方案8】：

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="@color/actionBar"
app:titleTextAppearance="@style/ToolbarTitleText"
app:theme="@style/ToolBarStyle">

<TextView
    android:id="@+id/title"
    style="@style/ToolbarTitleText"
    android:layout_
    android:layout_
    android:layout_gravity="center"
    android:text="hh"/>

<!-- ToolBar -->
<style name="ToolBarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="actionMenuTextColor">#ff63BBF7</item>
</style>

使用 app:theme="@style/ToolBarStyle"

Reference resources：http://blog.csdn.net/wyyl1/article/details/45972371

【讨论】：

请解释你的答案，只是发布代码对于回答问题不是很清楚。

【参考方案9】：

将此行添加到Toolbar。 100% 正常工作

android:theme="@style/Theme.AppCompat.Light.DarkActionBar"

【参考方案10】：

在你的 XML 文件上试试这个

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        app:titleTextColor="@color/colorAccent"
        app:theme="@style/ToolbarColoredBackArrow"
        app:subtitleTextColor="@color/colorAccent"
        android:layout_
        android:layout_
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

并添加这是您的 colors.xml 文件

    <color name="colorAccent">YOUR_COLOR</color>

【讨论】：

请您与我们分享应用程序中的内容：theme="@style/ToolbarColoredBackArrow"

【参考方案11】：

这种方法对我使用 Material Components 库很有效：

在styles.xml:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <!-- Your styles here -->

    <item name="toolbarStyle">@style/AppTheme.Toolbar</item>
</style>

<style name="AppTheme.Toolbar" parent="Widget.MaterialComponents.Toolbar">
    <item name="titleTextColor">@android:color/white</item>
</style>

改编自这个答案：https://***.com/a/48205577/238753

【参考方案12】：

尝试了很多方法，在低版本的API中，一个可行的方法是<item name="actionMenuTextColor">@color/your_color</item>并且不要使用Android命名空间

ps：

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

    <!-- change the textColor -->
    <item name="actionMenuTextColor">@color/actionMenuTextColor</item>
</style>

【参考方案13】：

我使用了占位符，所以请继续，因为您可能仍希望保留原始样式的继承。

之前

<android.support.v7.widget.Toolbar
    android:id="@+id/toolBar"
    android:layout_
    android:layout_
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/originalBaseStyle"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

之后：

styles.xml

<style name="yourToolbarStyle" parent="originalBaseStyle">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
    <item name="actionOverflowButtonStyle">@style/ActionButtonOverflowStyle</item>
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

因此

<android.support.v7.widget.Toolbar
    android:id="@+id/toolBar"
    android:layout_
    android:layout_
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/yourToolbarStyle"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

【参考方案14】：

如果我们按照Android Studios创建的activity模板，就是AppBarLayout需要有一个AppBarOverlay的android主题，你应该在你的styles.xml中定义。这应该会给你白色的工具栏/操作栏颜色文本。

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_
    android:layout_
    android:theme="@style/AppTheme.AppBarOverlay">  ...

在styles.xml中，确保以下内容存在：

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

【参考方案15】：

要更改工具栏的后退图标可绘制，您可以使用以下命令： 将<item name="toolbarStyle">@style/ToolbarStyle</item> 添加到您的主题中。 这是ToolbarStyle 本身：

<style name="ToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="navigationIcon">@drawable/ic_up_indicator</item>
</style>

【参考方案16】：

如果使用最新版本的 Android Studio 3.0 并生成 Activity 类，请在样式文件中更改：

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

到这里：

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.ActionBar" />

【参考方案17】：

xmlns:android="http://schemas.android.com/apk/res/android"


xmlns:app="http://schemas.android.com/apk/res-auto"


android:id="@+id/toolbar"


android:layout_


android:layout_


android:background="@color/color_primary"


android:theme="@style/GalaxyZooThemeToolbarDarkOverflow"


app:popupTheme="@style/Theme.AppCompat.NoActionBar" />

该工具栏主题指定了 textColorPrimary 和 textColorSecondary 来更改标题文本和菜单溢出按钮的颜色。您可以只为工具栏指定标准 Theme.AppCompat.Light.NoActionBar 主题，以获取深色文本和溢出图标，但我想从我自己的主题中派生并且只进行小的更改，因为我不知道还有什么可能受到影响。

<style name="GalaxyZooThemeToolbarDarkOverflow" parent="Theme.AppCompat.NoActionBar">


<!-- android:textColorPrimary is the  color of the title text
   in the Toolbar, in the Theme.AppCompat theme:  -->


<item name="android:textColorPrimary">@color/abc_primary_text_material_light</item>



<!-- android:textColorPrimaryInverse is the  color of the title
   text in the Toolbar, in the Theme.AppCompat.Light theme:  -->


<!-- <item name="android:textColorPrimaryInverse">@color/abc_primary_text_material_light</item> -->

这是您可以更改工具栏上的文本和图标颜色的方法。

更多 参考：https://www.murrayc.com/permalink/2014/10/28/android-changing-the-toolbars-text-color-and-overflow-icon-color/

【参考方案18】：

在基本应用程序主题中添加这一行，第一行用于文本，第二行用于菜单图标

<item name="android:textColorPrimary">@color/colorTextWhite</item>
<item name="android:textColorSecondary">@color/colorTextWhite</item>

应该是这样的

<!-- 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="android:textColorPrimary">@color/colorTextWhite</item>
    <item name="android:textColorSecondary">@color/colorTextWhite</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>