How to alter the default background color of composable preview without altering android:windowBackground

55 views Asked by At

I'm currently improving previews in my android app (which is using mostly jetpack compose).

When i only use @Preview(showBackground=true) the background color of the preview defaults to almost-black, which makes black text unreadable.

enter image description here

Sure, i could alter the background color of each preview, but that is overly cumbersome and doesn't work when running the preview on an emulator: @Preview(showBackground = true, backgroundColor = 0xFFFFFF)

So i went looking where the almost-black default color comes from, and it seems to be the <item name="android:windowBackground">@color/almostBlack</item> of my ancient xml theme. Changing this to white works, but has unintended consequences for my main app :(

enter image description here

Is it possible to alter the default preview background color without altering android:windowBackground?


As requested my code:

This is my simplified theme:

<style name="Theme.App.Base" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="android:windowBackground">@color/almostBlack</item>
</style>

It needs to be applied in the Android Manifest

<application
    [...]
    android:theme="@style/Theme.App.Base"
    [...]
    >

I then add the following composable & preview

@Composable
private fun HelloWorld(
    title: String
) {
    Text("Hello $title")
}

@Preview(showBackground=true
@Composable
private fun HelloWorldPreview() {
    HelloWorld("Stack Overflow")
}
0

There are 0 answers