Does jetpack compose use drawable-night folder?

Question

We have a View based Android app with some drawables in res/drawable folder, and their counterpart for night mode in res/drawable-night folder

When using legacy views, referencing a drawable R.drawable.foo from a XML layout file, the system would pick the drawable from either res/drawable or res/drawable-night folders depending on whether we are in day or night mode.

When using jetpack compose, we reference the drawable in an Image composable like this:

Image(painter = painterResource(R.drawable.foo))

However, this always pick the drawable from res/drawable folder, ignoring day / night mode.

We could do something like this to select the right drawable, but we would need to test the night mode (isSystemInDarkTheme()) within all composables that uses drawables depending on nigh mode:

Image(painter = painterResource(id = if (isSystemInDarkTheme()) R.drawable.foo_dark else R.drawable.foo_light))
    

Is there a way in compose to ensure that the drawable from day or night mode are picked correctly, and transpartently, as in legacy view system?

Answer 1

Maybe Compose was updated since the other answers were posted, but I can confirm that in a simple app using only Compose and two drawables with the same name in drawable and drawable-night folders, the app is picking up the dark one, if the phone is set to dark mode.

That's also without a composable theme defined, so this simple code does the job:

@Preview
@Preview(uiMode = UI_MODE_NIGHT_YES)
@Composable
fun ImagePreview() {
    Image(
        painter = painterResource(id = R.drawable.my_icon),
        contentDescription = null
    )
}

Note that you can also see this in a Preview - having two @Preview annotations produces two previews in Android Studio, and specifying that you want to see your composable in dark mode is also possible!