search

AlwaysLoveme / capacitor-plugin-safe-area

capacitor plugin to get safeArea info on Android and IOS, support Capacitor6
MIT License
66 stars 14 forks source link

[bug]: Incorrect Safe Areas on Pixel Phones #21

Closed mahyarmirrashed closed 7 months ago

mahyarmirrashed commented 1 year ago

I'm using the Pixel phone emulations using the Android Device Manager. I find that the safe areas are inconsistent with what I would expect.

I am using a combination of the safe area and a padding of 16 pixels. So basically, I adjust the container of the top controls down with absolute and add top: var(--safe-area-inset-top). The variable is set with insets.top from this plugin.

Here are the results on different devices:

Pixel 6a: image-1

Pixel 6 Pro: image-1

Pixel 7 Pro: image

The most correct one is the 6 Pro. The rest definitely have incorrect calculations for the top padding. Is there any way that we can fix this?

AlwaysLoveme commented 1 year ago

I'm using the Pixel phone emulations using the Android Device Manager. I find that the safe areas are inconsistent with what I would expect.

I am using a combination of the safe area and a padding of 16 pixels. So basically, I adjust the container of the top controls down with absolute and add top: var(--safe-area-inset-top). The variable is set with insets.top from this plugin.

Here are the results on different devices:

Pixel 6a: image-1

Pixel 6 Pro: image-1

Pixel 7 Pro: image

The most correct one is the 6 Pro. The rest definitely have incorrect calculations for the top padding. Is there any way that we can fix this?

The Density value of each Android device is not always the same. The obtained top value will eventually be divided by density to get the final pixel value.

mahyarmirrashed commented 1 year ago

@AlwaysLoveme Can you explain that once for me? I'm sorry, I didn't really understand it. Is the density a value that is provided and something that I should currently be doing or is it something that you plan to add in the future?

mahyarmirrashed commented 7 months ago

Following up on my previous comment @AlwaysLoveme .

AlwaysLoveme commented 7 months ago

--safe-area-inset-top

Following up on my previous comment @AlwaysLoveme .

"--safe-area-inset-top" obtains the height of the status bar on Android phones, but the height of the status bar of each mobile phone is not always the same, so the values obtained between each mobile phone are also different. within reason