JetBrains / compose-multiplatform

Compose Multiplatform, a modern UI framework for Kotlin that makes building performant and beautiful user interfaces easy and enjoyable.
https://jetbrains.com/lp/compose-multiplatform
Apache License 2.0
14.85k stars 1.08k forks source link

Layout flickers when resizing the window (regression) #4744

Closed mahozad closed 4 days ago

mahozad commented 2 weeks ago

Describe the bug When changing window width on desktop, the content of the window repeatedly shrinks or expands while the resizing is in progress.

This problem did not exist in compose multiplatform 1.5.10.

Affected platforms

Versions

To Reproduce Run the below app and resize the window with mouse.

fun main() = application {
    Window(onCloseRequest = ::exitApplication) {
        Box(Modifier.width(400.dp).height(50.dp).background(Color.Red))
    }
}

Additional context This also happens even when window is not resizable. when programmatically changing window size, the content breaks for a moment:

https://github.com/JetBrains/compose-multiplatform/assets/29678011/e7f90b27-bcf6-4996-a5dc-e3ff33f7913b

elijah-semyonov commented 1 week ago

Can't reproduce it on macOS. @mahozad was macOS wrongly added to the affected platforms list, or you indeed have this behavior on macOS machine?

elijah-semyonov commented 1 week ago

@MatkovIvan I don't think I touched windows related rendering since 1.5.10. Can you bisect the regression point on a Windows machine?

babramovitch commented 1 week ago

I'm also having problems with window resizing on windows. I'm not sure if this is the same problem, but it might be? If it's different I can make another issue.

The hardcoded 200 width moves around as I resize the window, on windows, and then snaps back to 200 when I stop moving it. On a Mac, the 200 width remains in place as the rest of the window expands and shrinks.

This is on 1.6.2

Window(
    onCloseRequest = ::exitApplication,
    state = WindowState(width = 800.dp, height = 1000.dp),
) {
    Box(modifier = Modifier.fillMaxSize().background(Color.Red)) {
        Box(modifier = Modifier.width(200.dp).fillMaxHeight().background(Color.Blue))
    }
}

Please forgive this horrible video quality...

https://github.com/JetBrains/compose-multiplatform/assets/3608443/039e8b22-28ff-4fe9-a5d0-03d49f4bba7c

mahozad commented 1 week ago

I should say that CMP 1.6.0 also did not have this problem.

mahozad commented 1 week ago

Can't reproduce it on macOS...

@elijah-semyonov

Sorry. I only tested Windows. The macOS and Linux were remnants of issue template.

MatkovIvan commented 4 days ago

Reproduced in minimal skiko app without Compose. Happens only for DirectX. OpenGL for Windows works ~fine~ better (shows black bars instead of stretching sometimes)

MatkovIvan commented 4 days ago

Explanation here - https://github.com/JetBrains/compose-multiplatform/issues/4521#issuecomment-2014834922

Closing as duplicate of ~#4521~ #2925