钉钉里的微应用iOS底部安全区域的颜色修改,可以通过在app-plus
节点下添加一个safearea
字段来实现。在这个字段中,你可以根据需要设定不同的配置,比如底部安全区域的偏移和背景颜色等。值得注意的是,如果你需要将元素固定在底部的tabbar之上,可以使用CSS的env
函数来计算安全区域的高度。
另外,对于iPhone X等部分iOS机型,Webkit提供了一个CSS函数用于设定安全区域与边界的距离,有四个预定义的变量:safe-area-inset-left
、safe-area-inset-right
、safe-area-inset-top
和safe-area-inset-bottom
。其中,safe-area-inset-bottom
可以获取到当前机型的底部安全区域高度(单位px)。
不过值得一提的是,钉钉已经自动适配了iPhone X的安全底,所以开发者并不需要手动进行适配。具体来说,不需要使用类似height: calc(100% - env(safe-area-inset-bottom));
这样的代码进行高度适配,也不需要再meta中加入viewport-fit=cover
属性,否则可能导致屏幕跨过安全区域,自动占满整个屏幕。