How to change toolbar text color from MaterialComponents.DayNight theme?

Question

I am using MaterialComponents.DayNight theme in my app. In the day mode, toolbar text color is black. But when I switch to night mode toolbar text color is remain black, so it's not visible anymore.

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.DarkActionBar">

I want to change the toolbar text color into white in night mode. How can I do that?

Answer 1

Just use in your Layout (it works also with the androidx.appcompat.widget.Toolbar) the style:

<com.google.android.material.appbar.MaterialToolbar
    style="@style/Widget.MaterialComponents.Toolbar.Primary"

Then define in the values-night/colors.xml the colorOnPrimary.

Then there are a lot of alternatives.
You can customize globally the style of the toolbar in the app theme with:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
  <item name="toolbarStyle">@style/MyToolbar</item>
</style>

with:

  <style name="MyToolbar" parent="Widget.MaterialComponents.Toolbar.Primary">
    <item name="titleTextColor">@color/.....</item>
  </style>

and the define the color in the values/colors.xml and values-night/colors.xml.

Or just apply a style in the Toolbar

<com.google.android.material.appbar.MaterialToolbar
    style="@style/MyToolbar"

or simply override the theme with:

<com.google.android.material.appbar.MaterialToolbar
   android:theme="@style/MyThemeOverlay_Toolbar"

with:

  <style name="MyThemeOverlay_Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
    <item name="colorOnPrimary">@color/...</item>
  </style>

Answer 2

Add this entry to your theme:

<item name="android:itemTextAppearance">@style/PopupMenuTextAppearance</item>

After that, add the style accordingly to the styles.xml:

<style name="PopupMenuTextAppearance" parent="TextAppearance.AppCompat.Menu">
    <item name="android:textColor">?attr/colorOnBackground</item>
</style>

?attr/colorOnBackground is available in the Material Components library. If you're not using that, you should be able to use ?android:attr/textColorPrimary instead.

Answer 3

Set your parent theme to parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge"

By using this, you will keep your ActionBar's original theme with DarkActionBar attributes on top of the overal DayNight theme from MaterialComponents.