未在iOS 14升级中加载react-native图像

如何解决未在iOS 14升级中加载react-native图像

升级iOS 14版本后，React Native无法构建。将XCode的构建设置切换为“旧版的构建设置”并成功构建。

但是新版本不加载图像，并且图像的原始部分现在是白屏

<Image
  source={require('./images/home.png')}
/>

系统规格

Environment:
Xcode Version 12.0
Simulator: IPhone X - 2nd generation - 14.0
"react": "16.11.0","react-native": "0.62.2"

解决方法

这是React-native

此问题已修复，已合并以响应本机最新版本。但是，如果您想立即修复项目或使用的版本低于0.63.2，则有解决方案。（感谢https://bityl.co/3ksz）

第一解决方案：如果您可以更新React Native

将本机更新到v0.63.2或更高版本

它在此版本中已得到修复：https://github.com/react-native-community/releases/blob/master/CHANGELOG.md#v0632

第二个解决方案：如果您无法更新React Native

从以下位置打开文件：

node_modules / react-native / Libraries / Image / RCTUIImageViewAnimated.m

编辑源

来自

#pragma mark - CALayerDelegate

- (void)displayLayer:(CALayer *)layer
{
  if (_currentFrame) {
    layer.contentsScale = self.animatedImageScale;
    layer.contents = (__bridge id)_currentFrame.CGImage;
  }
}

收件人

#pragma mark - CALayerDelegate

- (void)displayLayer:(CALayer *)layer
{
  if (_currentFrame) {
    layer.contentsScale = self.animatedImageScale;
    layer.contents = (__bridge id)_currentFrame.CGImage;
  } else {
    [super displayLayer:layer];
  }
}

进行补丁

npx patch-package react-native

使跟踪文件成为GIT文件

git add patches/*

用于自动应用补丁的添加包脚本

package.json

"scripts": {
  ...
  "postinstall": "patch-package",}

无论何时安装软件包，它都会从所有补丁文件中进行补丁。

我在React Native版本"0.63.0"上有同样的问题。当我将Xcode更新为版本 12.0 （12A7209）时，该项目不是基于Simulator iPhone 11（iOS 14）构建的。

解决方案（这些不是步骤，每个步骤都可以作为解决方案）：

在版本14之前的iOS上使用Simulator
在Xcode的设置中使用Legacy Build Settings

注意：正确的解决方案应该来自苹果或React Native，并且上述解决方案是临时的。

我在React本机版本0.62上遇到了同样的问题。当我更新Xcode版本12.0.1和Catalina MacOs版本10.15.7时最初不加载本地和远程URL之后，我在0.62版中添加了补丁文件，该时间本地和远程URL图像显示在模拟器中，但无法在TestFlight构建和iPhone中使用设备iOS 14及更高版本。但不能在TestFlight构建和App Store中使用。尝试解决某些问题后，我将本机版本0.62升级到0.63.4 后，此问题已解决。没有任何补丁。以及ios Podfile中的更改。

＃pod'ReactCommon / callinvoker'，：path =>“ ../node_modules/react-native/ReactCommon” //评论
pod'React-callinvoker'，：path =>“ ../node_modules/react-native/ReactCommon/callinvoker” //添加此行

添加pod文件后，更新pod并运行并遵循以下命令。

        1.     npm install --save react-native-fix-image.                      
        2.     npx react-native-fix-image
        3.    add pod install command in ios dierectory

完成所有步骤后，在iOS 14及更高版本中运行的应用程序设备支持也将在TestFlight构建和Appstore构建中运行Save my Life。祝你好运！

添加[super displayLayer:layer]后可以显示图片；如果_currentFrame 为nil 如果我理解正确的话，_currentFrame 应该是用于动画图像的，所以如果它是静止图像，我们可以使用UIImage 实现来处理图像渲染，不确定它是否正确修复。

node_modules > react-native > 库 > 图像 > RCTUIImageViewAnimated.m

if (_currentFrame) {
    layer.contentsScale = self.animatedImageScale;
    layer.contents = (__bridge id)_currentFrame.CGImage;
  } else {
    [super displayLayer:layer];
  }

未在iOS 14升级中加载react-native图像

如何解决未在iOS 14升级中加载react-native图像

解决方法

相关推荐