estou enfrentando os mesmos problemas

System:
    OS: macOS 10.16
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Memory: 493.38 MB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.4.0 - ~/.nvm/versions/node/v14.4.0/bin/node
    Yarn: 1.22.4 - ~/.nvm/versions/node/v14.4.0/bin/yarn
    npm: 6.14.5 - ~/.nvm/versions/node/v14.4.0/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.5, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK:
      API Levels: 25, 27, 28, 29
      Build Tools: 28.0.3, 29.0.0
      System Images: android-27 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 3.6 AI-192.7142.36.36.6308749
    Xcode: 11.5/11E608c - /usr/bin/xcodebuild
  Languages:
    Python: 2.7.16 - /usr/local/bin/python
  npmPackages:
    @react-native-community/cli: ^4.5.1 => 4.5.1 
    react: 16.11.0 => 16.11.0 
    react-native: 0.62.0 => 0.62.0 
  npmGlobalPackages:
    *react-native*: Not Found

no entanto, estou no Xcode-beta e iOS 14

Eu tenho o mesmo problema!

mesmo problema...

mesmo problema...

Ok, descobri que o problema com Imagens só acontece quando a compilação é feita com o Xcode 12 Beta. Quando faço uma compilação usando o Xcode 11.5 usando o iOS 14.0 Beta Device Support obtido aqui , as imagens funcionam bem.

Este é um problema duplicado -- https://github.com/facebook/react-native/issues/29215

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Funcionou muito obrigado.

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil

se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.

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

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

Mesmo problema com react native 0.62.x. Alguma chance de a correção ser portada por pacote? O RN 0.63.x ainda está extremamente bugado e não podemos atualizar.

Mesmo problema com react native 0.62.x. Alguma chance de a correção ser portada por pacote? O RN 0.63.x ainda está extremamente bugado e não podemos atualizar.

Acho que é melhor usar um fork ou aplicar um pacote de patch por enquanto.

Consegui resolver o problema aplicando o patch sugerido. Confirmo que funciona bem com as versões anteriores do RN:

RN: 0,62,2
Código X: 12.0
Simulador iOS: 14

Adicionando um esclarecimento (para outros novatos para patch-package como eu) a pasta "patches" tem que ir no nível raiz do projeto.

Usar a biblioteca de patches apenas para isso parece um exagero. Seria muito difícil adicioná-lo como um patch menor para 0.62.2 (talvez torná-lo 0.62.3?). São realmente 3 linhas de código.

Como está agora, o 0.63.x tem alguns bugs importantes e parece que eles não serão resolvidos tão cedo (0.64.x está chegando), então estamos presos ao 0.62 no futuro próximo.

Usar a biblioteca de patches apenas para isso parece um exagero.

Não use o pacote de patches...

Você não quer usar um pacote de patch, você não quer atualizar seu aplicativo para a versão mais recente, mas por que "forçar" os desenvolvedores a ignorar um roteiro inteiro?
Por que você não quer fazer algo, mas quer fazer as pessoas fazerem o que você quer?

O patch funcionou perfeitamente aqui. 0.62.2

Mesmo problema com react native 0.62.x. Alguma chance de a correção ser portada por pacote? O RN 0.63.x ainda está extremamente bugado e não podemos atualizar.

ei cara, basta adicionar isso à sua pasta de patches em react-native+0.62.2.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..0ff66f3 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -275,6 +275,8 @@ - (void)displayLayer:(CALayer *)layer
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
+  } else {
+    [super displayLayer:layer];
   }
 }

diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

e execute npx patch-package

Este é o patch para 0.61.5

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 01aa75f..24c1075 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -267,8 +267,10 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink
 - (void)displayLayer:(CALayer *)layer
 {
   if (_currentFrame) {
-    layer.contentsScale = self.animatedImageScale;
-    layer.contents = (__bridge id)_currentFrame.CGImage;
+      layer.contentsScale = self.animatedImageScale;
+      layer.contents = (__bridge id)_currentFrame.CGImage;
+  } else {
+      [super displayLayer:layer];
   }
 }

Você sempre pode substituir seus componentes de imagem por FastImage. Dessa forma, você não precisa corrigir nada. As imagens carregam melhor também.

Para quem está usando a correção patch-package e tem configuração de CI/CD lembre-se de adicionar "postinstall": "patch-package" no seu package.json

Você sempre pode substituir seus componentes de imagem por FastImage. Dessa forma, você não precisa corrigir nada. As imagens carregam melhor também.

FastImage não é uma biblioteca mantida com muitos bugs.

Por que você acha que é melhor?

FastImage está funcionando Você pode usá-lo

@johnlim5847 onde adicionar "postinstall": "patch-package" nesta linha em package.json?

Obtendo este erro ao executar: npx patch-package
Aplicando patches...
Erro: Arquivo de patch encontrado para o pacote react-native que não está presente em node_modules/ react-native

@shrimallamanoj você deve acessar https://github.com/ds300/patch-package primeiro

Sim ... obrigado, eu segui o passo e o patch foi aplicado com sucesso e não vem problema ao executar o npx, mas parece que a solução não está funcionando para mim .. ruim ... alguma outra solução?

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Pessoal, esse patch funciona no React native 0.61.5 também. Eu uso a mesma solução alternativa.

1.- execute "yarn add patch-package"
2.- Crie uma nova pasta chamada patches na raiz do projeto.
3.- Crie um novo arquivo chamado react-native+0.61.5.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute o "yarn patch-package" na raiz do projeto ou coloque-o em um script de pós-instalação

Eu sigo este link para corrigir o problema sobre imagens no IOS14.

• compilação limpa no Xcode (CMD + Shift + K)
• redefina o cache com npx react-native start --reset-cache
• Construindo com o XCode, e tudo funciona bem novamente
  Estou usando React native 0.62.2
  GL a todos.

não uma correção, mas uma observação, se você mantiverlado de dentroestá mostrando a imagem.

Eu vejo o mesmo bug, mas apenas durante o processo de desenvolvimento. Isso aconteceu depois que atualizei meu telefone e o programa xcode. (ios14, xcode12) O estranho é que quando baixo meu aplicativo do mercado, não consigo ver as imagens estáticas. Posso ver as fotos quando tento de um telefone diferente. meu ambiente de desenvolvimento foi completamente arruinado após a atualização.

Editar manualmente o arquivo RCTUIImageViewAnimated.m como @tomcheung sugere acima corrige o problema na versão 0.61.5. Obrigado!

Sugestões: Não atualize para 0.63 apenas patch. Eu tentei atualizar, a compilação falhou devido a firebase , code-push .

Ainda enfrentando esse problema, alguém pode aconselhar se o patch é atualmente a melhor solução para o problema?

Existe um patch para 0.61.2?

Existe um patch para 0.61.2?

Para mim. Está resolvido.

0.62.2 está resolvido. mas o dispositivo real falhou ....
Há uma solução?

https://github.com/huylvdev/react-native-fix-image funciona para mim

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

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

funciona para mim, obrigado

Para mim. Está resolvido.

Desculpe, não entendi, o que você quer dizer? Qual patch você aplicou?

a solução que funcionou para mim apenas corrigiu temporariamente porque você tem que corrigi-la dentro dos módulos do nó, existe alguma outra maneira de evitar que isso aconteça no futuro?

Para versão nativa de reação < 0,63
Por favor, use react -native-fast-image em vez de ReactNative Image
Para funcionar com react-native-fast-image , desative o fallback de react-native-fast-image
É trabalho no IOS 14!

Para mim. Está resolvido.

Desculpe, não entendi, o que você quer dizer? Qual patch você aplicou?

@EmmanueleVilla aplique este patch https://github.com/facebook/react-native/issues/29279#issuecomment -658244428 e use o pacote de patch para mantê-lo :)

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Pessoal, esse patch funciona no React native 0.61.5 também. Eu uso a mesma solução alternativa.

1.- execute "yarn add patch-package"
2.- Crie uma nova pasta chamada patches na raiz do projeto.
3.- Crie um novo arquivo chamado react-native+0.61.5.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute o "yarn patch-package" na raiz do projeto ou coloque-o em um script de pós-instalação

Também estou executando 61.5, isso funcionou para mim! Eu estou supondo que se você tiver uma versão diferente de 61.5, apenas renomeie o arquivo de patch para usar sua versão e, quando você executar yarn patch-package , ele aplicará o patch, pois detecta que sua versão nativa de reação corresponde.

por exemplo, para a versão 61.2, nomeie seu arquivo de patch react-native+0.61.2.patch

#import "RCTUIImageViewAnimated+WLAdd.h"
#import <objc/runtime.h>

<strong i="5">@implementation</strong> RCTUIImageViewAnimated (WLAdd)

+ (void)load {
  static dispatch_once_t onceToken;
  dispatch_once(&onceToken, ^{
    Method fromMethod = class_getInstanceMethod([self class], @selector(displayLayer:));
    Method toMethod = class_getInstanceMethod([self class], @selector(wl_displayLayer:));
    method_exchangeImplementations(fromMethod, toMethod);
  });
}

- (void)wl_displayLayer:(CALayer *)layer {
  UIImage *currentFrame = [self valueForKey:@"currentFrame"];
  CGFloat animatedImageScale = [[self valueForKey:@"animatedImageScale"] floatValue];
  if (currentFrame) {
      layer.contentsScale = animatedImageScale;
      layer.contents = (__bridge id)currentFrame.CGImage;
    } else {
      [super displayLayer:layer];
    }
}

<strong i="6">@end</strong>

Isso funciona para mim em v0.61.4 embora haja uma maneira muito mais simples de gerar o arquivo de patch.

tl;dr Siga as instruções no próprio https://github.com/ds300/patch-package .

Aqui estão as instruções detalhadas:
Esta é a correção que foi feita no código-fonte React Native v0.63.2 : https://github.com/facebook/react-native/commit/123423c2a9258c9af25ca9bffe1f10c42a176bf3

# make the change in `node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m` file
if (_currentFrame) {
  layer.contentsScale = self.animatedImageScale;
  layer.contents = (__bridge id)_currentFrame.CGImage;
} else {
  [super displayLayer:layer];
}

# run patch-package to create a .patch file
npx patch-package react-native

# this will generate the patch file in the patches folder
# patches/react-native+0.61.4.patch

# then add to postinstall script
"scripts": {
  "postinstall": "patch-package"
 }

Espero que isto ajude!

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Eu tenho esse problema ao usar o RN v0.61.2, mas isso ainda funcionou para mim. Obrigado

Para versão nativa de reação < 0,63
Por favor, use react -native-fast-image em vez de ReactNative Image
Para funcionar com react-native-fast-image , desative o fallback de react-native-fast-image
É trabalho no IOS 14!

Tem funcionado para mim!

pacote de patch de fios

Para mim. Está resolvido.

Desculpe, não entendi, o que você quer dizer? Qual patch você aplicou?

@EmmanueleVilla aplica este patch #29279 (comentário) e depois usa o pacote de patch para mantê-lo :)

Você é o cara @jkim430 Obrigado

Tentei todas as soluções em 0.61.4, as imagens remotas estão carregando bem, mas os ativos locais não serão exibidos apenas.

Alguma ideia?

Obrigado xcode..

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil

se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.

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

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

Funcionou para mim. Obrigado! Além disso, você pode usar npx patch-package (mais informações aqui ) para manter essa alteração e não precisa ficar corrigindo todos os tempos node_modules é reinstalado.

Esses são os tipos de bugs que me fazem querer abrir qualquer outro negócio e deixar de ser programador.

https://github.com/huylvdev/react-native-fix-image funciona para mim

Muito obrigado Depois de passar um dia, finalmente consertei com esta ajuda

Posso confirmar que este patch também pode ser aplicado à versão 0.63.2. Renomeie o arquivo para (react-native+0.62.2.patch).

Por favor, abra novamente este problema,
Isso ainda não está resolvendo o problema.

https://github.com/huylvdev/react-native-fix-image funciona para mim

Muito obrigado Depois de passar um dia, finalmente consertei com esta ajuda

Ei, eu tentei usar react-native-fix-image funcionou quando estou fazendo
npx react-native-fix-image mas quando estou removendo os node_modules e reinstalando-os.
O aplicativo não carrega as imagens.
Você enfrentou algum problema e temos que executar o comando npx toda vez para renderizar as imagens.

aqui está
https://github.com/facebook/react-native/issues/29279#issuecomment -658244428

https://github.com/huylvdev/react-native-fix-image funciona para mim

Muito obrigado Depois de passar um dia, finalmente consertei com esta ajuda

Isso é trabalho para mim! Obrigado!!

Não está funcionando para mim no modo de lançamento, alguma ideia?

@tomcheung muito obrigado!
Bati a cabeça 2 dias para descobrir qual é o problema...

Para aqueles executando versões mais antigas do React Native (por exemplo, 0.60.6), o patch não é possível, pois o arquivo RCTUIImageViewAnimated.m não existe. Resolvi esse problema usando React Native Fast Image v8.1.5 e atualizando o pod SDWebImage com pod update SDWebImage . Mais especificamente, atualizei o SDWebImage de v5.8.1 para v5.9.2.

Fonte: https://github.com/DylanVann/react-native-fast-image/issues/702#issuecomment -653930858

Imagens não exibidas na versão de lançamento. (projeto da expo 39 ejetado) RN 0.63.3
atualização: atualizar metro.config.js corrigiu meu problema => https://forums.expo.io/t/assets-missing-only-in-ios-release-build-after-ejecting/42759

Isso será oficialmente corrigido em qualquer versão do RN? Afaik, o problema ainda está lá.

Isso será oficialmente corrigido em qualquer versão do RN? Afaik, o problema ainda está lá.

+1. De vez em quando estou em um projeto antigo e tenho que corrigi-lo ..

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.mb/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
índice 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

• (void)displayLayer:(CALayer *)camada
  {
  
  
  
  • if (!_currentFrame) {
  
  
  • _currentFrame = self.image;
  
  
  • }
    
    if (_currentFrame) {
    
    layer.contentsScale = self.animatedImageScale;
    
    layer.contents = (__bridge id)_currentFrame.CGImage;
    
    diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
    
    novo modo de arquivo 100644
    
    índice 0000000..361f5fb
    
    --- /dev/null
    
    +++ b/node_modules/react-native/scripts/.packager.env
    
    @@ -0,0 +1 @@
    
    +exportar RCT_METRO_PORT=8081
  
  

Obrigado! Isso funcionou para mim em todos os meus projetos antigos de RN.
Basta substituir a versão React Native do seu projeto antigo em vez de 0.63 antes de criar o arquivo de react-native+0.63.0.patch .

Eu criei um vídeo e espero que isso ajude alguém.

A correção do @AsbarAli funcionou para mim, versão RN: 0.61.5.

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil
se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.
https://github.com/facebook/react-native/blob/1c634a921887caf02f1b9fba6fd177c352f9ef78/Libraries/Image/RCTUIImageViewAnimated.m#L283 -L289

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

Funcionou para mim. Obrigado! Além disso, você pode usar npx patch-package (mais informações aqui ) para manter essa alteração e não precisa ficar corrigindo todos os tempos node_modules é reinstalado.

Esses são os tipos de bugs que me fazem querer abrir qualquer outro negócio e deixar de ser programador.

É importante que você execute npx patch-package react-native para que o patch seja aplicado.

Ei a todos, alguém poderia confirmar que isso foi mesclado ao núcleo?

Embora o pacote de patches seja uma solução, não deve ser permanente.

Vou manter isso em aberto até que eu possa investigar.

Eles não estão planejando consertar isso?

https://www.npmjs.com/package/react-native-fix-image
trabalhando para mim

Parece que está consertado. Só não será portado de volta para versões anteriores. Eu acredito que a correção está em 63.3

A correção do @AsbarAli funcionou para mim, versão RN: 0.61.5.

Como você fez isso? estou usando RN 61.2

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!
1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Eu tenho esse problema ao usar o RN v0.61.2, mas isso ainda funcionou para mim. Obrigado

Oi, você pode me ajudar? Eu também tenho RN 61.2, mas não funciona. As imagens de navegação inferior podem não estar sendo exibidas

Ei @rjtubera , o patch deve funcionar com 0.63, embora supostamente funcione também com a versão 0.61.5 do React Native. Talvez se você tentar atualizar do React Native 0.61.2 para 0.61.5, e reaplicar os passos citados, pode funcionar.

Se isso não funcionar, tente atualizar para 0.63 e faça o mesmo. Embora tenha cuidado, pois alguns de seus componentes podem quebrar. Você deve testar todos os componentes após a atualização para garantir que tudo ainda funcione bem (no iOS e Android).

Eu encontro esse problema, eu o corrigi seguindo as etapas neste link
https://github.com/facebook/react-native/pull/29420#issuecomment -707435412

Obrigado Alabi, resolvi o problema também corrigindo o React Native. Funcionando bem agora até agora 😊

De: Alabi Temitope Wahab [email protected]
Responda para: facebook/react-native [email protected]
Data: terça-feira, 13 de outubro de 2020 às 03:56
Para: facebook/react-native [email protected]
Cc: Kieran Desmond [email protected] , Comentário [email protected]
Assunto: Re: [facebook/react-native] A imagem não pode mostrar a imagem no iOS 14 (#29279)

Eu encontro esse problema, eu o corrigi seguindo as etapas neste link

29420 (comentário) https://github.com/facebook/react-native/pull/29420#issuecomment-707435412

—
Você está recebendo isso porque comentou.
Responda a este e-mail diretamente, visualize-o no GitHub https://github.com/facebook/react-native/issues/29279#issuecomment-707436028 ou cancele a inscrição https://github.com/notifications/unsubscribe-auth/AIENJUWD2RES5AC52CT4MG3SKOXURANCNFSM4ORGDXZA .

Eu atualizei para a versão 0.63 do react native, mas estou enfrentando o mesmo problema, alguém pode me ajudar?

Para aqueles executando versões mais antigas do React Native (por exemplo, 0.60.6), o patch não é possível, pois o arquivo RCTUIImageViewAnimated.m não existe. Resolvi esse problema usando React Native Fast Image v8.1.5 e atualizando o pod SDWebImage com pod update SDWebImage . Mais especificamente, atualizei o SDWebImage de v5.8.1 para v5.9.2.

Fonte: DylanVann/react-native-fast-image#702 (comentário)

Funciona perfeitamente.

A versão 8.3.2 do react-native-fast-image inclui até a versão atualizada do SDWebImage, então não há necessidade de pod update !

https://www.npmjs.com/package/react-native-fix-image
trabalhando para mim

Trabalhou para mim também. 👍

A atualização do React-Native 0.63.1 para 0.63.2 funcionou para nós.

Estou enfrentando o mesmo problema em RN 0.62.2 no Xcode 12.0.1. e ios 14 . Qualquer solução?

Estou enfrentando o mesmo problema em RN 0.62.2 no Xcode 12.0.1. e ios 14 . Qualquer solução?

@ghasemikasra39 Eu estava enfrentando o mesmo problema com suas mesmas versões. A instalação do react-native-fix-image funcionou para mim.

@RutsSantos certo nisso também funcionou para mim!

1) npm install --save react-native-fix-image
2) npx react-native-fix-image
3) projeto de reconstrução

A atualização do React-Native 0.63.1 para 0.63.2 funcionou para nós.

Isso funcionou para mim.

Isso funcionou para mim. Obrigado @JordanRosas

@JordanRosas Funcionou maravilhosamente para mim também, obrigado

upgrade react versão nativa de 0.62.2 para 0.63.3 não há mais necessidade de corrigir ou instalar módulos npm

0.62.3 não existe:

0,63,3
0.63.2
0.63.1
0,63,0 3,0
0,63.0-rc.1
0,63,0-rc.0
❯ 0,62,2
0,62,1
0,62,0

0,63,3
0.63.2
0.63.1
0,63,0
0,63.0-rc.1
0,63,0-rc.0
❯ 0,62,2
0,62,1
0,62,0

corrigido

Alguns de nós não podem atualizar até que esse bug crítico do RN seja resolvido: https://github.com/facebook/react-native/issues/29451

Portanto, ou estamos presos ao patch de macaco 0.62.x ou a uma versão 0.63.x com bug.

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil

se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.

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

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

Funciona. Obrigado!

Se você não quiser instalar nenhum pacote ou editar diretamente node_modules , tente adicionar um gancho de estágio preinstall no podfile como em https://stackoverflow.com/a/64495360/7477198 this trabalhou para mim. Isso é mais amigável ao git.

Para mim, mesmo no RN 63.3, as imagens não estão aparecendo em um dispositivo físico. Como solução alternativa, codifiquei as imagens na base 64 aqui: https://www.base64-image.de/ e usei isso como source para o componente Image em vez de require('imagePath')

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil

se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.

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

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

Você é um gênio, você salvou minha vida!

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Obrigado
funcionou para mim bem em RN 0.61.5
eu adicionei um arquivo de patch chamado react-native+0.61.5.patch

também uma correção para DylanVann/react-native-fast-image
cd ios && pod update SDWebImage

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

@legion-zver Obrigado pela correção! O RCT_METRO_PORT é necessário aqui ou algo específico para o seu projeto?

RN 0.59.0 no Xcode 12.0.1. e ios 14. Alguma solução?

RN 0.59.0 no Xcode 12.0.1. e ios 14. Alguma solução?

3 soluções:

1. Corrija o problema manualmente em node_modules
2. Use esta biblioteca de correção https://www.npmjs.com/package/react-native-fix-image
3. Atualização para React Native 0.63.3

Posso confirmar que isso ainda existe em --configuration=Release , mesmo em "react-native": "0.63.3" . Funciona bem em --configuration=Debug no entanto.

https://www.npmjs.com/package/react-native-fix-image não ajuda, mas interrompe a compilação
configuração de lançamento com este erro:

.../node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m:278:5: error: expected expression
  } else {
    ^

Além disso, os usuários do meu aplicativo não experimentam carregamento de imagem (de url) no iOS, mas isso não ocorre a todos, apenas a algumas pessoas. Por favor, corrija isso. Estou usando o React Native 0.63.3.
https://i.ibb.co/1vDc6kv/1.jpg <- link para a imagem que mostra este problema

@douglasjunior funciona bem! muito obrigado!

@RutsSantos certo nisso também funcionou para mim!

1. npm install --save react-native-fix-image
2. npx react-native-fix-image
3. projeto de reconstrução

funcionou para mim 🎉🎉🎉🎉🎉

RN 0.59.0 no Xcode 12.0.1. e ios 14. Alguma solução?

3 soluções:

1. Corrija o problema manualmente em node_modules
2. Use esta biblioteca de correção https://www.npmjs.com/package/react-native-fix-image
3. Atualização para React Native 0.63.3

outro Q, eu uso .1 manualmente dentro de node_modules ， funciona bem em mostrar imagem da rede, mas não consigo mostrar imagem local,

Além disso, os usuários do meu aplicativo não experimentam carregamento de imagem (de url) no iOS, mas isso não ocorre a todos, apenas a algumas pessoas. Por favor, corrija isso. Estou usando o React Native 0.63.3.
https://i.ibb.co/1vDc6kv/1.jpg <- link para a imagem que mostra este problema

Eu encontro problema que me ocorreu. O WebP não era suportado no iOS 13, então eu precisava instalar o react-native-fast-image com o pod SDWebImageWebPCoder.

eu não suponho que alguém tenha um script de compilação do Microsoft App Center para corrigir isso também?

Para sua informação, também consegui superar isso usando o FastImage , que foi corrigido após a atualização do SDWebImage https://github.com/DylanVann/react-native-fast-image/issues/730 (não posso atualizar para 0,63 agora, pois ele quebra outro trabalho, eventualmente passarei para a versão mais recente)

No meu caso, eu tinha imagens animadas do RN simples, mas consegui usar FastImage para elas também usando

const AnimatedImage = Animated.createAnimatedComponent(FastImage)

<AnimatedImage source={require('....')} />

Como alternativa, o pacote de imagem de correção deve funcionar, se não funcionar no Appcenter (@krisbaum74), você poderá fazer o mesmo criando appcenter-pre-build.sh na raiz do repositório e adicionando o script com a correção lá

Estou usando o react-native 0.63.3 e ainda estou enfrentando esse problema no iOS 14.1. Isso já é aplicado nessa versão. Alguma idéia sobre como corrigi-lo?

Estou usando o react-native 0.63.3 e ainda estou enfrentando esse problema no iOS 14.1. Isso já é aplicado nessa versão. Alguma idéia sobre como corrigi-lo?

se você atualizar para 0.63.3, poderá ter problemas nesse código, tente esta biblioteca de correção https://www.npmjs.com/package/react-native-fix-image

Estou usando o react-native 0.63.3 e ainda estou enfrentando esse problema no iOS 14.1. Isso já é aplicado nessa versão. Alguma idéia sobre como corrigi-lo?

se você atualizar para 0.63.3, poderá ter problemas nesse código, tente esta biblioteca de correção https://www.npmjs.com/package/react-native-fix-image

Já atualizei para 0.63.3 e esta biblioteca não resolve o problema (As imagens são carregadas no simulador, mas não no dispositivo físico.

Estou usando o react-native 0.63.3 e ainda estou enfrentando esse problema no iOS 14.1. Isso já é aplicado nessa versão. Alguma idéia sobre como corrigi-lo?

se você atualizar para 0.63.3, poderá ter problemas nesse código, tente esta biblioteca de correção https://www.npmjs.com/package/react-native-fix-image

Já atualizei para 0.63.3 e esta biblioteca não resolve o problema (As imagens são carregadas no simulador, mas não no dispositivo físico.

Meu problema estava relacionado à cópia dos ativos para a compilação de produção, havia um link ruim, conforme explicado aqui , então regenere o pacote e tente novamente

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Muito obrigado!!!! Você literalmente salvou meu dia 🙏 ❤️

Ele pode exibir a imagem depois de adicionar [super displayLayer:layer]; se _currentFrame for nil

se entendi corretamente, _currentFrame deve ser para imagem animada, portanto, se for imagem estática, podemos usar a implementação UIImage para lidar com a renderização da imagem, não tenho certeza se é uma correção correta.

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

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

Funcionou para mim!!! 👍

Também atualizamos para 0.63.3 e estamos enfrentando esse problema no iOS 14.
Baixamos arquivos (imagens entre eles) usando o pacote RN-fetch-blob e carregamos essas imagens locais usando o componente Image.

@krisbaum74

eu não suponho que alguém tenha um script de compilação do Microsoft App Center para corrigir isso também?

Usar react-native+0.63.0.patch

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 21f1a06..2444713 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -272,6 +272,9 @@ - (void)displayDidRefresh:(CADisplayLink *)displayLink

 - (void)displayLayer:(CALayer *)layer
 {
+  if (!_currentFrame) {
+    _currentFrame = self.image;
+  }
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081

Como posso aplicar isso usando o pacote de patches, por favor? Iniciante com o uso do pacote de patches.

Oi!

1.- execute "npm i -g patch-package"
2.- Crie uma nova pasta chamada patches
3.- Crie um novo arquivo chamado react-native+0.63.0.patch dentro dessa pasta
4.- Adicione o código fonte acima.
5.- execute "patch-package" na raiz do projeto

Basta seguir a correção acima e criar um arquivo react-native+0.63.0.patch

depois disso, no seu appcenter-pre-build.sh, adicione

pacote de patches npm i -g
pacote de patches

Isso adicionará a correção acima em sua compilação do AppCenter.

Eu tinha isso no iOS e usei npx react-native-fix-image que funcionou muito bem. Agora estou consternado ao descobrir que o problema persiste no Android!

Nenhuma menção ao Android aqui - sou o único?

Estou balançando "react-native": "0.61.5"

_const Image = Animatable.createAnimatableComponent(FastImage);_
Não está funcionando corretamente!

animation={'bounceIn'} não está funcionando

"react-native": "0.63.3"
"react-native-fast-image": "^8.3.4"
"react-native-animatable": "^1.3.3"

Eu sei que isso é considerado um patch para 0,63, mas posso confirmar que isso também funciona em 0,62. 👍

Ainda não funciona no IOS 14.2, Xcode 12.2, react-native 0.63.4
Qualquer correção sugerida não ajuda
Atualizar
0.63.4 - mostra imagens remotas sem problemas e sem nenhum patch, mas imagens locais não funcionam com ou sem patch

Eu tenho um projeto com react-native 0.63.3, o patch não funciona para mim. Antes de aplicar o patch eu verifiquei a classe RCTUIImageViewAnimated e ela já contém o código do patch, isso é esperado pois o #29420 já está mesclado no 0.63.3 conforme alteração 0.63.2 CHANGELOG https://github.com/react-native- community/releases/blob/master/CHANGELOG.md#v0632. Então o patch não vai consertar, acho que era válido na 0.62.2 mas temo que as mudanças na 0.63.3 tenham quebrado o carregamento das imagens _local_ novamente. Isso explica porque alguns desenvolvedores fazem downgrade para <0.63.2 e aplicam o patch e as imagens ficam visíveis novamente. Eu prefiro apenas obter o 0.63.2 que contém a correção. De qualquer forma, estou hesitando em fazer o downgrade, sim, mesmo para uma versão de volta, pois não quero ficar preso no passado ;-). Eu criei uma solução alternativa que está funcionando no meu final.

Com base no fato de que para _me_ as imagens estão sendo carregadas ao usar uma URL _external_ (RN 0.63.3).
Minha solução,

• Eu sigo o padrão de ativos híbridos, você pode obter a referência aqui https://reactnative.dev/docs/images#images -from-hybrid-apps-resources
• Adicione as imagens à biblioteca de ativos iOS/Android. Isso pode ser feito manualmente, por script, XCode,...
• Referencie a imagem por seu _local_ URI em vez da _react native reference file system_, exemplo iOS abaixo

<Image
  source={{ uri: 'app_icon' }}
  style={{ width: 40, height: 40 }}
/>

• Criou uma função de utilitário para obter o URI do ativo de referência do iOS ou Android, dependendo da plataforma. Leia a documentação (https://reactnative.dev/docs/images#images-from-hybrid-apps-resources) e observe as diferenças na formatação de URI.
• As imagens começaram a aparecer no aplicativo iOS 14.2!! Testei com o aplicativo distribuído da App Store e instalação Ad Hoc

Está funcionando (para mim), mas, desvantagens,

• O modo de referência React Native é muito conveniente para deixar de lado, espero que esse problema seja resolvido e eu possa voltar ao normal.
• Mantendo a pasta de ativos potencialmente três em sincronia ... sim, é pelo script, mas os desenvolvedores esquecerão facilmente e em alguns meses alguém passará 2 dias descobrindo por que as imagens não parecem descobrir que os scripts estão desatualizados ou algo assim que você pode pensar.
• As imagens estão faltando no meu simulador, tentarei adicionar uma condicional para carregar as imagens da pasta de ativos react-native se estiver executando a partir de um simulador. Esta lib pode ajudar https://github.com/react-native-device-info/react-native-device-info (ainda não tentei).
  Espero que alguém possa se beneficiar dessa solução alternativa.

@RutsSantos certo nisso também funcionou para mim!

1. npm install --save react-native-fix-image
2. npx react-native-fix-image
3. projeto de reconstrução

funcionou para mim 🎉🎉🎉🎉🎉

Não funcionou para RN 0,61

Eu uso RN 0.61 e qualquer solução não funciona para mim. Pls, tem mais alguma solução?

Eu uso RN 0.61 e qualquer solução não funciona para mim. Pls, tem mais alguma solução?

https://www.npmjs.com/package/react-native-fix-image

Esta minha biblioteca, ainda funciona bem com RN 0.61

Eu uso RN 0.61 e qualquer solução não funciona para mim. Pls, tem mais alguma solução?

https://www.npmjs.com/package/react-native-fix-image

Esta minha biblioteca, ainda funciona bem com RN 0.61

Oi Huy, eu tentei passo a passo como o guia acima, ele mostrou a imagem de correção Concluída. Mas a imagem ainda não é exibida no ios 14. Outras versões do ios ainda exibem a imagem normalmente.
Eu uso RN 0.61 e ios 14.