美文网首页
React-Native 适配iPhoneX 目前最简单的方法

React-Native 适配iPhoneX 目前最简单的方法

作者: HT_Jonson | 来源:发表于2018-04-16 14:27 被阅读0次

iPhoneX由于多了大圆角、传感器(齐刘海)以及底部访问主屏幕的指示遮挡,所以需要注意原有这部分内容的设计。
iOS11前导航栏的高度是64,其中statusBar的高度为20,而iPhoneX的statusBar高度变为了44,如果是自定义的NaviBar,这部分需要做相应的适配。

iPhoneX的底部增加了虚拟Home区,由于安全区域的原因默认tabBar的高度由49变为83,增高了34,所以自定义的底部TabBar也需要需改其适配方案。

可能有部分APP使用了RN来实现页面,不要忘了在RN中修改相应NaviBar/TabBar的高度。

目前项目碰到了适配问题.看了几个插件,有的可能跑起来需要时间.
有的比较复杂自己封装了下,觉得还是挺简单的.
今天放出来,希望大家可以使用.
github地址:

https://github.com/JonsonHI/IphoneX/tree/master

还有官网维护的一些适配插件,我觉得使用过于复杂.

如果你的项目是0.43以下的话,name这种方式还是比较适合你的.
如果你有很好的封装,那么恭喜你,你修改的会更快.

相关文章

  • React-Native 适配iPhoneX 目前最简单的方法

    iPhoneX由于多了大圆角、传感器(齐刘海)以及底部访问主屏幕的指示遮挡,所以需要注意原有这部分内容的设计。iO...

  • 收集iOS11以及iPhone X的兼容与适配

    iPhone X的简单适配 适配iOS11&iPhoneX的一些坑 iOS应用适配iPhone X iPhone ...

  • iPhoneX 简单适配

    其它机型可以完美的充满整个屏幕了但是还是有一些小问题,特别是在用纯代码的工程中特别爱用 #define SCREE...

  • iPhoneX简单适配

    如果想看详细的iOS11变动,可转到这篇文章观看。http://www.jianshu.com/p/342142c...

  • iPhoneX简单适配

    在pch文件中定义 解决iPhoneX屏幕tabbar适配后,底部安全区的颜色跟tabbar背景色一致 其中Tab...

  • react-native适配iPhoneX

    如下图所示,iPhoneX由于多了大圆角、传感器(齐刘海)以及底部访问主屏幕的指示遮挡,所以需要注意原有这部分内容...

  • 适配iOS11,适配iPhoneX,适配安全区的几个文章和宏

    适配iOS11,适配iPhoneX,适配安全区的几个文章和宏 适配iOS11,适配iPhoneX,适配安全区的几个...

  • IPhoneX 的简单适配

    对于IPhoneX 的适配刚开始的时候还是一头雾水,然后就网上搜索文章,经过一番了解关于IPhoneX ...

  • 简单的iPhoneX 适配

    最简单的适配: 启动图片增加一张 1125 *2436px。png的启动图片,如果不知道在哪里加,找到Launch...

  • hack:iphoneX底部适配

    iphoneX的底部适配 在项目中因为底部tab栏在iphonex的显示问题 方法一 方法二 第一步:新增 viw...

网友评论

      本文标题:React-Native 适配iPhoneX 目前最简单的方法

      本文链接:https://www.haomeiwen.com/subject/mgvskftx.html