很多业务场景是在底部悬浮固定差不多与屏幕等宽的一个按钮，目前单独适配iPhone X 搜索网上大家给的方案是判断iPhone X设备之后手动针对加载不同的布局参数来抬升按钮，虽说勉强可用，这样设备判断得不断增加，也很死板（现在针对XS的model名字不知道是什么，iPhone 底部安全区的大小也许不会固定不变等等），希望官方能给个解决方案，要么给判断是有操作安全区的设备，要么参考h5适配的safe-area，感谢。
收藏
回答
置顶如何适配iPhone X/XS等 底部安全区精选热门
Huang&hUang2018-10-17
| 框架类型 | 问题类型 | 终端类型 | 微信版本 | 基础库版本 |
|---|---|---|---|---|
| 小程序 | 需求 | 客户端 | 6.7.3 | 2.3.0 |
7 个回答
请 登录 后发表内容
相关问题
搜索关键字：css constant safe-area-inset-bottom
并没有用啊···一定要真机吗··
官方是否考虑出一个适配的小故事帖子呢 毕竟今年又出了几款
微信开发者工具——真机调试——扫码预览； CSS
padding-bottom: env(safe-area-inset-bottom);没有达到预期结果。 上传预览没有问题。
?? 到达怎么解决？
已解决，可以参考下：https://blog.csdn.net/qq_42354773/article/details/81018615，亲测真机有效，模拟器无效。
先判断机型为ios 然后 判断屏幕高度/屏幕宽度>1.78(普通苹果手机比例为16/9)
符合以上条件 底部增加68rpx
wx.getSystemInfoSync() 获取 platform、screenHeight，然后再模拟器上不生效（platform不是 ios），真机有效。
判断刘海系列（支付宝小程序亦通用）：platform.toUpperCase() === 'IOS' && screenHeight >= 812
然后页面适配，目前我只能一个一个适配，暂时没有或者没有找到其他更好的方法。
安全区域的高度是 68rpx
可以根据 statusBarHeight 和 是不是为 ios 来做适配
这个是刚需啊，还是麻烦解决下。。
像我是判断屏幕高度的，可能不用型号这么麻烦。。。
目前你用屏幕高度来判断是X/XS这两台设备吗，那就是说XR/XSMAX也得另外加咯？
不是。。我这里的需求是只要全面屏的 就适配底部大按钮 不光是X/XS 要单独适配X/XS的话就得用model了 而且听说现在微信获取XS/XS MAX还有问题，最近还有华为MATE20系列。。哎 希望官方尽快更新吧
并不是全面屏都有手势区的啊··有虚拟键的栏得到到高度会自动扣除吗？
我这里并不是因为手势区才调整这个 你可以用官方提供的tabbar看看 全面屏的比一般的高。。
我这边是通常要有这按钮的界面没有Tabbar控件····😆