小程序
小游戏
企业微信
微信支付
扫描小程序码分享
使用了navigationStyle为custom设置屏幕为自定义导航条，现在有一个问题，如何识别此设备是不是刘海屏，因为需要针对刘海屏做特殊？
- 预期表现
希望通过getSystemInfo接口能够拿到是不是刘海屏，已经刘海屏的尺寸
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
= =我只做了x的 安卓的 没做。。
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
感谢，iphoneX的我做了适配，但是现在功能需求是将所有的刘海屏做适配显示，不仅仅只是iphonex+设备。还包括所有的android刘海设备。
官方没提供相应方法。。。
正常来讲 ios下和安卓下胶囊按钮的大小是一样的 胶囊按钮距离屏幕右边距离和statusBar上边距离都是一样的
下面是我测试出来的数据
iOS 真机：
top 4px
right 7px
width 87px
height 32px
iOS 模拟器：
top 6px
right 10px
安卓 真机：
top 8px
width 95px
安卓 模拟器：
可以根据这个计算 titleBar 的信息 千万别用 wx.getMenuButtonBoundingClientRect() 大bug
附送适配截图
其实现在很简单了。。。这两天我做了一下安卓的适配，这里主要是关注点有2个值 一个是statusBarHeight，当statusBarHeight大于44时则可以认为是刘海屏。另一个是胶囊高度，在安卓端胶囊48px，ios端44px。这样就可以计算出导航栏高度了，把导航栏做成组件可以在所有页面使用了。
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
= =我只做了x的 安卓的 没做。。![]()
感谢，iphoneX的我做了适配，但是现在功能需求是将所有的刘海屏做适配显示，不仅仅只是iphonex+设备。还包括所有的android刘海设备。
官方没提供相应方法。。。
正常来讲 ios下和安卓下胶囊按钮的大小是一样的 胶囊按钮距离屏幕右边距离和statusBar上边距离都是一样的
下面是我测试出来的数据
iOS 真机：
top 4px
right 7px
width 87px
height 32px
iOS 模拟器：
top 6px
right 10px
width 87px
height 32px
安卓 真机：
top 8px
right 10px
width 95px
height 32px
安卓 模拟器：
top 8px
right 10px
width 87px
height 32px
可以根据这个计算 titleBar 的信息 千万别用 wx.getMenuButtonBoundingClientRect() 大bug
附送适配截图
其实现在很简单了。。。这两天我做了一下安卓的适配，这里主要是关注点有2个值 一个是statusBarHeight，当statusBarHeight大于44时则可以认为是刘海屏。另一个是胶囊高度，在安卓端胶囊48px，ios端44px。这样就可以计算出导航栏高度了，把导航栏做成组件可以在所有页面使用了。