MaterialComponents randomly gives colours to status bar and Toolbar despite lack of custom colour attributes defined

Question

Why does MaterialComponents apply random colours when I've not specified any colours in the colors.xml file? Is there a way to remove those colours for the Day Mode so that the colour white is shown? I understand that MaterialComponents allows better customisation of themes, but I specifically don't need primary and secondary colour schemes. This never happened before when I was using AppCompat.

values/themes.xml & night/themes.xml

when using AppCompat

<resources>
    <style name="Theme.MyApp" parent="Theme.AppCompat.DayNight.NoActionBar"/>
</resources>

when using MaterialComponents

<resources>
    <style name="Theme.MyApp" parent="Theme.MaterialComponents.DayNight.NoActionBar"/>
</resources>

Theme.AppCompat.DayNight.NoActionBar theme

Theme.MaterialComponents.DayNight.NoActionBar theme

XML (CollapsingToolbarLayout)

<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.appbar.AppBarLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/myAppBarLayout">

    <com.google.android.material.appbar.CollapsingToolbarLayout
        android:id="@+id/myCollapsingToolbarLayout"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|snap|exitUntilCollapsed">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/myToolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:contentInsetStartWithNavigation="0dp"
            app:layout_collapseMode="pin" />
    </com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>

XML (main layout)

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/myCoordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/myRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="vertical"
        android:scrollbarStyle="outsideInset"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Answer 1

You can check the doc.
The Material Components Library provides some default colors.

For example:

 <style name="Base.V14.Theme.MaterialComponents" parent="Base.V14.Theme.MaterialComponents.Bridge">    
    <!-- Colors -->
    <item name="colorPrimary">@color/design_default_color_primary</item>
    <item name="colorPrimaryDark">@color/design_default_color_primary_dark</item>

which is:

<color name="design_default_color_primary">#6200EE</color>

And the default Toolbar background color is based on the colorPrimary.

You have to override them in your app theme.

 <style name="Theme.MyApp" parent="Theme.MaterialComponents.DayNight.NoActionBar"/>
        <item name="colorPrimary">@color/....</item>
 </style>