Android Virtual Device is using default Material3 theme, but should apply custom theme

Question

The Problem

I've been struggling with this problem for a few days now.

Android Studio's AVD seems to be only using the default Material3 theme for my application. I had no issues with this specific AVD configuration on a different machine on the same code, so I can only assume the issue is hardware-related, as it hasn't functioned correctly on my new hardware.

Failed Solutions

I've tested the default configurations of several different AVDs. Pixel 7 Pro, Pixel 6 Pro, Pixel 4, and Nexus 6, all at API 33. I've also manually edited the config.ini files associated with several of the AVDs to use host graphics, to no avail. I've even reverted to older code on the app's master branch which I can definitely confirm was working prior to the hardware change.

In addition, I permitted the theme to be selected based on whether the system was in light or dark mode, and that seemingly did not matter either.

Previews are working correctly.

There are no warnings present in either Android Studio or during the gradle build.

On Android Studio Giraffe 2022.3.1

Hardware

New hardware is Intel i7 3700k, RTX 4060 8GB GDDR6. I can provide more detailed information on request.

App

I'll show some code below. Keep in mind, this code is confirmed to have the expected result of applying a custom theme on different hardware, so I'll spare many details. Lesser versions of material design are not established dependencies.

@Composable
fun App ( finish: () -> Unit ) {
    val navController = rememberNavController()
    AppTheme(
        useDarkTheme = true
    ) {
        AppFrame(
            navController = navController
        ){
            NavGraph(navController = navController)
        }
    }
}

Theme

@Composable
fun AppTheme(
    useDarkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {

    val colors = if (!useDarkTheme) {
        LightAltColors
    } else {
        DarkAltColors
    }

    MaterialTheme(
        colorScheme = colors,
        typography = AppTypography,
        content = content
    )

    val systemUiController = rememberSystemUiController()
    systemUiController.setSystemBarsColor(MaterialTheme.colorScheme.surface)
    systemUiController.setNavigationBarColor(
        MaterialTheme.colorScheme.surfaceColorAtElevation(NavigationBarDefaults.Elevation)
    )

    content()

}

Answer 1

Turns out I was wrong. The second call to the content lambda parameter draws content on top of it that is themed with the default material theme.

In theme.kt

@Composable
fun AppTheme(
    useDarkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {

    val colors = if (!useDarkTheme) {
        LightAltColors
    } else {
        DarkAltColors
    }

    MaterialTheme(
        colorScheme = colors,
        typography = AppTypography,
        content = content
    )

    val systemUiController = rememberSystemUiController()
    systemUiController.setSystemBarsColor(MaterialTheme.colorScheme.surface)
    systemUiController.setNavigationBarColor(
        MaterialTheme.colorScheme.surfaceColorAtElevation(NavigationBarDefaults.Elevation)
    )

    // This line breaks it by calling the content *on top of the themed content*
    // Still unclear exactly why preview looked right in this instance.
    // content()

}