Android target has a screen with dark background compared to other targets

Go to https://terrakok.github.io/Compose-Multiplatform-Wizard/
Create the project with default parameters
Run the Android target:

We can see that background is dark, but it shoud be white, as in the other targets.

The phone itself has the Light theme:

The reason is

android:theme="@android:style/Theme.Material.NoActionBar"

it needs to be

android:theme="@android:style/Theme.Material.Light.NoActionBar"

as in the official Compose Multiplatform template and in official Android template from Android Studio Giraffe | 2022.3.1 Patch 1.

The official Jetpack Compose also creates dynamic changing of the theme (but still has Theme.Material.Light.NoActionBar):


private val DarkColorScheme = darkColorScheme(
    primary = Purple80,
    secondary = PurpleGrey80,
    tertiary = Pink80
)

private val LightColorScheme = lightColorScheme(
    primary = Purple40,
    secondary = PurpleGrey40,
    tertiary = Pink40

    /* Other default colors to override
    background = Color(0xFFFFFBFE),
    surface = Color(0xFFFFFBFE),
    onPrimary = Color.White,
    onSecondary = Color.White,
    onTertiary = Color.White,
    onBackground = Color(0xFF1C1B1F),
    onSurface = Color(0xFF1C1B1F),
    */
)

@Composable
fun MyApplicationTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    // Dynamic color is available on Android 12+
    dynamicColor: Boolean = true,
    content: @Composable () -> Unit
) {
    val colorScheme = when {
        dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
            val context = LocalContext.current
            if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
        }

        darkTheme -> DarkColorScheme
        else -> LightColorScheme
    }
    val view = LocalView.current
    if (!view.isInEditMode) {
        SideEffect {
            val window = (view.context as Activity).window
            window.statusBarColor = colorScheme.primary.toArgb()
            WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
        }
    }

    MaterialTheme(
        colorScheme = colorScheme,
        typography = Typography,
        content = content
    )
}

terrakok / Compose-Multiplatform-Wizard

Android target has a screen with dark background compared to other targets #26