Hey I m using this to display gt 20 images in a lazy grid ```var painter by remember mutableStateOf lt ImageBitmap gt null LaunchedEffect Unit painter = Image makeFromEncoded it file readBytes toComposeImageBitmap painter let p gt Image p modifier = Modifier size 120 dp contentDescription = null ``` However my program starts to lag extremely I suspect the images are too high quality can I somehow scale them down or sth like that

var painter by remember {                                                  
    mutableStateOf<ImageBitmap?>(null)                                             
}                                                                                  
LaunchedEffect(Unit) {                                                             
    painter = Image.makeFromEncoded(it.file.readBytes()).toComposeImageBitmap()    
}                                                                                  
painter?.let { p ->                                                                
    Image(p, modifier = Modifier.size(120.dp), contentDescription = null)          
}

However, my program starts to lag extremely, I suspect the images are too high quality, can I somehow scale them down or sth like that?

yschimke

04/23/2023, 1:28 PM

Best to scale at the source. But if you use something like Coil, you can scale before the UI in a couple of ways.

Jan

04/23/2023, 1:41 PM

I'm on desktop 😕

Sergey Y.

04/23/2023, 2:22 PM

https://kotlinlang.slack.com/archives/CJLTWPH7S/p1681775655060979

LaunchedEffect runs on the main thread using the UI dispatcher, so you are performing file read and encode operations on the image file in the UI thread.

You should avoid doing IO and image encoding in the UI thread. Instead, you should use image loading libraries like Coil 3.x, Camel or similar that support desktop.

Jan

04/23/2023, 5:30 PM

yea makes sense, found a good image transformation library

3 Views

#compose Join Slack