RCTUIImageViewAnimated incompatible with iOS 14

[mo22]

Images do not render on iOS 14 beta devices

Please see SDWebImage/SDWebImage#3040 for a discussion.

Looks as if [super displayLayer] needs to be called manually now.

https://github.com/facebook/react-native/blob/ffa07254de914f7876a17ec2d1ecac1dc10b116a/Libraries/Image/RCTUIImageViewAnimated.m#L283

#pragma mark - CALayerDelegate

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

Please provide all the information requested. Issues that do not follow this format are likely to stall.

Description

Please provide a clear and concise description of what the bug is. Include screenshots if needed.
Please test using the latest React Native release to make sure your issue has not already been fixed: https://reactnative.dev/docs/upgrading.html

React Native version:

Run react-native info in your terminal and copy the results here.

System:
OS: macOS 10.15.5
CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
Memory: 3.83 GB / 32.00 GB
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 14.5.0 - /usr/local/bin/node
Yarn: Not Found
npm: 6.14.5 - /usr/local/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.9.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 13.5, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
Android SDK:
API Levels: 27, 28, 29
Build Tools: 28.0.3, 29.0.2
System Images: android-24 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom, android-30 | Google APIs Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 4.0 AI-193.6911.18.40.6514223
Xcode: 11.5/11E608c - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_232 - /usr/bin/javac
Python: 2.7.16 - /usr/bin/python
npmPackages:
@react-native-community/cli: ^4.10.1 => 4.10.1
react: ^16.13.0 => 16.13.1
react-native: ^0.62.2 => 0.62.2
npmGlobalPackages:
react-native: Not Found

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

Expected Results

Describe what you expected to happen.

Snack, code example, screenshot, or link to a repository:

Please provide a Snack (https://snack.expo.io/), a link to a repository on GitHub, or provide a minimal code example that reproduces the problem.
You may provide a screenshot of the application if you think it is relevant to your bug report.
Here are some tips for providing a minimal example: https://stackoverflow.com/help/mcve

[zi6xuan]

i found the same issue

[mo22]

proper fix (so that for example react-native-video also works) would be this (calling super displayLayer always):

#pragma mark - CALayerDelegate

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

[keremoge]

Should we wait for 0.63.2? or just manually fix it?

[igoriols]

Hello, there is a way to solve it without updating to 0.63.x?

[imhuy]

https://github.com/huylvdev/react-native-fix-image it works for me