question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MaterialToolbar on Material3 DayNight still using Material2 default coloring

See original GitHub issue

Description: Using Theme.Material3.DayNight as base theme. Styling the MaterialToolbar like title and action menu icon color still uses the Material2 default value like android:textColorPrimary for the title and colorControlNormal for navigation/action menu icon.

Expected behavior: colorOnSurface for title color and colorOnSurfaceVariant for icons should work based on the documentation. However background color works perfectly fine, even I define colorPrimary it won’t work until I set colorOnSurface .

Source code:

<!-- Base application theme -->
    <style name="Theme.Cryptonian" parent="Theme.Material3.DayNight">
  <!-- Toolbar navigation icon tint -->
        <item name="android:textColorPrimary">@android:color/holo_red_dark</item>
        <item name="colorControlNormal">@android:color/holo_red_dark</item>
</style>

image

<!-- Base application theme -->
    <style name="Theme.Cryptonian" parent="Theme.Material3.DayNight">
  <!-- Toolbar navigation icon tint -->
        <item name="colorOnSurface">@android:color/holo_green_dark</item>
        <item name="colorOnSurfaceVariant">@android:color/holo_green_dark</item>
</style>

image

Minimal sample app repro: N/A

Android API version: SDK 21

Material Library version: 1.6.0-beta01

Device: Samsung J1

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:11 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
dsn5ftcommented, Apr 8, 2022

Re: a sample, if I add the following to our Catalog demo app theme, then the surface colors get applied as expected to the toolbarSurfaceStyle MaterialToolbars:

<item name="colorSurface">@android:color/holo_red_dark</item>
<item name="colorOnSurface">@android:color/holo_blue_dark</item>
<item name="colorOnSurfaceVariant">@android:color/holo_green_dark</item>

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

Material Design 3: How to make Toolbars the same color as ...
According with documentation, the default value for a Toolbar background is ?attr/colorSurface and it is set on android:background .
Read more >
Migrating to Material Components for Android
Knowing which widgets use which colors requires inspecting the default widget styles in the source code. There are also colors from AppCompat ......
Read more >
[Top app bars] Theming the top app bar and Contextual action ...
after I created a new project with a Material 3 theme and I tried to ... The toolbar is transparent by default so...
Read more >
MaterialToolbar - Android Developers
MaterialToolbar is a Toolbar that implements certain Material features, such as elevation overlays for Dark Themes and centered titles.
Read more >
Styling Theme (with Dark Mode) and ... - ProAndroidDev
This is the Part 2 of the Series on Material Theme. To know how to add material components to your app, Part 1...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found