'Compose preview doesn't work at all - project needs to be compiled

I use Android Studio Bumblebee 2021.1.1 Patch 3 built on March 16, 2022

androidx.compose.ui:ui-tooling, androidx.compose.ui:ui-tooling-preview, androidx.compose.ui:ui are in version 1.2.0-alpha07

I want to create preview of my composable but I can't create any one. Every time I see error: "The project needs to be compiled for the preview to be displayed" I rebuilt, synced project and restarted Android Studio but it doesn't help. What can be wrong?

My composable for example:

@Composable
fun DefaultProfileAvatarBox(
    modifier: Modifier = Modifier
        .size(60.dp),
    firstLetter: String
) {
    val finalModifier = modifier
        .clip(CircleShape)
        .background(blueAvatarBackground)

    Box(
        modifier = finalModifier
    ) {
        Text(
            text = firstLetter,
            modifier = Modifier
                .padding(bottom = 2.dp)
                .align(Alignment.Center),
            fontSize = 32.sp,
            fontWeight = FontWeight.SemiBold,
            color = Color.White,
            textAlign = TextAlign.Center
        )
    }
}

@Preview
@Composable
fun DefaultProfileAvatarBoxPreview() {
    DefaultProfileAvatarBox(firstLetter = "K")
}


Solution 1:[1]

I had the same problem But when I used the stable version of activity-compose (1.4.0) ! The problem was solved.

dependencies {
// ...
     implementation 'androidx.activity:activity-compose:1.4.0' 
}

Solution 2:[2]

Use version 1.1.1 to avoid this.

I hope it helps you.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Amir
Solution 2 Skatox