Fix image cannot show in iOS 14

[tomcheung]

Summary

This PR is to fix #29279, which image cannot show in iOS 14
As #29279 (comment) mention, this issue can be fixed by calling [super displayLayer:layer]; it it is still image, to let UIImageView handle still image rendering

Changelog

[iOS] [Fixed] - Fix image cannot show in iOS 14

Test Plan

Image can be shown in iOS 14 build with Xcode 12 beta, using

<Image source={require('./images/some_local_image.jpg')}/>

It may also need to test gif image is render correctly

<Image source={{uri: 'https://some_remote_gif_image.gif'}}/>

[analysis-bot]

Platform	Engine	Arch	Size (bytes)	Diff
android	hermes	arm64-v8a	6,764,156	-34
android	hermes	armeabi-v7a	6,431,774	-31
android	hermes	x86	7,151,856	-25
android	hermes	x86_64	7,041,863	-30
android	jsc	arm64-v8a	8,935,723	-29
android	jsc	armeabi-v7a	8,595,731	-21
android	jsc	x86	8,766,538	-35
android	jsc	x86_64	9,342,180	-25

Base commit: f00795d

[analysis-bot]

Platform	Engine	Arch	Size (bytes)	Diff
ios	-	universal	n/a	--

Base commit: f00795d

[facebook-github-bot]

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

[facebook-github-bot]

@shergin merged this pull request in 123423c.

[mateodaza]

Was this tested on iOS release mode? It doesn't seem to work for me

[tbanj]

If image is not showing on your ios simulator or phone the best bet is to resolve it by upgrading the react-native version within your project
below are the steps to take
`
$ npx react-native upgrade 0.63.2

resolve merge conflicts
delete podlock.file in your ios folder

run below command
gem list --local | grep cocoapods

sudo gem uninstall (each item from above command)

sudo rm -rf ~/.cocoapods

sudo gem install cocoapods

cd (PROJECT DIRECTORY)

pod init

(put cocoapod in podfile)

pod install

rm -rf ~/.cocoapods/repos/trunk/

pod cache clean --all

pod install`

https://stackoverflow.com/a/60849495/7702345

[tbanj]

I had the same issues this what I did #29420 (comment)

[mesunil2010]

This fixed for me.

[Saadnajmi]

Is there any plan to cherry pick this commit back into RN 0.62-stable ?

[udaysagartammina]

Was this tested on iOS release mode? It doesn't seem to work for me

same issue in release mode, any solution?
Thanks in advance.

[fredcoder]

If you get this error while taking the step (sudo gem install cocoapods): "You have to install development tools first".

Just run:
xcode-select --install
sudo xcode-select -s /Applications/Xcode.app/Contents/Developer

that worked for me.

[smanzini]

Summary

This PR is to fix #29279, which image cannot show in iOS 14
As #29279 (comment) mention, this issue can be fixed by calling [super displayLayer:layer]; it it is still image, to let UIImageView handle still image rendering

Changelog

[iOS] [Fixed] - Fix image cannot show in iOS 14

Test Plan

Image can be shown in iOS 14 build with Xcode 12 beta, using

<Image source={require('./images/some_local_image.jpg')}/>

It may also need to test gif image is render correctly

<Image source={{uri: 'https://some_remote_gif_image.gif'}}/>

@tomcheung But that's exactly what I've got already on react-native/Libraries/Image/RCTUIImageViewAnimated.m (see below) and still not displaying images for device... :-(

---

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

---

[cinder92]

Summary

This PR is to fix #29279, which image cannot show in iOS 14
As #29279 (comment) mention, this issue can be fixed by calling [super displayLayer:layer]; it it is still image, to let UIImageView handle still image rendering

Changelog

[iOS] [Fixed] - Fix image cannot show in iOS 14

Test Plan

Image can be shown in iOS 14 build with Xcode 12 beta, using

<Image source={require('./images/some_local_image.jpg')}/>

It may also need to test gif image is render correctly

<Image source={{uri: 'https://some_remote_gif_image.gif'}}/>

@tomcheung But that's exactly what I've got already on react-native/Libraries/Image/RCTUIImageViewAnimated.m (see below) and still not displaying images for device... :-(

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

same issue here on ios 15 and Xcode 12.5

[webdiego]

I still have this issue...any solution? It passed two years