关于适配iPhoneX , react-native-safe-area-view 的坑



  • react-native-safe-area-view应该怎么使用??

    为了适配iPhoneX,且不升级RN版本
    找到了找个库

    但是试了很多方法(可能自己设置的不对)

    就是无法正常运行起来项目
    有用过的说下方法吗?

    我是先install react-native-safe-area-view了这 库
    然后就报错:
    error: bundling failed: ambiguous resolution: module /Users/dongfanggouwu-xiong/WebstormProjects/untitled/index.js tries to require react-native, but there are several files providing this module. You can delete or fix them:

    • /Users/dongfanggouwu-xiong/WebstormProjects/untitled/node_modules/react-native-safe-area-view/node_modules/react-native/package.json
    • /Users/dongfanggouwu-xiong/WebstormProjects/untitled/node_modules/react-native/package.json

    在官网看到要改dependencies ,把React和RN都丢到peerDependencies里, 我改了 react-native-safe-area-view 中的package么有用, 改了整个项目的也没有用
    求大神帮忙



  • 不知道iphone x 哪里坑你了 你可以看看这个是否有帮助 https://github.com/happypancake/react-native-tab-navigator/issues/165



  • @Mad-hu19 不是一回事啊 老哥



  • 好像我前几天遇到类似的,重启电脑跟xcode什么的,就好了,😶😶



  • @lizhuoyuan 我曹,我也遇到了和你同样的错误,这个到底怎么用啊,兄弟你找到解决方案了吗。是不是把那个js文件单独拿出来用啊?希望可以得到回复



  • @lizhuoyuan 另外我在git上提了这个问题,我也在等回答



  • @Versus2017
    我自己写了适配的样式
    希望对你有帮助
    http://blog.csdn.net/u011272795/article/details/78592605



  • 这个问题我已经解决了:

    1. react-native-safe-area-view,直接npm install 是无法使用的,会报错,如上。
    2. 解决方案:我用的是 最新版本的 react-navigation 里的 SafeAreaView, 是可以直接用的。 非常感谢!
      代码如下:
      import 'SafeAreaView' from 'react-navigation
      // SafeAreaView 尽量包裹在最外层
      <SafeAreaView> // ContentView... </SafeAreaView>


  • @Versus2017 说:

    react-navigation

    react-navigation 可以完美适配iphone X
    react-native-safe-area install 以后需要react-native link



  • @jeremyzj 这个在github上也没说啊,真的是坑,我还没试过,你试过没问题的话,那就行。多谢老铁!



  • @Versus2017 说:

    用了 react-navigation 里的 SafeAreaView 也没反应,是不是要用 最新的 xcode 编译一遍?
    我的 RN 版本是 0.46



  • @cheneywan 请问你说的没反应,是什么没反应,SafeAreaView没效果? 你看一下你的react-navigation 版本是不是包含 SafeAreaView, 并且是否运行的是iPhone X模拟器或者真机



  • @Versus2017

    是没效果,也就是上下两端还是黑的
    react-navigation 是最新版本,包含了 SafeAreaView 的
    在 iPhone X 真机上测试的,由于 我 xcode 是 8.2 的,没 iPhone X 模拟器



  • @cheneywan 哦,我懂你的意思,首先你要设置开启iPhone X的适配,你不开启怎么都是这样的,开启的方式是: 设置iPhone X 启动图 才可以使用iPhone X 屏幕适配。 如果没有,那代表你不需要使用iPhone X



  • @Versus2017

    原来如此,设置iPhone X 启动图是在哪里?是要在 最新 的 xcode 的里设置么?



  • @cheneywan 。。当然啦 要在Xcode 里 的 assets 设置


登录后回复