skydoves / Cloudy

☁️ Jetpack Compose blur effect library, which falls back onto a CPU-based implementation to support older API levels.
Apache License 2.0
840 stars 30 forks source link

Blur effect applied after a few hundred milliseconds #19

Open ivevasiljevic opened 9 months ago

ivevasiljevic commented 9 months ago

Please complete the following information:

Describe the Bug:

I applied a blur effect to my Text Composables as such:

Cloudy { Text( modifier = Modifier.padding(2.dp), text = stringResource(id = previewTransaction.companyName), style = Typography.b1MediumTextStyle, color = Grey500 ) }

As it turns out after my loading indicator is gone, and the content is showed, the effect takes a bit of time to show up, or to be applied. I am wondering why is this happening. Is the implementation intended as such?

Expected Behavior:

I expect the blur effect to be applied immediately, or calculated as the views are being composed.

shahzadansari commented 8 months ago

Following. Even though it's not much but there is a slight delay between Loading and Success states. But I guess since Bitmap is being drawn, this might be unavoidable. Adding a sample for repro.

@Composable
fun Sample() {
    Box(modifier = Modifier.fillMaxSize()) {
        var showDialog by remember { mutableStateOf(false) }

        Cloudy(
            radius = if (showDialog) 10 else 0,
            content = {
                Text(text = "a".repeat(1200))
            }
        )

        if (showDialog) {
            Box(
                modifier = Modifier
                    .size(200.dp)
                    .background(Color.Green)
                    .align(Alignment.Center)
            )
        }

        Button(
           onClick = { showDialog = !showDialog }, 
           modifier = Modifier.align(Alignment.BottomCenter), 
           content = { Text(text = "Toggle") }
        )
    }
}

https://github.com/skydoves/Cloudy/assets/43310446/4786f8c5-e603-4d6b-ac07-b3b9940f4ec5