codelab-android-compose icon indicating copy to clipboard operation
codelab-android-compose copied to clipboard

Jetpack Compose Basics tutorial doesn't mention changing app theme

Open Digipom opened this issue 3 years ago • 0 comments

The tutorial here implicitly depends on using a day/night theme in themes.xml: https://developer.android.com/codelabs/jetpack-compose-basics

For example, themes.xml in the solution contains this code:

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.BasicsCodelab" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
    </style>

    <style name="Theme.BasicsCodelab.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

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

    <style name="Theme.BasicsCodelab.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>

However, creating a new Compose project with Android Studio results in this theme:

<resources>

    <style name="Theme.BasicsCodelab" parent="android:Theme.Material.Light.NoActionBar">
        <item name="android:statusBarColor">@color/purple_700</item>
    </style>
</resources>

This leads to differences in expected behavior and actual behavior from following the tutorial. For example, components won't display a dark background without wrapping them in a compose Surface. The system bar also won't follow dark mode and there may also be differences with system dialogs and other components.

Digipom avatar Mar 21 '22 14:03 Digipom