When using `windowInsetsPadding(WindowInsets.safeD...

# compose

[Stylianos Gakis]

When using windowInsetsPadding(WindowInsets.safeDrawing.only(WindowInsetsSides.Horizontal)) on a KMP project and I am on normal Portrait mode
On Android: there is no padding added horizontally since there is nothing there on portrait mode
On iOS: There is some space added on the sides, despite the fact that there is nothing drawn on the edges which would interfere with the UI

Is there something on iOS which I am potentially missing for such horizontal window insets, or is it a bug in the sense that it tries to draw things outside of the area in which one could click and drag to "go back" for example?

[Stylianos Gakis]

To help show what I mean. These two apps use the same code.
Around everything there is a modifier like

Modifier
 .padding(horizontal = 16.dp)
 .windowInsetsPadding(WindowInsets.safeDrawing.only(WindowInsetsSides.Horizontal))

Which on Android it properly resolves to 0.dp in portrait mode, but for iOS there is some arbitrary space which I can't figure out why yet

[Lukas Anda]

Did you remove the safe insets from swiftUi side? To confirm you can debug through xcode and see in the layer inspection if it's compose adding the inset or swiftui/uikit

[Stylianos Gakis]

Yeah, removing the insets from the shared code from the text field there for example makes it properly draw all the way to the edges.
I'll keep testing now to see which inset in particular is the one which brings this extra space to make sure I am not doing anything else wrong instead.

[Stylianos Gakis]

Using

.windowInsetsPadding(WindowInsets.systemBars.only(WindowInsetsSides.Horizontal))

I get this horizontal space added.

Using

.windowInsetsPadding(WindowInsets.statusBars.only(WindowInsetsSides.Horizontal))
.windowInsetsPadding(WindowInsets.captionBar.only(WindowInsetsSides.Horizontal))
.windowInsetsPadding(WindowInsets.navigationBars.only(WindowInsetsSides.Horizontal))

I get no horizontal spacing at all.

The docs of systemBars says:
"These insets represent all system bars. Includes statusBars, captionBar as well as navigationBars, but not ime."

Time to go touch some grass or smth, because I feel like I am just being trolled laugh cry face palm

[Lukas Anda]

oops haha. Perhaps check the actual implementation, might be a cmp bug

[Stylianos Gakis]

The impl is impossible to find through the IDE, and I found this https://github.com/JetBrains/compose-multiplatform-core/blob/6cbdd5691f833c428ae8e[…]kotlin/androidx/compose/foundation/layout/WindowInsets.skiko.kt in the sources but I couldn't for the life of me figure out where it is actually provided yet.
Hence me saying I need to touch some grass before I dive back into this again 😅

[Kevin van Mierlo]

Which version are you using? Because iOS has insets issues when consuming the insets: https://youtrack.jetbrains.com/issue/CMP-9390/iOS-seems-to-ignore-consumeWindowInsets
This is fixed in 1.11.0-alpha02 and not in the stable package for 1.10.*. Not sure if this has anything to do with your issue, but might be worth to check out the latest beta from 1.11.0

[Stylianos Gakis]

I am actually using 1.11.0-beta01 so that isn't it either unfortunately

[Stylianos Gakis]

I just cloned the jetbrains compose clone to see what the difference actually is and I made this ticket https://youtrack.jetbrains.com/issue/CMP-10046/WindowInsets.systemBars-add-some-arbitrary-horizontal-space-on-iOS-but-not-on-Android to report this issue

[Stylianos Gakis]

Basically the doc says that systemBars is a combination of the other three things but in reality on iOS that's not the case

Instead they are defined as such:

override val systemBars: PlatformInsets get() = PlatformInsets(getLeft = { safeAreaInsets().left }, getRight = { safeAreaInsets().right }, getTop = { safeAreaInsets().top }, getBottom = { safeAreaInsets().bottom })

override val statusBars: PlatformInsets get() = PlatformInsets(getTop = { safeAreaInsets().top })
override val navigationBars: PlatformInsets get() = PlatformInsets(getBottom = { safeAreaInsets().bottom })
override val captionBar: PlatformInsets get() = PlatformInsets.Zero

So basically there are some horizontal insets that are only added on the systemBars but not on the three other insets individually.
But I am still not sure what those horizontal insets are supposed to be doing anyway since on iOS on portrait mode there is nothing visually there horizontally that would require the insets to be there

[Michal Janecek]

Hi, I can confirm I also have this issue.
The app works fine on most iPhones (14, 16 Pro, 17 Pro Max, and many others). However, I did a pre-release manual testing on iPhone SE (always do, since it is smallest iPhone my app runs on), and I noticed every screen has this extra space on the edges.
I did not dig into it but it looks exactly as what you posted.

This hapens on CMP 1.11.0-beta01 , when tried with 1.10.3 , the issue went away!

[Stylianos Gakis]

Thanks for commenting there ^^
Let's hope it's picked up soon

[Michal Janecek]

Thanks for reporting that. I hope so, it is a big blocker. I can not downgrade, because I need other critical bug fixes which were fixed in beta01 😄

[Stylianos Gakis]

Yeap exactly

[Kevin van Mierlo]

That really sucks. I upgraded to this version since the 1.10.* has the problem on iOS if you consume insets, it doesn't really get consumed. So I don't want to try and revert the entire project to 1.9.*

[Michal Janecek]

Any update on this? Has anyone found a reasonable workaround yet, or are you waiting for a fix?

[Stylianos Gakis]

The workaround is to use the 3 insets separately as I mention in the issue

[Michal Janecek]

@Stylianos Gakis My app is only portrait mode, so I fixed it by creating this Modifier

@Composable
fun Modifier.consumeBogusIosHorizontalInsets(): Modifier {
    if (platform != Platform.IOS) return this
    return this.consumeWindowInsets(
        WindowInsets.systemBars.only(WindowInsetsSides.Horizontal)
    )
}

and applied it to the Root composable. I figured out this should be enough and it just 2 file change. What do you think ? Thank you

[Stylianos Gakis]

Uhmm I guess that's fine 😅 I don't know much about what other configurations your app can find itself in on iOS to be fair 😅

[Michal Janecek]

Well I can not think about any scenario where the horizontal system-added padding would be non-zero in portrait mode. I hope so 😅 I am a little bit hesitant to release it but I guess there is no other option, I tried it on few simulators and it looks ok. Thanks a lot for your confirmation, I am a lot more comfortable pushing it to prod now

[Stylianos Gakis]

Haha just don't blame me if it breaks somewhere 😂

[Michal Janecek]

@Stylianos Gakis There is a new comment on the youtrack issue you created, it seems like the Jetbrains team is no able to reproduce the issue 😞

[Michal Janecek]

@Stylianos Gakis I did some experiments yesterday and I found out the issue is only on iOS 26, not on 26.2 or 26.4

[Michal Janecek]

@Stylianos Gakis 🚨🚨 New version of CMP just dropped and it contains the fix!

[Stylianos Gakis]

cheers