동일한 문제에 직면하고 있습니다.

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

그러나 Xcode-베타 및 iOS 14에서 메신저

나는 같은 문제가있다!

같은 문제...

같은 문제...

좋아, 이미지 문제는 Xcode 12 베타로 빌드할 때만 발생한다는 것을 알게 되었습니다. 여기 에서 얻은 iOS 14.0 베타 장치 지원을 사용하여 Xcode 11.5를 사용하여 빌드를 만들면 이미지가 제대로 작동합니다.

이것은 중복 문제입니다 -- https://github.com/facebook/react-native/issues/29215

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

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

감사합니다.

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.

내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.

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];
  }

반응 네이티브 0.62.x와 동일한 문제입니다. 수정 사항이 팩 이식될 가능성이 있습니까? RN 0.63.x는 여전히 매우 버그가 있어 업그레이드할 수 없습니다.

반응 네이티브 0.62.x와 동일한 문제입니다. 수정 사항이 팩 이식될 가능성이 있습니까? RN 0.63.x는 여전히 매우 버그가 있어 업그레이드할 수 없습니다.

지금은 포크를 사용하거나 패치 패키지를 적용하는 것이 가장 좋습니다.

제안된 패치를 적용하여 문제를 해결할 수 있었습니다. 이전 RN 버전에서 잘 작동함을 확인합니다.

RN: 0.62.2
엑스코드: 12.0
iOS 시뮬레이터: 14

설명을 추가하면(나 같은 patch-package 에 대한 다른 초보자를 위해) "패치" 폴더는 프로젝트 루트 수준으로 이동해야 합니다.

이것을 위해 패치 라이브러리를 사용하는 것은 과도하게 보입니다. 0.62.2에 마이너 패치로 추가하는 것이 너무 어렵습니까(아마도 0.62.3으로 만드시겠습니까?). 정말 3줄의 코드입니다.

현재와 ​​같이 0.63.x에는 몇 가지 주요 버그가 있으며 조만간 해결되지 않을 것 같으므로(0.64.x가 곧 출시됨) 가까운 장래에 0.62로 고정되어 있습니다.

이것을 위해 패치 라이브러리를 사용하는 것은 과도하게 보입니다.

패치 패키지를 사용하지 마십시오...

패치 패키지를 사용하고 싶지 않고 앱을 최신 버전으로 업데이트하고 싶지 않지만 왜 개발자가 전체 로드맵을 무시하도록 "강제"합니까?
왜 당신은 무언가를 하고 싶지 않고 사람들이 당신이 원하는 것을 하게 만들고 싶습니까?

패치는 여기에서 완벽하게 작동했습니다. 0.62.2

반응 네이티브 0.62.x와 동일한 문제입니다. 수정 사항이 팩 이식될 가능성이 있습니까? RN 0.63.x는 여전히 매우 버그가 있어 업그레이드할 수 없습니다.

Hey man, 이것을 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

npx patch-package 실행

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];
   }
 }

항상 이미지 구성 요소를 FastImage로 바꿀 수 있습니다. 그렇게 하면 아무것도 패치할 필요가 없습니다. 이미지도 더 잘 로드됩니다.

patch-package 수정 프로그램을 사용 중이고 CI/CD 설정이 있는 사람은 package.json 에 "postinstall": "patch-package" 를 추가하는 것을 잊지 마십시오.

항상 이미지 구성 요소를 FastImage로 바꿀 수 있습니다. 그렇게 하면 아무것도 패치할 필요가 없습니다. 이미지도 더 잘 로드됩니다.

FastImage는 많은 버그가 있는 유지 관리 라이브러리가 아닙니다.

왜 더 낫다고 생각하세요?

FastImage가 작동 중입니다. 사용할 수 있습니다.

@johnlim5847 "postinstall"을 추가할 위치: "patch-package" package.json의 이 줄은?

실행 시 이 오류가 발생함: npx patch-package
패치 적용 중...
오류: node_modules/ react-native에 없는 react-native 패키지에 대한 패치 파일을 찾았습니다.

@shrimallamanoj 먼저 https://github.com/ds300/patch-package 로 이동해야 합니다.

예 ... 감사합니다 단계를 따르고 패치가 성공적으로 적용되었으며 npx를 실행할 때 문제가 발생하지 않지만 솔루션이 작동하지 않는 것 같습니다. 나쁜 ... 다른 솔루션은 무엇입니까?

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

여러분, 이 패치는 React 네이티브 0.61.5에서도 작동합니다. 동일한 해결 방법을 사용합니다.

1.- "yarn add patch-package" 실행
2.- 프로젝트 루트에 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.61.5.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "yarn patch-package"를 실행하거나 설치 후 스크립트에 넣습니다.

이 링크 를 따라 IOS14의 이미지 문제를 해결합니다.

• Xcode에서 클린 빌드(CMD + Shift + K)
• npx react-native start --reset-cache로 캐시 재설정
• XCode로 빌드하면 모든 것이 다시 잘 작동합니다.
  나는 React 네이티브 0.62.2를 사용하고 있습니다.
  GL 모두에게.

수정이 아니라 관찰내부에이미지를 보여주는 것입니다.

동일한 버그가 표시되지만 개발 프로세스 중에만 발생합니다. 이것은 휴대폰과 xcode 프로그램을 업데이트한 후에 발생했습니다. (ios14, xcode12) 이상한 점은 마켓에서 내 애플리케이션을 다운로드할 때 정적 사진을 볼 수 없다는 것입니다. 다른 폰에서 시도하면 사진이 보입니다. 업데이트 후 개발 환경이 완전히 망가졌습니다.

위에서 @tomcheung 이 제안한 대로 RCTUIImageViewAnimated.m 파일을 수동으로 편집하면 버전 0.61.5의 문제가 수정됩니다. 감사합니다!

제안: 패치 0.63 로 업그레이드하지 마십시오. 업그레이드를 시도했지만 firebase , code-push 로 인해 빌드에 실패했습니다.

여전히 이 문제가 발생하는 경우 패치가 현재 문제에 대한 최상의 솔루션인지 조언할 수 있는 사람이 있습니까?

0.61.2 패치가 있나요?

0.61.2 패치가 있나요?

나를위한. 해결되었습니다.

0.62.2 해결되었습니다. 그러나 실제 장치는 실패했습니다....
해결책이 있습니까?

https://github.com/huylvdev/react-native-fix-image 그것은 나를 위해 작동합니다

if (_currentFrame) {
layer.contentsScale = self.animatedImageScale;
layer.contents = (__브릿지 아이디)_currentFrame.CGImage;
} 또 다른 {
[수퍼 디스플레이 레이어:레이어 ];
}

위치: /node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m

그것은 나를 위해 작동합니다, 감사합니다

나를위한. 해결되었습니다.

죄송합니다 이해를 못하겠습니다 무슨 말씀이세요? 어떤 패치를 적용하셨나요?

나를 위해 일한 솔루션은 노드 모듈 내부에서 수정해야 하기 때문에 일시적으로 수정합니다. 앞으로 이러한 일이 발생하지 않도록 방지할 수 있는 다른 방법이 있습니까?

반응 네이티브 버전의 경우 < 0.63
ReactNative Image 대신 react-native-fast image 를 사용하세요.
react-native-fast-image 작업을 수행하려면 react-native-fast- image 의 폴백 을 비활성화하십시오.
IOS 14에서 작동합니다!

나를위한. 해결되었습니다.

죄송합니다 이해를 못하겠습니다 무슨 말씀이세요? 어떤 패치를 적용하셨나요?

@EmmanueleVilla 이 패치를 https://github.com/facebook/react-native/issues/29279#issuecomment -658244428 적용한 다음 패치 패키지 를 사용하여 유지하세요. :)

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

여러분, 이 패치는 React 네이티브 0.61.5에서도 작동합니다. 동일한 해결 방법을 사용합니다.

1.- "yarn add patch-package" 실행
2.- 프로젝트 루트에 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.61.5.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "yarn patch-package"를 실행하거나 설치 후 스크립트에 넣습니다.

나는 또한 61.5를 실행 중입니다. 이것은 저에게 효과적이었습니다! 61.5 이외의 버전이 있는 경우 해당 버전을 사용하도록 패치 파일의 이름을 변경하고 yarn patch-package 를 실행하면 반응 네이티브 버전이 일치하는 것을 감지하므로 패치가 적용됩니다.

예를 들어 버전 61.2의 경우 패치 파일의 이름을 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>

이것은 패치 파일을 생성하는 훨씬 간단한 방법이 있지만 v0.61.4 에서 저에게 효과적입니다.

tl;dr https://github.com/ds300/patch-package 자체의 지침을 따르십시오.

자세한 지침은 다음과 같습니다.
이것은 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"
 }

도움이 되었기를 바랍니다!

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

RN v0.61.2를 사용하는 동안 이 문제가 발생했지만 여전히 효과가 있었습니다. 감사 해요

반응 네이티브 버전의 경우 < 0.63
ReactNative Image 대신 react-native-fast image 를 사용하세요.
react-native-fast-image 작업을 수행하려면 react-native-fast- image 의 폴백 을 비활성화하십시오.
IOS 14에서 작동합니다!

그것은 나를 위해 일했습니다!

원사 패치 패키지

나를위한. 해결되었습니다.

죄송합니다 이해를 못하겠습니다 무슨 말씀이세요? 어떤 패치를 적용하셨나요?

@EmmanueleVilla 이 패치 #29279(댓글) 를 적용한 다음 패치 패키지 를 사용하여 유지하세요 :)

당신은 남자 @jkim430 감사합니다

0.61.4에서 모든 솔루션을 시도했지만 원격 이미지는 제대로 로드되지만 로컬 자산은 표시되지 않습니다.

어떤 아이디어?

xcode 감사합니다..

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.

내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.

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];
  }

그것은 나를 위해 일했습니다. 감사 해요! 또한 npx patch-package (자세한 정보는 여기 )를 사용하여 이 변경 사항을 유지할 수 있으며 항상 node_modules가 다시 설치되는 것을 수정할 필요가 없습니다.

이것들은 내가 다른 사업을 시작하고 프로그래머가 되는 것을 그만두고 싶게 만드는 종류의 버그입니다.

https://github.com/huylvdev/react-native-fix-image 그것은 나를 위해 작동합니다

정말 감사합니다. 하루를 보낸 후 마침내이 도움으로 해결되었습니다.

이번 패치가 0.63.2 버전에도 적용되는 것을 확인할 수 있습니다. 파일 이름을 (react-native+0.62.2.patch)로 바꿉니다.

이 문제를 다시 여십시오.
이것은 여전히 ​​​​문제를 해결하지 못합니다.

https://github.com/huylvdev/react-native-fix-image 그것은 나를 위해 작동합니다

정말 감사합니다. 하루를 보낸 후 마침내이 도움으로 해결되었습니다.

이봐, 나는 react-native-fix-image 를 사용해 보았고 내가 할 때 효과가 있었다.
npx react-native-fix-image 하지만 node_modules를 제거하고 다시 설치할 때.
앱은 이미지를 로드하지 않습니다.
그러한 문제에 직면했으며 이미지를 렌더링하기 위해 매번 npx 명령을 실행해야 합니까?

여기 당신이 간다
https://github.com/facebook/react-native/issues/29279#issuecomment -658244428

https://github.com/huylvdev/react-native-fix-image 그것은 나를 위해 작동합니다

정말 감사합니다. 하루를 보낸 후 마침내이 도움으로 해결되었습니다.

그것은 나를 위해 작동합니다! 감사합니다!!

릴리스 모드에서는 작동하지 않습니다.

@tomcheung 정말 감사합니다!
문제가 뭔지 알아내려고 2일동안 머리를 부딪쳤는데...

이전 버전의 React Native(예: 0.60.6)를 실행하는 사용자의 경우 RCTUIImageViewAnimated.m 파일이 존재하지 않기 때문에 패치가 불가능합니다. React Native Fast Image v8.1.5를 사용하고 SDWebImage 포드를 pod update SDWebImage 로 업그레이드하여 이 문제를 해결했습니다. 더 구체적으로 말하면 SDWebImage를 v5.8.1에서 v5.9.2로 업그레이드했습니다.

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

릴리스 버전에서 이미지가 표시되지 않습니다. (엑스포 39 프로젝트 제외) RN 0.63.3
업데이트: metro.config.js 업데이트로 내 문제 해결 => https://forums.expo.io/t/assets-missing-only-in-ios-release-build-after-ejecting/42759

이것은 모든 RN 릴리스에서 공식적으로 수정될 예정입니까? Afaik, 문제는 여전히 있습니다.

이것은 모든 RN 릴리스에서 공식적으로 수정될 예정입니까? Afaik, 문제는 여전히 있습니다.

+1. 가끔은 예전 프로젝트를 진행하고 있어서 패치를 해야 하는 경우가 있습니다.

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.mb/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
색인 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 *)레이어
  {
  
  
  
  • if (!_currentFrame) {
  
  
  • _currentFrame = self.image;
  
  
  • }
    
    if (_currentFrame) {
    
    layer.contentsScale = self.animatedImageScale;
    
    layer.contents = (__브릿지 아이디)_currentFrame.CGImage;
    
    diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
    
    새 파일 모드 100644
    
    인덱스 0000000..361f5fb
    
    --- /dev/null
    
    +++ b/node_modules/react-native/scripts/.packager.env
    
    @@ -0,0 +1 @@
    
    +수출 RCT_METRO_PORT=8081
  
  

감사 해요! 이것은 제 모든 오래된 RN 프로젝트에서 저에게 효과적이었습니다.
react-native+0.63.0.patch 파일을 만들기 전에 0.63 대신 이전 프로젝트의 React Native 버전을 바꾸세요.

나는 비디오 를 만들었으며 이것이 누군가에게 도움이되기를 바랍니다.

@AsbarAli 의 수정 사항이 저에게 효과적이었습니다. RN 버전: 0.61.5.

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.
내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.
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];
  }

그것은 나를 위해 일했습니다. 감사 해요! 또한 npx patch-package (자세한 정보는 여기 )를 사용하여 이 변경 사항을 유지할 수 있으며 항상 node_modules가 다시 설치되는 것을 수정할 필요가 없습니다.

이것들은 내가 다른 사업을 시작하고 프로그래머가 되는 것을 그만두고 싶게 만드는 종류의 버그입니다.

패치를 적용하려면 npx patch-package react-native 를 실행하는 것이 중요합니다.

이봐, 누군가 이것이 코어에 병합되었음을 확인할 수 있습니까?

패치 패키지는 솔루션이지만 영구적이어서는 안 됩니다.

조사할 수 있을 때까지 이 내용을 공개하겠습니다.

그들은 이것을 고칠 계획이 없습니까?

https://www.npmjs.com/package/react-native-fix-image
나를 위해 일하는

그것은 고정 된 것처럼 보입니다. 이전 버전으로 다시 이식되지 않습니다. 수정 사항이 63.3에 있다고 생각합니다.

@AsbarAli 의 수정 사항이 저에게 효과적이었습니다. RN 버전: 0.61.5.

어떻게 했어? RN 61.2를 사용하고 있습니다.

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!
1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

RN v0.61.2를 사용하는 동안 이 문제가 발생했지만 여전히 효과가 있었습니다. 감사 해요

안녕하세요, 도와드릴까요? 나는 또한 RN 61.2를 가지고 있지만 전혀 작동하지 않습니다. 하단 탐색 이미지가 표시되지 않을 수 있음

@rjtubera님 , 패치는 0.63에서 작동해야 하지만 0.61.5 버전의 React Native에서도 작동한다고 합니다. 아마도 React Native 0.61.2에서 0.61.5로 업그레이드를 시도하고 인용한 단계를 다시 적용하면 작동할 수 있습니다.

그래도 작동하지 않으면 0.63으로 업그레이드하고 동일하게 수행하십시오. 일부 구성 요소가 파손될 수 있으므로 조심하십시오. 업그레이드 후 모든 구성 요소를 테스트하여 모든 것이 여전히 잘 작동하는지 확인해야 합니다(iOS 및 Android에서).

이 문제가 발생하면 이 링크의 단계에 따라 해결했습니다.
https://github.com/facebook/react-native/pull/29420#issuecomment -707435412

Alabi에게 감사드립니다. React Native를 패치하여 문제도 분류했습니다. 지금까지 잘쓰고있습니다😊

보낸 사람: Alabi Temitope Wahab [email protected]
답장: facebook/react-native [email protected]
날짜: 2020년 10월 13일 화요일 03:56
받는 사람: facebook/react-native [email protected]
참조: Kieran Desmond [email protected] , [email protected] 댓글
제목: Re: [facebook/react-native] iOS 14(#29279)에서 이미지가 이미지를 표시할 수 없습니다.

이 문제가 발생하면 이 링크의 단계에 따라 해결했습니다.

29420 (댓글) https://github.com/facebook/react-native/pull/29420#issuecomment-707435412

—
당신이 댓글을 달았기 때문에 이것을 받는 것입니다.
이 이메일에 직접 답장하거나 GitHub https://github.com/facebook/react-native/issues/29279#issuecomment-707436028 에서 확인하거나 https://github.com/notifications/unsubscribe-auth/AIENJUWD2RES5AC52CT4MG3SKOXURANCNFSM4ORGDXZA 구독을 취소하세요.

나는 반응 네이티브의 0.63 버전으로 업그레이드했지만 동일한 문제에 직면하고 있습니다. 누구든지 나를 도울 수 있습니까?

이전 버전의 React Native(예: 0.60.6)를 실행하는 사용자의 경우 RCTUIImageViewAnimated.m 파일이 존재하지 않기 때문에 패치가 불가능합니다. React Native Fast Image v8.1.5를 사용하고 SDWebImage 포드를 pod update SDWebImage 로 업그레이드하여 이 문제를 해결했습니다. 더 구체적으로 말하면 SDWebImage를 v5.8.1에서 v5.9.2로 업그레이드했습니다.

출처: DylanVann/react-native-fast-image#702(코멘트)

완벽하게 작동합니다.

react-native-fast-image 버전 8.3.2에는 SDWebImage의 업그레이드 버전도 포함되어 있으므로 pod update 필요가 없습니다!

https://www.npmjs.com/package/react-native-fix-image
나를 위해 일하는

나를 위해 일했다. 👍

React-Native 0.63.1에서 0.63.2로 업그레이드하는 것이 도움이 되었습니다.

Xcode 12.0.1. 및 ios 14 의 RN 0.62.2 에서 동일한 문제에 직면하고 있습니다. 어떤 해결책이 있습니까?

Xcode 12.0.1. 및 ios 14 의 RN 0.62.2 에서 동일한 문제에 직면하고 있습니다. 어떤 해결책이 있습니까?

@ghasemikasra39 동일한 버전에서 동일한 문제에 직면했습니다. react-native-fix-image 설치가 저에게 효과적이었습니다.

@RutsSantos 는 이것에 대해서도 저에게 효과적이었습니다!

1) npm install --save react-native-fix-image
2) npx 반응 네이티브 수정 이미지
3) 프로젝트 재구축

React-Native 0.63.1에서 0.63.2로 업그레이드하는 것이 도움이 되었습니다.

이것은 나를 위해 일했습니다.

이것은 나를 위해 일했습니다. @JordanRosas 감사합니다

@JordanRosas 도 훌륭하게 작업했습니다. 감사합니다.

반응 네이티브 버전을 0.62.2에서 0.63.3으로 업그레이드하면 더 이상 npm 모듈을 패치하거나 설치할 필요가 없습니다.

0.62.3이 존재하지 않습니다:

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

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

수정

우리 중 일부는 이 중요한 RN 버그가 해결될 때까지 업그레이드할 수 없습니다: https://github.com/facebook/react-native/issues/29451

그래서 우리는 원숭이 패치 0.62.x 또는 버그가 있는 0.63.x 버전에 갇혀 있습니다.

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.

내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.

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];
  }

효과가있다. 감사합니다!

패키지를 설치하거나 node_modules 를 직접 편집하지 않으려면 https://stackoverflow.com/a/64495360/7477198 에서와 같이 podfile에 preinstall 스테이지 후크를 추가할 수 있습니다. 나를 위해 일했다. 이것은 자식에게 더 친숙합니다.

저에게는 RN 63.3에서도 물리적 장치에 이미지가 표시되지 않습니다. 해결 방법으로 https://www.base64-image.de/ 에서 base 64로 이미지를 인코딩한 다음 $# 대신 Image 구성 요소에 대한 source 로 사용했습니다 require('imagePath')

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.

내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.

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];
  }

당신은 천재입니다, 당신은 내 생명을 구했습니다!

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

감사합니다
RN 0.61.5에서 잘 작동했습니다.
react-native+0.61.5.patch 라는 패치 파일을 추가했습니다.

또한 DylanVann/react-native-fast-image에 대한 수정 사항
cd ios && pod update SDWebImage

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 수정해주셔서 감사합니다! 여기에 RCT_METRO_PORT가 필요합니까, 아니면 프로젝트에 특정한 것이 필요합니까?

Xcode 12.0.1의 RN 0.59.0. 및 ios 14. 솔루션이 있습니까?

Xcode 12.0.1의 RN 0.59.0. 및 ios 14. 솔루션이 있습니까?

3가지 솔루션:

1. node_modules 내에서 수동으로 문제 수정
2. 이 수정 라이브러리를 사용하십시오. https://www.npmjs.com/package/react-native-fix-image
3. React Native 0.63.3 업데이트

"react-native": "0.63.3" 에서도 --configuration=Release 에 이것이 여전히 존재함을 확인할 수 있습니다. 그러나 --configuration=Debug 에서는 잘 작동합니다.

https://www.npmjs.com/package/react-native-fix-image 는 도움이 되지 않지만 빌드를 중단합니다.
이 오류가 있는 릴리스 구성:

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

또한 내 앱 사용자는 iOS에서 (URL에서) 이미지 로드를 경험하지 않지만 모든 사람에게 일부 사람들에게만 발생하지는 않습니다. 이 문제를 해결하세요. 나는 React Native 0.63.3을 사용하고 있습니다.
https://i.ibb.co/1vDc6kv/1.jpg <- 이 문제를 보여주는 이미지 링크

@douglasjunior 는 잘 작동합니다! 매우 감사합니다!

@RutsSantos 는 이것에 대해서도 저에게 효과적이었습니다!

1. npm install --react-native-fix-image 저장
2. npx 반응 네이티브 수정 이미지
3. 재건 프로젝트

나를 위해 일했다 🎉🎉🎉🎉🎉

Xcode 12.0.1의 RN 0.59.0. 및 ios 14. 솔루션이 있습니까?

3가지 솔루션:

1. node_modules 내에서 수동으로 문제 수정
2. 이 수정 라이브러리를 사용하십시오. https://www.npmjs.com/package/react-native-fix-image
3. React Native 0.63.3 업데이트

또 다른 Q, node_modules 내에서 수동으로 .1을 사용합니다. 네트워크의 이미지 표시에서는 잘 작동하지만 로컬 이미지는 표시할 수 없습니다.

또한 내 앱 사용자는 iOS에서 (URL에서) 이미지 로드를 경험하지 않지만 모든 사람에게 일부 사람들에게만 발생하지는 않습니다. 이 문제를 해결하세요. 나는 React Native 0.63.3을 사용하고 있습니다.
https://i.ibb.co/1vDc6kv/1.jpg <- 이 문제를 보여주는 이미지 링크

나에게 발생한 문제를 찾습니다. WebP는 iOS 13에서 지원되지 않으므로 SDWebImageWebPCoder 포드로 react-native-fast-image를 설치해야 했습니다.

아무도 이 문제를 해결하기 위한 Microsoft App Center 빌드 스크립트를 가지고 있다고 생각하지 않습니까?

참고로 저는 SDWebImage https://github.com/DylanVann/react-native-fast-image/issues/730 을 업그레이드한 후 수정된 FastImage 를 사용하여 이 문제를 극복할 수도 있었습니다. 다른 작업은 결국 최신 버전으로 이동)

제 경우에는 일반 RN의 애니메이션 이미지가 있었지만 다음을 사용하여 FastImage도 사용할 수 있었습니다.

const AnimatedImage = Animated.createAnimatedComponent(FastImage)

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

또는 수정 이미지 패키지가 수행해야 하며, Appcenter(@krisbaum74)에서 작동하지 않는 경우 repo의 루트에 appcenter-pre-build.sh 를 만들고 수정 사항이 포함된 스크립트를 추가하여 동일한 작업을 수행할 수 있어야 합니다. 거기

나는 react-native 0.63.3을 사용하고 있으며 여전히 iOS 14.1에서 이 문제에 직면하고 있습니다. 해당 버전에 이미 적용되어 있습니다. 문제를 해결하는 방법에 대한 아이디어가 있습니까?

나는 react-native 0.63.3을 사용하고 있으며 여전히 iOS 14.1에서 이 문제에 직면하고 있습니다. 해당 버전에 이미 적용되어 있습니다. 문제를 해결하는 방법에 대한 아이디어가 있습니까?

0.63.3으로 업그레이드하면 해당 코드에 문제가 있을 수 있습니다. 이 수정 라이브러리 https://www.npmjs.com/package/react-native-fix-image 를 사용해 보세요.

나는 react-native 0.63.3을 사용하고 있으며 여전히 iOS 14.1에서 이 문제에 직면하고 있습니다. 해당 버전에 이미 적용되어 있습니다. 문제를 해결하는 방법에 대한 아이디어가 있습니까?

0.63.3으로 업그레이드하면 해당 코드에 문제가 있을 수 있습니다. 이 수정 라이브러리 https://www.npmjs.com/package/react-native-fix-image 를 사용해 보세요.

이미 0.63.3으로 업그레이드했는데 이 라이브러리는 문제를 해결하지 못합니다(이미지는 시뮬레이터에 로드되지만 물리적 장치에는 로드되지 않습니다.

나는 react-native 0.63.3을 사용하고 있으며 여전히 iOS 14.1에서 이 문제에 직면하고 있습니다. 해당 버전에 이미 적용되어 있습니다. 문제를 해결하는 방법에 대한 아이디어가 있습니까?

0.63.3으로 업그레이드하면 해당 코드에 문제가 있을 수 있습니다. 이 수정 라이브러리 https://www.npmjs.com/package/react-native-fix-image 를 사용해 보세요.

이미 0.63.3으로 업그레이드했는데 이 라이브러리는 문제를 해결하지 못합니다(이미지는 시뮬레이터에 로드되지만 물리적 장치에는 로드되지 않습니다.

내 문제는 프로덕션 빌드의 자산 복사와 관련이 있습니다. 여기 에 설명된 대로 잘못된 연결이 있었습니다. 그런 다음 번들을 재생성하고 다시 시도하십시오.

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

정말 고맙습니다!!!! 당신은 말 그대로 내 하루를 구했습니다 🙏 ❤️

_currentFrame이 nil인 경우 [super displayLayer:layer]; 를 추가한 후 이미지를 표시할 수 있습니다.

내가 올바르게 이해한다면 _currentFrame은 애니메이션 이미지용이어야 합니다. 따라서 스틸 이미지인 경우 UIImage 구현을 사용하여 이미지 렌더링을 처리할 수 있지만 올바른 수정인지 확신할 수 없습니다.

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];
  }

나를 위해 일했다 !!! 👍

또한 0.63.3으로 업그레이드했으며 iOS 14에서 이 문제에 직면하고 있습니다.
RN-fetch-blob 패키지를 사용하여 파일(그 중 이미지)을 다운로드하고 Image 구성 요소를 사용하여 이러한 로컬 이미지를 로드합니다.

@krisbaum74

아무도 이 문제를 해결하기 위한 Microsoft App Center 빌드 스크립트를 가지고 있다고 생각하지 않습니까?

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

패치 패키지를 사용하여 이것을 어떻게 적용할 수 있습니까? 패치 패키지를 사용하는 초보자.

안녕!

1.- "npm i -g patch-package" 실행
2.- 패치라는 새 폴더를 만듭니다.
3.- 해당 폴더 안에 react-native+0.63.0.patch라는 새 파일을 만듭니다.
4.- 위의 소스 코드를 추가합니다.
5.- 프로젝트 루트에서 "patch-package" 실행

위의 수정 사항을 따르고 파일을 react-native+0.63.0.patch로 만드십시오.

그 후 appcenter-pre-build.sh에서 추가

npm i -g 패치 패키지
패치 패키지

그러면 AppCenter 빌드에 위의 수정 사항이 추가됩니다.

나는 iOS에서 이것을 가지고 있었고 훌륭하게 작동하는 npx react-native-fix-image를 사용했습니다. 이제 Android에서 문제가 지속된다는 사실에 실망했습니다!

여기에 Android에 대한 언급이 없습니다. 나만 그런가요?

나는 "react-native"를 흔들고 있다: "0.61.5"

_const 이미지 = Animatable.createAnimatableComponent(FastImage);_
제대로 작동하지 않습니다!

animation={'bounceIn'} 이 작동하지 않습니다

"반응 네이티브": "0.63.3"
"반응 네이티브 빠른 이미지": "^8.3.4"
"반응 네이티브 애니메이션 가능": "^1.3.3"

나는 이것이 0.63의 패치로 간주된다는 것을 알고 있지만 이것이 0.62에서도 작동한다는 것을 확인할 수 있습니다. 👍

IOS 14.2, Xcode 12.2, react-native 0.63.4에서는 여전히 작동하지 않습니다.
제안된 수정 사항이 도움이 되지 않습니다.
업데이트
0.63.4 - 문제가 없고 패치가 없는 원격 이미지를 표시하지만 로컬 이미지는 패치 유무에 관계없이 작동하지 않습니다.

react-native 0.63.3이 있는 프로젝트가 있는데 패치가 작동하지 않습니다. 패치를 적용하기 전에 RCTUIImageViewAnimated 클래스를 확인했으며 이미 패치 코드가 포함되어 있습니다. #29420은 변경 사항 0.63.2 CHANGELOG https://github.com/react-native-에 따라 0.63.3에서 이미 병합되었기 때문에 예상됩니다. 커뮤니티/릴리스/blob/master/CHANGELOG.md#v0632. 그래서 패치는 그것을 고칠 수 없습니다. 0.62.2에서는 유효하다고 생각하지만 0.63.3에서 변경하면 _local_ 이미지 로드가 다시 중단될 수 있습니다. 일부 개발자가 <0.63.2로 다운그레이드하고 패치를 적용하면 이미지가 다시 표시되는 이유를 설명합니다. 수정 사항이 포함된 0.63.2를 얻는 것이 좋습니다. 어쨌든, 나는 과거에 갇히고 싶지 않기 때문에 한 버전이라도 다운그레이드하는 것을 주저하고 있습니다. ;-). 나는 내 쪽에서 작동하는 해결 방법을 만들었습니다.

_external_ URL(RN 0.63.3)을 사용할 때 _me_ 이미지가 로드된다는 사실을 기반으로 합니다.
내 해결 방법,

• 나는 하이브리드 자산 패턴을 따릅니다. https://reactnative.dev/docs/images#images -from-hybrid-apps-resources에서 참조를 얻을 수 있습니다.
• iOS/Android 자산 라이브러리에 이미지를 추가합니다. 이것은 스크립트, XCode 등을 통해 수동으로 수행할 수 있습니다.
• _react 기본 편의 파일 시스템 참조_ 대신 _local_ URI로 이미지를 참조하십시오. 아래 iOS 예

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

• 플랫폼에 따라 iOS 또는 Android 참조 자산 URI를 가져오는 유틸리티 함수를 만들었습니다. 문서(https://reactnative.dev/docs/images#images-from-hybrid-apps-resources)를 읽고 URI 형식의 차이점을 확인하세요.
• iOS 14.2 앱에 이미지가 표시되기 시작했습니다!! App Store에서 배포한 앱과 Ad Hoc 설치로 테스트했습니다.

그것은 (나를 위해) 작동하지만, 단점,

• React Native 참조 방식은 그냥 두기에는 너무 편리합니다. 이 문제가 해결되어 정상으로 돌아갈 수 있기를 바랍니다.
• 잠재적으로 3개의 자산 폴더를 동기화 상태로 유지... 예, 스크립트에 의한 것이지만 개발자는 쉽게 잊어버릴 것이며 지금부터 몇 달 안에 누군가 스크립트가 오래되었다는 것을 발견하지 못하는 이미지가 나타나지 않는 이유를 알아내는 데 2일을 보낼 것입니다. 당신이 생각할 수 있습니다.
• 시뮬레이터에서 이미지가 누락되었습니다. 시뮬레이터에서 실행하는 경우 반응 네이티브 자산의 폴더에서 이미지를 로드하는 조건을 추가하려고 합니다. 이 라이브러리는 https://github.com/react-native-device-info/react-native-device-info 를 도울 수 있습니다(아직 시도하지 않았습니다).
  누군가가 이 해결 방법의 혜택을 받을 수 있기를 바랍니다.

@RutsSantos 는 이것에 대해서도 저에게 효과적이었습니다!

1. npm install --react-native-fix-image 저장
2. npx 반응 네이티브 수정 이미지
3. 재건 프로젝트

나를 위해 일했다 🎉🎉🎉🎉🎉

RN 0.61에서는 작동하지 않았습니다.

저는 RN 0.61을 사용하는데 어떤 솔루션도 저에게 적합하지 않습니다. Pls, 다른 해결책이 있습니까?

나는 RN 0.61을 사용하고 어떤 솔루션도 저에게 적합하지 않습니다. Pls, 다른 해결책이 있습니까?

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

내 이 라이브러리는 여전히 RN 0.61에서 잘 작동합니다.

나는 RN 0.61을 사용하고 어떤 솔루션도 저에게 적합하지 않습니다. Pls, 다른 해결책이 있습니까?

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

내 이 라이브러리는 여전히 RN 0.61에서 잘 작동합니다.

안녕하세요 Huy 위의 가이드대로 단계별로 시도했는데 수정 이미지가 표시되었습니다. 그러나 ios 14에서는 여전히 이미지가 표시되지 않습니다. 다른 ios 버전에서는 여전히 이미지가 정상적으로 표시됩니다.
저는 RN 0.61과 ios 14를 사용합니다.