ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/themes.xml -->
<style name="ThemeOverlay.App.PrimarySecondary" parent="">
    <item name="colorPrimary">?attr/colorSecondary</item>
    <item name="colorOnPrimary">?attr/colorOnSecondary</item>
</style>

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<Button
    ...
    <!-- Alternatively apply with android:theme -->
+    app:materialThemeOverlay="@style/ThemeOverlay.App.PrimarySecondary"
    />

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/attrs.xml -->
<declare-styleable name="AppCustomView">
    <attr name="backgroundTint" />
    <attr name="titleTextColor" />
    ...
</declare-styleable>

ricknout

/* Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 */

// Resolve color from theme attr
val primaryColor = MaterialColors.getColor(
    view, R.attr.colorPrimary
)

// Layer background color with overlay color + alpha
val overlayedColor = MaterialColors.layer(

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/type.xml -->
<style name="TextAppearance.App.Headline6" parent="TextAppearance.MaterialComponents.Headline6">
    <item name="fontFamily">@font/roboto_mono</item>
    ...
</style>
<style name="TextAppearance.App.Body2" parent="TextAppearance.MaterialComponents.Body2">
    <item name="fontFamily">@font/roboto_mono</item>

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- (0.25 tracking / 14sp font size) = 0.0178571429 em -->
<style name="TextAppearance.App.Body2" parent="TextAppearance.MaterialComponents.Body2">
    <item name="fontFamily">@font/roboto_mono</item>
    <item name="android:textSize">14sp</item>
+    <item name="android:letterSpacing">0.0178571429</item>
    ...
</style>

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/attrs.xml -->
<attr name="textAppearanceCustom" format="reference" />

<!-- In res/values/type.xml -->
<style name="TextAppearance.App.Custom" parent="TextAppearance.MaterialComponents.*">
    ...
</style>

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/themes.xml -->
<style name="Theme.App.Base" parent="Theme.MaterialComponents.*">
    ...
    <item name="textAppearanceHeadline6">
        @style/TextAppearance.App.Headline6
    </item>
    <item name="textAppearanceBody2">

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/attrs.xml -->
<declare-styleable name="AppCustomView">
    <attr name="titleTextAppearance" />
    <attr name="subtitleTextAppearance" />
    ...
</declare-styleable>

ricknout

<!-- Copyright 2020 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!-- In res/values/shape.xml -->
<style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
    <item name="cornerFamily">cut</item>
    <item name="cornerSize">4dp</item>
    ...
</style>
<style name="ShapeAppearance.App.MediumComponent" parent="ShapeAppearance.MaterialComponents.MediumComponent">