Display cutout WindowInset do not work in landscape mode on iOS

[Mats-Hjalmar]

Describe the bug WindowInset.displayCutout behaves like the camera is on both sides in the or none depending on what side you want calculated. (in Both layout directions)

Affected platforms

• iOS

Versions

• Kotlin version*: 1.9.21
• Compose Multiplatform version*: 1.5.11
• OS version(s)* (required for Desktop and iOS issues): 17.2
• OS architecture (x86 or arm64): arm64

To Reproduce

@Composable
internal fun App() = AppTheme {
    val rightCameraPadding =
        WindowInsets.displayCutout
            .asPaddingValues()
            .calculateRightPadding(LayoutDirection.Ltr)
    Box(
        Modifier.fillMaxSize()
            .padding(end = rightCameraPadding)
            .background(Color.Red)
    )
}

Expected behavior The padding value should be 0 if there is no camera on the right side.

Screenshots

Additional context This do not work either (left display cutout values with app in landscape)

[terrakok]

Do you have this code on the ios app side?

struct ContentView: View {
    var body: some View {
        ComposeView().ignoresSafeArea(.all)
    }
}

[terrakok]

Because I don't see the initial problem but found another one: If to rotate app through an up side down state then insets won't be updated

@Composable
internal fun App() = AppTheme {
    Box(
        Modifier
            .fillMaxSize()
            .windowInsetsPadding(WindowInsets.displayCutout)
            .background(Color.Red)
    ) {
        Text("TEXT")
    }
}

[Mats-Hjalmar]

Do you have this code on the ios app side?

struct ContentView: View {
    var body: some View {
        ComposeView().ignoresSafeArea(.all)
    }
}

That is exactly my code.

[Mats-Hjalmar]

Because I don't see the initial problem but found another one: If to rotate app through an up side down state then insets won't be updated

@Composable
internal fun App() = AppTheme {
    Box(
        Modifier
            .fillMaxSize()
            .windowInsetsPadding(WindowInsets.displayCutout)
            .background(Color.Red)
    ) {
        Text("TEXT")
    }
}

Quite amazing edge case. Any idea how to fix it?

[okushnikov]

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.