@granite-js/image 1.0.26 → 1.0.28

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @granite-js/image
 
+## 1.0.28
+
+### Patch Changes
+
+- 0eb0277: Fix Android GraniteImage rendering when the native provider view is replaced after the parent view is already laid out.
+- 59a4ab7: Reuse the iOS image provider view across source changes.
+
+## 1.0.27
+
 ## 1.0.26
 
 ## 1.0.25

package/android/src/main/java/run/granite/image/GraniteImage.kt

@@ -130,11 +130,7 @@ class GraniteImage(context: Context) : FrameLayout(context) {
     }
 
     private fun loadImageIfReady() {
-        // Remove existing container view
-        containerView?.let {
-            removeView(it)
-            containerView = null
-        }
+        clearContainerView()
 
         val provider = providerResolver()
 
@@ -154,14 +150,8 @@ class GraniteImage(context: Context) : FrameLayout(context) {
         // Emit load start event
         emitLoadStart()
 
-        // Create new image view from provider
         val imageView = provider.createImageView(context)
-        imageView.layoutParams = LayoutParams(
-            LayoutParams.MATCH_PARENT,
-            LayoutParams.MATCH_PARENT
-        )
-        addView(imageView)
-        containerView = imageView
+        attachContainerView(imageView)
 
         // Load image using provider with full options
         provider.loadImage(
@@ -185,6 +175,44 @@ class GraniteImage(context: Context) : FrameLayout(context) {
         )
     }
 
+    private fun attachContainerView(view: View) {
+        view.layoutParams = LayoutParams(
+            LayoutParams.MATCH_PARENT,
+            LayoutParams.MATCH_PARENT
+        )
+        addView(view)
+        containerView = view
+        layoutContainerViewIfPossible(view)
+    }
+
+    private fun clearContainerView() {
+        containerView?.let {
+            removeView(it)
+            containerView = null
+        }
+    }
+
+    private fun layoutContainerViewIfPossible(view: View) {
+        if (width <= 0 || height <= 0) {
+            return
+        }
+
+        val widthSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY)
+        val heightSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY)
+        view.measure(widthSpec, heightSpec)
+        view.layout(0, 0, width, height)
+    }
+
+    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+        super.onSizeChanged(w, h, oldw, oldh)
+        containerView?.let(::layoutContainerViewIfPossible)
+    }
+
+    override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
+        super.onLayout(changed, left, top, right, bottom)
+        containerView?.let(::layoutContainerViewIfPossible)
+    }
+
     private fun handleLoadCompletion(
         bitmap: Bitmap?,
         error: Exception?,
@@ -245,17 +273,15 @@ class GraniteImage(context: Context) : FrameLayout(context) {
         }
 
         errorView.addView(label)
-        addView(errorView)
-        containerView = errorView
+        attachContainerView(errorView)
     }
 
     fun cleanup() {
         val provider = providerResolver()
         containerView?.let {
             provider?.cancelLoad(it)
-            removeView(it)
         }
-        containerView = null
+        clearContainerView()
         currentUri = null
     }
 

package/ios/GraniteImageComponentView.mm

@@ -42,6 +42,7 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
 
 @implementation GraniteImageComponentView {
     UIView *_containerView;
+    UIView *_errorView;
     NSString *_currentUri;
     UIViewContentMode _currentContentMode;
     BOOL _needsInitialLoad;
@@ -198,11 +199,7 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
 
     if (shouldReload) {
         if (_currentUri.length > 0) {
-            // 다음 runloop으로 지연하여 _eventEmitter 세팅 후 실행
-            __weak GraniteImageComponentView *weakSelf = self;
-            dispatch_async(dispatch_get_main_queue(), ^{
-                [weakSelf loadImageWithProvider];
-            });
+            [self loadImageWithProvider];
         } else {
             // URI가 비어있거나 nil인 경우 에러 발생
             [self showErrorViewWithMessage:@"No URI provided"];
@@ -259,10 +256,6 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
 
 - (void)loadImageWithProvider
 {
-    // Remove existing container view
-    [_containerView removeFromSuperview];
-    _containerView = nil;
-
     id<GraniteImageProvidable> provider = [[GraniteImageRegistry shared] provider];
 
     if (!provider) {
@@ -279,15 +272,21 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
         return;
     }
 
-    // Emit load start event
+    [_errorView removeFromSuperview];
+    _errorView = nil;
+
     [self emitOnLoadStart];
 
-    // Create new image view from provider
-    UIView *imageView = [provider createImageView];
-    imageView.frame = self.bounds;
-    imageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
-    [self addSubview:imageView];
-    _containerView = imageView;
+    UIView *imageView = _containerView;
+    if (!imageView) {
+        imageView = [provider createImageView];
+        imageView.frame = self.bounds;
+        imageView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
+        [self addSubview:imageView];
+        _containerView = imageView;
+    } else {
+        [provider cancelLoadWith:imageView];
+    }
 
     // Check if provider supports extended loading with callbacks
     __weak GraniteImageComponentView *weakSelf = self;
@@ -353,6 +352,8 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
 
 - (void)showErrorViewWithMessage:(NSString *)message
 {
+    [_errorView removeFromSuperview];
+
     UIView *errorView = [[UIView alloc] initWithFrame:self.bounds];
     errorView.backgroundColor = [UIColor redColor];
     errorView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
@@ -374,7 +375,7 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
     ]];
 
     [self addSubview:errorView];
-    _containerView = errorView;
+    _errorView = errorView;
 }
 
 - (void)prepareForRecycle
@@ -388,6 +389,8 @@ __attribute__((used)) static void _forceIncludeGraniteImageComponentView(void) {
 
     [_containerView removeFromSuperview];
     _containerView = nil;
+    [_errorView removeFromSuperview];
+    _errorView = nil;
     _currentUri = nil;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@granite-js/image",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "description": "A pluggable React Native image component that lets you use your existing native image loading infrastructure",
   "type": "module",
   "main": "./dist/module/index.js",