美文网首页
关于uniapp获取ios客户端平台安全距离(底部导航条)的方法

关于uniapp获取ios客户端平台安全距离(底部导航条)的方法

作者: 小李不小 | 来源:发表于2023-08-14 11:56 被阅读0次
    1. 在uniapp中可通过内置api: uni.getSystemInfo(OBJECT) 获取系统信息,在success回调函数中会返回设备的详细信息对象,其中一个key名 ‘safeAreaInsets’ , 可以获取到在竖屏正方向下的安全区域插入位置,即设备的可使用范围外的高度或者宽度。

    例如:获取到 ios 客户端平台底部的导航条占据的高度,从而避免在页面渲染的时候元素被遮挡。

    1. 在css 代码中,获取ios客户端平台获取安全距离也可以通过 ‘env(safe-area-inset)’
    获取上安全距离: env(safe-area-inset-top)
    
    获取左安全距离:env(safe-area-inset-left)
    
    获取右安全距离:env(safe-area-inset-right)
    
    获取下安全距离:env(safe-area-inset-bottom)
    
    可以在底部的盒子加下内边距 padding-bottom: env(safe-area-inset-bottom) 避免元素被遮挡。
    
    

    相关文章

      网友评论

          本文标题:关于uniapp获取ios客户端平台安全距离(底部导航条)的方法

          本文链接:https://www.haomeiwen.com/subject/ynfcmdtx.html