Honye/weapp-mark

潜在兼容性bug

tao2years opened this issue · 2 comments

在项目中,发现没有使用wx.getSystemInfo这个API去获取使用机型的系统信息。
然后通过windowWidth,windowHeight和safeArea来调整小程序的布局设置。

没有通过wx.getSystemInfo的适配,在部分机型上可能会出现一些样式问题。

您好,方便确认一下该问题吗。

Honye commented

什么机型存在问题呢?
iPhone 的下巴项目中是有适配的。参考 style/common.wxss

/* iPhone X 系列下巴占位 */
.iphonex-bottom-holder {
padding-bottom: env(safe-area-inset-bottom);
padding-bottom: constant(safe-area-inset-bottom);
}
@supports (padding-bottom: env(safe-area-inset-bottom)) {
.iphonex-bottom-holder {
padding-bottom: env(safe-area-inset-bottom);
}
}
@supports (padding-bottom: constant(safe-area-inset-bottom)) {
.iphonex-bottom-holder {
padding-bottom: constant(safe-area-inset-bottom);
}
}

在需要适配 iPhone 下巴的地方放一个占位元素就好,如:

<view class="container">
  <view class="fixed-bottom">
    <view>固定在底部的内容</view>
    <view class="iphonex-bottom-holder"><!-- iPhone 下巴占位 --></view>
  </view>
</view>

您好我是直接从代码中去看的没有注意样式代码,不好意思。
之前看到的问题的确在IPhoneX系统较多,还有部分刘海屏手机的头部导航栏也可能有一些显示问题。