uniapp 苹果安全域适配

一、使用原生占位(仅App端支持)
复制代码
//在manifest.json 文件中 app-plus 中配置
"safearea": {  
    "background": "#FFFFFF",  
    "bottom": {  
        "offset": "auto"  
    }  
}
二、不使用原生占位
复制代码
//(非App端可以不在manifest中配置)
"safearea": {  
    "bottom": {  
        "offset": "none"  
    }  
}

获取系统信息

复制代码
 uni.getSystemInfo({
      success: (info) => {
        // 判断是否为iOS设备
        if (info.platform === 'ios') {
          // 去判断显示 安全边距
        }
      }
    });

动态绑定css 显示安全边距

复制代码
.xxx-view {  
    // 写在需要添加底部边距的盒子上
    padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
    padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
}
相关推荐
小王师傅661 小时前
【设计模式】装饰模式(四):框架源码实战——从 Java I/O 到 Spring 到 MyBatis
java·设计模式
深圳市益普科技有限公司1 小时前
半导体CIM数据底座:四步把多厂数据拉通
前端
nvvas2 小时前
Spring AI 2.0正式GA:Token砍掉64%,Java的AI反击战打响了
java·人工智能
程序员阿鹏2 小时前
双亲委派机制
java·jvm·数据结构·后端
步行cgn2 小时前
Spring Bean 的生命周期详解
java·后端·spring
ps酷教程2 小时前
数据权限DataPersmission
java·学习
乐迪绘防伪油墨技术分享2 小时前
特种功能油墨选型指南:温变 / 遇水 / 荧光 / UV LED 技术对比与供应商参考
前端·html·uv
cll_8692418912 小时前
WordPress Single Post 文章页美化:响应式表格、图片优化与自动悬浮 Table of Contents(CSS + JS)
前端·css
驭渊的小故事2 小时前
Java 项目-jckson序列化工具
java·开发语言
君顾12 小时前
上海24小时自助健身房系统开发实战指南:从架构设计到功能实现
java·开发语言·健身房