@nativescript-community/ui-image 4.3.10 → 4.3.12

package/index.android.js

@@ -1,10 +1,8 @@
 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
 export * from './index-common';
-import { Color, Image, ImageAsset, ImageSource, Trace, Utils, knownFolders, path } from '@nativescript/core';
-import { android as androidApp } from '@nativescript/core/application';
+import { Application, Background, Color, ImageAsset, ImageSource, Trace, Utils, backgroundInternalProperty, knownFolders, path } from '@nativescript/core';
 import { isString } from '@nativescript/core/utils/types';
-import { CLog, CLogTypes, EventData, ImageBase, ScaleType } from './index-common';
-import { layout } from '@nativescript/core/utils/layout-helper';
+import { CLog, CLogTypes, EventData, ImageBase, ScaleType, aspectRatioProperty, backgroundUriProperty, blurDownSamplingProperty, blurRadiusProperty, fadeDurationProperty, failureImageUriProperty, imageRotationProperty, lowerResSrcProperty, placeholderImageUriProperty, progressBarColorProperty, roundAsCircleProperty, roundBottomLeftRadiusProperty, roundBottomRightRadiusProperty, roundTopLeftRadiusProperty, roundTopRightRadiusProperty, showProgressBarProperty, srcProperty, stretchProperty, tintColorProperty } from './index-common';
 let initialized = false;
 let initializeConfig;
 export function initialize(config) {
@@ -42,14 +40,16 @@ export function initialize(config) {
         initializeConfig = null;
     }
 }
+let imagePineLine;
 export function getImagePipeline() {
-    if (androidApp) {
-        const nativePipe = com.facebook.drawee.backends.pipeline.Fresco.getImagePipeline();
-        const imagePineLine = new ImagePipeline();
-        imagePineLine.android = nativePipe;
-        return imagePineLine;
+    if (!imagePineLine) {
+        if (Application.android.nativeApp) {
+            const nativePipe = com.facebook.drawee.backends.pipeline.Fresco.getImagePipeline();
+            imagePineLine = new ImagePipeline();
+            imagePineLine.android = nativePipe;
+        }
     }
-    return null;
+    return imagePineLine;
 }
 export function shutDown() {
     if (!initialized) {
@@ -59,7 +59,7 @@ export function shutDown() {
     com.facebook.drawee.view.SimpleDraweeView.shutDown();
     com.facebook.drawee.backends.pipeline.Fresco.shutDown();
 }
-function getUri(src) {
+function getUri(src, asNative = true) {
     let uri;
     let imagePath;
     if (src instanceof ImageAsset) {
@@ -73,20 +73,24 @@ function getUri(src) {
             const resName = imagePath.substring(Utils.RESOURCE_PREFIX.length);
             const identifier = Utils.ad.resources.getDrawableId(resName);
             if (0 < identifier) {
-                uri = new android.net.Uri.Builder().scheme(com.facebook.common.util.UriUtil.LOCAL_RESOURCE_SCHEME).path(java.lang.String.valueOf(identifier)).build();
+                const netUri = new android.net.Uri.Builder().scheme(com.facebook.common.util.UriUtil.LOCAL_RESOURCE_SCHEME).path(java.lang.String.valueOf(identifier)).build();
+                if (asNative) {
+                    return netUri;
+                }
+                uri = netUri.toString();
             }
         }
         else if (imagePath.indexOf('~/') === 0) {
-            uri = android.net.Uri.parse(`file:${path.join(knownFolders.currentApp().path, imagePath.replace('~/', ''))}`);
+            uri = `file:${path.join(knownFolders.currentApp().path, imagePath.replace('~/', ''))}`;
         }
         else if (imagePath.indexOf('/') === 0) {
-            uri = android.net.Uri.parse(`file:${imagePath}`);
+            uri = `file:${imagePath}`;
         }
     }
     else {
-        uri = android.net.Uri.parse(imagePath);
+        uri = imagePath;
     }
-    return uri;
+    return asNative ? android.net.Uri.parse(uri) : uri;
 }
 export class ImagePipeline {
     toUri(value) {
@@ -263,7 +267,7 @@ export const needRequestImage = function (target, propertyKey, descriptor) {
             this._needRequestImage = true;
             // we need to ensure a hierarchy is set or the default aspect ratio wont be set
             // because aspectFit is the default (wanted) but then we wont go into stretchProperty.setNative
-            this._needUpdateHierarchy = true;
+            // this._needUpdateHierarchy = true;
             return;
         }
         return originalMethod.apply(this, args);
@@ -285,7 +289,7 @@ export class Img extends ImageBase {
         this.isLoading = false;
         this._canRequestImage = true;
         this._canUpdateHierarchy = true;
-        this._needUpdateHierarchy = true;
+        this._needUpdateHierarchy = false;
         this._needRequestImage = false;
     }
     onResumeNativeUpdates() {
@@ -336,9 +340,10 @@ export class Img extends ImageBase {
     //     this.initDrawee();
     //     this.updateHierarchy();
     // }
-    // public disposeNativeView() {
-    //     this.nativeImageViewProtected.setImageURI(null, null);
-    // }
+    disposeNativeView() {
+        this.controllerListener = null;
+        // this.nativeImageViewProtected.setImageURI(null, null);
+    }
     updateImageUri() {
         const imagePipeLine = getImagePipeline();
         const src = this.src;
@@ -352,81 +357,72 @@ export class Img extends ImageBase {
         this.src = null;
         this.src = src;
     }
-    [_a = ImageBase.placeholderImageUriProperty.setNative]() {
+    [_a = placeholderImageUriProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_b = ImageBase.failureImageUriProperty.setNative]() {
+    [_b = failureImageUriProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_c = ImageBase.stretchProperty.setNative]() {
+    [_c = stretchProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_d = ImageBase.fadeDurationProperty.setNative]() {
+    [_d = fadeDurationProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_e = ImageBase.backgroundUriProperty.setNative]() {
+    [_e = backgroundUriProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_f = ImageBase.showProgressBarProperty.setNative]() {
+    [_f = showProgressBarProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_g = ImageBase.progressBarColorProperty.setNative]() {
+    [_g = progressBarColorProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_h = ImageBase.roundAsCircleProperty.setNative]() {
+    [_h = roundAsCircleProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_j = ImageBase.roundTopLeftRadiusProperty.setNative]() {
+    [_j = roundTopLeftRadiusProperty.setNative]() {
         this.updateHierarchy();
     }
-    [ImageBase.imageRotationProperty.setNative](value) {
+    [imageRotationProperty.setNative](value) {
         const scaleType = this.nativeImageViewProtected.getHierarchy().getActualImageScaleType();
         scaleType['setImageRotation']?.(value);
         this.nativeImageViewProtected.invalidate();
     }
-    [_k = ImageBase.roundTopRightRadiusProperty.setNative]() {
+    [_k = roundTopRightRadiusProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_l = ImageBase.roundBottomLeftRadiusProperty.setNative]() {
+    [_l = roundBottomLeftRadiusProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_m = ImageBase.roundBottomRightRadiusProperty.setNative]() {
+    [_m = roundBottomRightRadiusProperty.setNative]() {
         this.updateHierarchy();
     }
-    [_o = ImageBase.tintColorProperty.setNative](value) {
+    [_o = tintColorProperty.setNative](value) {
         this.updateHierarchy();
     }
-    [_p = ImageBase.blurRadiusProperty.setNative]() {
+    [_p = blurRadiusProperty.setNative]() {
         this.initImage();
     }
-    [_q = ImageBase.srcProperty.setNative]() {
+    [_q = srcProperty.setNative]() {
         this.initImage();
     }
-    [_r = ImageBase.lowerResSrcProperty.setNative]() {
+    [_r = lowerResSrcProperty.setNative]() {
         this.initImage();
     }
-    [_s = ImageBase.blurDownSamplingProperty.setNative]() {
+    [_s = blurDownSamplingProperty.setNative]() {
         this.initImage();
     }
-    [_t = ImageBase.aspectRatioProperty.setNative]() {
+    [_t = aspectRatioProperty.setNative]() {
         this.initImage();
     }
-    // [ImageBase.blendingModeProperty.setNative](value: string) {
-    //     console.log('blendingModeProperty', value);
-    //     switch (value) {
-    //         case 'multiply':
-    //             (this.nativeImageViewProtected as any).setXfermode(android.graphics.PorterDuff.Mode.MULTIPLY);
-    //             break;
-    //         case 'lighten':
-    //             (this.nativeImageViewProtected as any).setXfermode(android.graphics.PorterDuff.Mode.LIGHTEN);
-    //             break;
-    //     }
-    // }
-    // private initDrawee() {
-    //     this.initImage();
-    // }
+    [backgroundInternalProperty.setNative](value) {
+        super[backgroundInternalProperty.setNative](value);
+        this.nativeViewProtected.setClipToOutline(value?.hasBorderRadius());
+    }
     async initImage() {
-        if (this.nativeImageViewProtected) {
+        const view = this.nativeViewProtected;
+        if (view) {
             // this.nativeImageViewProtected.setImageURI(null);
             const src = this.src;
             if (src instanceof Promise) {
@@ -455,174 +451,161 @@ export class Img extends ImageBase {
                 }
                 const uri = getUri(src);
                 if (!uri) {
-                    console.log(`Error: 'src' not valid: ${src}`);
+                    console.error(`Error: 'src' not valid: ${src}`);
                     return;
                 }
                 if (this.noCache) {
-                    const imagePipeLine = getImagePipeline();
-                    const isInCache = imagePipeLine.isInBitmapMemoryCache(uri) || imagePipeLine.isInDiskCache(uri);
-                    if (isInCache) {
-                        imagePipeLine.evictFromCache(uri);
-                    }
+                    // testing if is in cache is slow so lets remove without testing
+                    // const imagePipeLine = getImagePipeline();
+                    // const isInCache = imagePipeLine.isInBitmapMemoryCache(uri) || imagePipeLine.isInDiskCache(uri);
+                    // if (isInCache) {
+                    getImagePipeline().evictFromCache(uri);
+                    // }
                 }
                 this.isLoading = true;
-                // const progressiveRenderingEnabledValue = this.progressiveRenderingEnabled !== undefined ? this.progressiveRenderingEnabled : false;
-                let requestBuilder = com.facebook.imagepipeline.request.ImageRequestBuilder.newBuilderWithSource(uri).setRotationOptions(com.facebook.imagepipeline.common.RotationOptions.autoRotate());
-                if (this.progressiveRenderingEnabled === true) {
-                    requestBuilder = requestBuilder.setProgressiveRenderingEnabled(this.progressiveRenderingEnabled);
-                }
-                if (this.localThumbnailPreviewsEnabled === true) {
-                    requestBuilder = requestBuilder.setLocalThumbnailPreviewsEnabled(this.localThumbnailPreviewsEnabled);
-                }
-                if (this.decodeWidth && this.decodeHeight) {
-                    requestBuilder = requestBuilder.setResizeOptions(new com.facebook.imagepipeline.common.ResizeOptions(this.decodeWidth, this.decodeHeight));
-                }
-                if (this.blurRadius) {
-                    const postProcessor = new com.nativescript.image.ScalingBlurPostprocessor(2, this.blurRadius, this.blurDownSampling || 1);
-                    requestBuilder = requestBuilder.setPostprocessor(postProcessor);
-                }
-                const request = requestBuilder.build();
-                const that = new WeakRef(this);
-                const listener = new com.facebook.drawee.controller.ControllerListener({
-                    onFinalImageSet(id, imageInfo, animatable) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onFinalImageSet', id, imageInfo, animatable);
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            nativeView.updateViewSize(imageInfo);
-                            nativeView.isLoading = false;
-                            const info = new ImageInfo(imageInfo);
-                            const args = {
-                                eventName: ImageBase.finalImageSetEvent,
-                                object: nativeView,
-                                imageInfo: info,
-                                animatable: animatable
-                            };
-                            nativeView.notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no '" + ImageBase.finalImageSetEvent + "' callback will be raised.");
-                        }
-                    },
-                    onFailure(id, throwable) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onFailure', id, throwable.getLocalizedMessage());
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            // const nView = nativeView.nativeViewProtected;
-                            nativeView.isLoading = false;
-                            const imageError = new ImageError(throwable);
-                            const args = {
-                                eventName: ImageBase.failureEvent,
-                                object: nativeView,
-                                error: imageError
-                            };
-                            that.get().notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no '" + ImageBase.failureEvent + "' callback will be raised.");
-                        }
-                    },
-                    onIntermediateImageFailed(id, throwable) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onIntermediateImageFailed', id, throwable);
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            const imageError = new ImageError(throwable);
-                            const args = {
-                                eventName: ImageBase.intermediateImageFailedEvent,
-                                object: nativeView,
-                                error: imageError
-                            };
-                            that.get().notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no '" + ImageBase.intermediateImageFailedEvent + "' callback will be raised.");
-                        }
-                    },
-                    onIntermediateImageSet(id, imageInfo) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onIntermediateImageSet', id, imageInfo);
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            nativeView.updateViewSize(imageInfo);
-                            const info = new ImageInfo(imageInfo);
-                            const args = {
-                                eventName: ImageBase.intermediateImageSetEvent,
-                                object: nativeView,
-                                imageInfo: info
-                            };
-                            that.get().notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no '" + ImageBase.intermediateImageSetEvent + "' callback will be raised.");
-                        }
-                    },
-                    onRelease(id) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onRelease', id);
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            const args = {
-                                eventName: ImageBase.releaseEvent,
-                                object: nativeView
-                            };
-                            that.get().notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no '" + ImageBase.releaseEvent + "' callback will be raised.");
-                        }
-                    },
-                    onSubmit(id, callerContext) {
-                        if (Trace.isEnabled()) {
-                            CLog(CLogTypes.info, 'onSubmit', id, callerContext);
-                        }
-                        const nativeView = that && that.get();
-                        if (nativeView) {
-                            const args = {
-                                eventName: ImageBase.submitEvent,
-                                object: nativeView
-                            };
-                            that.get().notify(args);
-                        }
-                        else {
-                            console.log("Warning: WeakRef<Image> was GC and no 'submitEvent' callback will be raised.");
+                if (!this.controllerListener) {
+                    const that = new WeakRef(this);
+                    this.controllerListener = new com.facebook.drawee.controller.ControllerListener({
+                        onFinalImageSet(id, imageInfo, animatable) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onFinalImageSet', id, imageInfo, animatable);
+                            }
+                            const nativeView = that?.get();
+                            if (nativeView) {
+                                nativeView.updateViewSize(imageInfo);
+                                nativeView.isLoading = false;
+                                const eventName = ImageBase.finalImageSetEvent;
+                                if (nativeView.hasListeners(eventName)) {
+                                    const info = new ImageInfo(imageInfo);
+                                    nativeView.notify({
+                                        eventName,
+                                        imageInfo: info,
+                                        animatable: animatable
+                                    });
+                                }
+                            }
+                        },
+                        onFailure(id, throwable) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onFailure', id, throwable.getLocalizedMessage());
+                            }
+                            const nativeView = that?.get();
+                            if (nativeView) {
+                                // const nView = nativeView.nativeViewProtected;
+                                nativeView.isLoading = false;
+                                const eventName = ImageBase.failureEvent;
+                                if (nativeView.hasListeners(eventName)) {
+                                    const imageError = new ImageError(throwable);
+                                    nativeView.notify({
+                                        eventName,
+                                        error: imageError
+                                    });
+                                }
+                            }
+                        },
+                        onIntermediateImageFailed(id, throwable) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onIntermediateImageFailed', id, throwable);
+                            }
+                            const nativeView = that?.get();
+                            if (nativeView) {
+                                const eventName = ImageBase.intermediateImageFailedEvent;
+                                if (nativeView.hasListeners(eventName)) {
+                                    const imageError = new ImageError(throwable);
+                                    nativeView.notify({
+                                        eventName,
+                                        error: imageError
+                                    });
+                                }
+                            }
+                        },
+                        onIntermediateImageSet(id, imageInfo) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onIntermediateImageSet', id, imageInfo);
+                            }
+                            const nativeView = that?.get();
+                            if (nativeView) {
+                                nativeView.updateViewSize(imageInfo);
+                                const eventName = ImageBase.intermediateImageSetEvent;
+                                if (nativeView.hasListeners(eventName)) {
+                                    const info = new ImageInfo(imageInfo);
+                                    nativeView.notify({
+                                        eventName,
+                                        imageInfo: info
+                                    });
+                                }
+                            }
+                        },
+                        onRelease(id) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onRelease', id);
+                            }
+                            const nativeView = that?.get();
+                            if (nativeView) {
+                                const eventName = ImageBase.releaseEvent;
+                                if (nativeView.hasListeners(eventName)) {
+                                    nativeView.notify({
+                                        eventName
+                                    });
+                                }
+                            }
+                        },
+                        onSubmit(id, callerContext) {
+                            if (Trace.isEnabled()) {
+                                CLog(CLogTypes.info, 'onSubmit', id, callerContext);
+                            }
+                            const nativeView = that?.get();
+                            const eventName = ImageBase.submitEvent;
+                            if (nativeView?.hasListeners(eventName)) {
+                                nativeView.notify({
+                                    eventName
+                                });
+                            }
                         }
-                    }
+                    });
+                }
+                const options = JSON.stringify({
+                    progressiveRenderingEnabled: this.blurRadius,
+                    localThumbnailPreviewsEnabled: this.blurRadius,
+                    decodeWidth: this.decodeWidth,
+                    decodeHeight: this.decodeHeight,
+                    blurRadius: this.blurRadius,
+                    lowerResSrc: this.lowerResSrc ? getUri(this.lowerResSrc, false) : undefined,
+                    blurDownSampling: this.blurDownSampling,
+                    autoPlayAnimations: this.autoPlayAnimations,
+                    tapToRetryEnabled: this.tapToRetryEnabled
                 });
+                view.setUri(uri, options, this.controllerListener);
                 // const async = this.loadMode === 'async';
                 // if (async) {
-                const builder = com.facebook.drawee.backends.pipeline.Fresco.newDraweeControllerBuilder();
-                builder.setImageRequest(request);
-                builder.setCallerContext(src);
-                builder.setControllerListener(listener);
-                builder.setOldController(this.nativeImageViewProtected.getController());
-                if (Trace.isEnabled()) {
-                    builder.setPerfDataListener(new com.facebook.drawee.backends.pipeline.info.ImagePerfDataListener({
-                        onImageLoadStatusUpdated(param0, param1) {
-                            CLog(CLogTypes.info, 'onImageLoadStatusUpdated', param0, param1);
-                        },
-                        onImageVisibilityUpdated(param0, param1) {
-                            CLog(CLogTypes.info, 'onImageVisibilityUpdated', param0, param1);
-                        }
-                    }));
-                }
-                if (this.lowerResSrc) {
-                    builder.setLowResImageRequest(com.facebook.imagepipeline.request.ImageRequest.fromUri(getUri(this.lowerResSrc)));
-                }
-                if (this.autoPlayAnimations) {
-                    builder.setAutoPlayAnimations(this.autoPlayAnimations);
-                }
-                if (this.tapToRetryEnabled) {
-                    builder.setTapToRetryEnabled(this.tapToRetryEnabled);
-                }
-                const controller = builder.build();
-                this.nativeImageViewProtected.setController(controller);
+                // const builder = com.facebook.drawee.backends.pipeline.Fresco.newDraweeControllerBuilder();
+                // builder.setImageRequest(request);
+                // builder.setCallerContext(src);
+                // builder.setControllerListener(listener);
+                // builder.setOldController(this.nativeImageViewProtected.getController());
+                // if (Trace.isEnabled()) {
+                //     builder.setPerfDataListener(
+                //         new com.facebook.drawee.backends.pipeline.info.ImagePerfDataListener({
+                //             onImageLoadStatusUpdated(param0: com.facebook.drawee.backends.pipeline.info.ImagePerfData, param1: number) {
+                //                 CLog(CLogTypes.info, 'onImageLoadStatusUpdated', param0, param1);
+                //             },
+                //             onImageVisibilityUpdated(param0: com.facebook.drawee.backends.pipeline.info.ImagePerfData, param1: number) {
+                //                 CLog(CLogTypes.info, 'onImageVisibilityUpdated', param0, param1);
+                //             }
+                //         })
+                //     );
+                // }
+                // if (this.lowerResSrc) {
+                //     builder.setLowResImageRequest(com.facebook.imagepipeline.request.ImageRequest.fromUri(getUri(this.lowerResSrc)));
+                // }
+                // if (this.autoPlayAnimations) {
+                //     builder.setAutoPlayAnimations(this.autoPlayAnimations);
+                // }
+                // if (this.tapToRetryEnabled) {
+                //     builder.setTapToRetryEnabled(this.tapToRetryEnabled);
+                // }
+                // const controller = builder.build();
+                // this.nativeImageViewProtected.setController(controller);
                 // } else {
                 // const dataSource = com.facebook.drawee.backends.pipeline.Fresco.getImagePipeline().fetchDecodedImage(request, src);
                 // const result = com.facebook.datasource.DataSources.waitForFinalResult(dataSource);
@@ -668,12 +651,7 @@ export class Img extends ImageBase {
             if (this.stretch) {
                 builder.setActualImageScaleType(this.stretch, this.imageRotation);
             }
-            if (this.fadeDuration) {
-                builder.setFadeDuration(this.fadeDuration);
-            }
-            else {
-                builder.setFadeDuration(0);
-            }
+            builder.setFadeDuration(this.fadeDuration || 0);
             if (this.backgroundUri && backgroundDrawable) {
                 builder.setBackground(backgroundDrawable);
             }
@@ -683,15 +661,14 @@ export class Img extends ImageBase {
             if (this.roundAsCircle) {
                 builder.setRoundingParamsAsCircle();
             }
-            if (this.roundBottomLeftRadius || this.roundBottomRightRadius || this.roundTopLeftRadius || this.roundTopRightRadius) {
-                const topLeftRadius = this.roundTopLeftRadius || 0;
-                const topRightRadius = this.roundTopRightRadius || 0;
-                const bottomRightRadius = this.roundBottomRightRadius || 0;
-                const bottomLeftRadius = this.roundBottomLeftRadius || 0;
+            const topLeftRadius = this.roundTopLeftRadius || 0;
+            const topRightRadius = this.roundTopRightRadius || 0;
+            const bottomRightRadius = this.roundBottomRightRadius || 0;
+            const bottomLeftRadius = this.roundBottomLeftRadius || 0;
+            if (topLeftRadius || topRightRadius || bottomRightRadius || bottomLeftRadius) {
                 builder.setCornersRadii(topLeftRadius, topRightRadius, bottomRightRadius, bottomLeftRadius);
             }
-            const hierarchy = builder.build();
-            this.nativeImageViewProtected.setHierarchy(hierarchy);
+            this.nativeImageViewProtected.setHierarchy(builder.build());
         }
     }
     getDrawable(path) {

package/index.ios.js

@@ -1,8 +1,8 @@
 export * from './index-common';
 import { ImageAsset, ImageSource, Screen, Trace, Utils, knownFolders, path } from '@nativescript/core';
-import { isString } from '@nativescript/core/utils/types';
-import { CLog, CLogTypes, EventData, ImageBase, ScaleType } from './index-common';
 import { layout } from '@nativescript/core/utils/layout-helper';
+import { isString } from '@nativescript/core/utils/types';
+import { CLog, CLogTypes, EventData, ImageBase, ScaleType, failureImageUriProperty, placeholderImageUriProperty, srcProperty, stretchProperty } from './index-common';
 export class ImageInfo {
     constructor(width, height) {
         this.width = width;
@@ -401,17 +401,17 @@ export class Img extends ImageBase {
             }
         }
     }
-    [ImageBase.srcProperty.setNative](value) {
+    [srcProperty.setNative](value) {
         this.initImage();
     }
-    [ImageBase.placeholderImageUriProperty.setNative]() {
+    [placeholderImageUriProperty.setNative]() {
         this.placeholderImage = this.getUIImage(this.placeholderImageUri);
         this.initImage();
     }
-    [ImageBase.failureImageUriProperty.setNative]() {
+    [failureImageUriProperty.setNative]() {
         // this.updateHierarchy();
     }
-    [ImageBase.stretchProperty.setNative](value) {
+    [stretchProperty.setNative](value) {
         if (!this.nativeView) {
             return;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nativescript-community/ui-image",
-    "version": "4.3.10",
+    "version": "4.3.12",
     "description": "Advanced and efficient image display plugin which uses Fresco (Android) and SDWebImage (iOS) to implement caching, placeholders, image effects, and much more.",
     "main": "./index",
     "sideEffects": false,
@@ -44,5 +44,5 @@
     },
     "license": "Apache-2.0",
     "readmeFilename": "README.md",
-    "gitHead": "1293779cf0c26f19c40694c88d4da85d92fbe2e2"
+    "gitHead": "9ea31cb0967917f14880e3928043f74497f59b88"
 }

package/platforms/android/include.gradle

@@ -9,6 +9,7 @@ dependencies {
 	implementation("com.facebook.fresco:imagepipeline-okhttp3:$frescoVersion") {
 		exclude group: 'com.facebook.soloader', module: 'soloader'
 	}
+    implementation("com.facebook.fresco:nativeimagetranscoder:$frescoVersion")
     implementation 'com.facebook.infer.annotation:infer-annotation:0.18.0'
 	// implementation ("com.facebook.fresco:animated-gif:$frescoVersion") {
 	// 	exclude group: 'com.facebook.soloader', module: 'soloader'