Sie sind nicht angemeldet.

How to detect Notched Mobile like iphone X, XR, XS, XSmax and few android as well ?

zadda

Fortgeschrittener

  • »zadda« ist der Autor dieses Themas

Beiträge: 219

  • Nachricht senden

1

Montag, 10. Dezember 2018, 00:06

How to detect Notched Mobile like iphone X, XR, XS, XSmax and few android as well ?

Hi,

to adapt interface for smartphone with notch on top screen,
i need to know how to setup the device detection : devices="..."

to detect the notched iphone family : iPhone X, XR, XS, XSmax
i was thinking to devices="iphone+screen dimensions" or something like that
but what if next iphone gen will comes out without notch ?

for android also ? not very familiar with...


anyone already have to deal with that ?

Thanks

z

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

2

Montag, 10. Dezember 2018, 10:34

Hi,

krpano has already build-in support for iOS devices with notches - see here and the links there for more information:
https://krpano.com/forum/wbb/index.php?p…#news119iphonex

The safe-area support in krpano is currently only enabled for iOS to avoid conflicts with potentially different working implementations from Android Chrome. I have no Android device with a notch yet and at the moment it's not clear if even Android Chrome itself already really support that...

Best regards,
Klaus

zadda

Fortgeschrittener

  • »zadda« ist der Autor dieses Themas

Beiträge: 219

  • Nachricht senden

3

Montag, 10. Dezember 2018, 12:23

thanks for answering,

i'm not sure if it gonna help me,

the setting viewport-fit=cover is already added into the <meta> viewport element in the html file then the pano cover the whole screen,
there only some layers hidden by the notch who need a shift.

my project is an app : using Cordova embbeding a krpano version 1.19 pr13 (upgrading beyon pr13 cause more bugs at this point) ,
So if i use : layer[name].safearea
it will shift layers into safe area ?
for all devices or only the ones with a safe-area concern (notched) ?

z

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

4

Montag, 17. Dezember 2018, 13:54

Hi,

safe-area-support was added in 1.19-pr14.

All layers are by default inside the safe-area and layer[name].safearea=false can be used to place it 'outside' (that means relative to the fullscreen-area and not relative to the safe-area).

And the safe-area is only there when the browser reports one of course (and iOS only at the moment).

About Cordova apps - sorry, no idea about webviews, you might need to support safe-area manually at app-level and forward it to the webview...

Best regards,
Klaus

Ähnliche Themen