Safe Area not working?

I seem to have a problem where safe area function doesn’t work for me? Whether or not I turn on or off safe area, the preview app doesn’t apply the necessary padding for the ios notch. Any suggestions?

Disable Safe Aera Option, does not remove the header bar on the phone.

Thank you for the reply! My question wasn’t to remove the header bar. My question was about after removing the header bar. I should clarify my situation a bit further:
I have disabled both navigation header bar and menu. When I ran the preview app on iPhone, part of the pages got covered by the notch of the iPhone. According to the appgyver documentation, the safe area should automatically consider this and create an extra space accordingly (Pages)('Safe area' What it is?) (if I read it correctly). However, it did not and turning safe area on and off had no effect whatsoever. I am not sure if it’s because safe area is not working or if it’s a bug on my part?

Hi @Minseo_Cha
Could you please share screenshots?

Hello @Abdul_Latif,
Below is the photo of the preview app with [disable safe area] off:

As you can see, the notch of the iPhone covers the page. Turning the [disable safe area] option on or off displays the same way.

Hi @Minseo_Cha

Try using a container for all the components of the page into that container and then set the layout of this container to a formula (systemVars.dimensions.viewport.height)
May be this helps

Also, there is some issue where safe area functionality is not working at all in some of the android devices .
I had reported this in bugs reports.
But not sure about iPhone.

Hello @Abdul_Latif
Thank you for the suggestion! Unfortunately the notch continues to cover the page even as I set its width and height to viewport.height and viewport.width. I did find another solution from someone else (Notch existence variable? (notch on smartphones screen) - #9 by Dimos_Vamvourellis) with detecting ios system, which works. I will report this as a potential bug and will answer with update when I can. Again, thank you so much for your help!

1 Like

Hi @Minseo_Cha
Glad that you found something else that worked.
Also let me know when you report them the big, thanks.