@nativescript-community/ui-image 4.0.34 → 4.1.3

package/CHANGELOG.md

@@ -3,6 +3,47 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.1.3](https://github.com/nativescript-community/ui-image/compare/v4.1.2...v4.1.3) (2022-01-14)
+
+
+### Bug Fixes
+
+* **ios:** fixed transforms not being applied. New `animatedImageView` property to be set when using animated images ([5fb20f1](https://github.com/nativescript-community/ui-image/commit/5fb20f1d13cc48fe57000dc2fa6bb15c8b568ff0))
+
+
+
+
+
+## [4.1.2](https://github.com/nativescript-community/ui-image/compare/v4.1.1...v4.1.2) (2021-12-29)
+
+**Note:** Version bump only for package @nativescript-community/ui-image
+
+
+
+
+
+## [4.1.1](https://github.com/nativescript-community/ui-image/compare/v4.1.0...v4.1.1) (2021-12-23)
+
+
+### Bug Fixes
+
+* android remove dep on annotationx ([c9fdfbe](https://github.com/nativescript-community/ui-image/commit/c9fdfbe8f7c7f876abb53b1d8b9b7c68d65ae21f))
+
+
+
+
+
+# [4.1.0](https://github.com/nativescript-community/ui-image/compare/v4.0.34...v4.1.0) (2021-10-21)
+
+
+### Features
+
+* **android:** native-api-usage ([0ec235c](https://github.com/nativescript-community/ui-image/commit/0ec235c2df1d5c4f6f30615766ea17ba74576dc7))
+
+
+
+
+
 ## [4.0.34](https://github.com/nativescript-community/ui-image/compare/v4.0.33...v4.0.34) (2021-10-15)
 
 **Note:** Version bump only for package @nativescript-community/ui-image

package/image-common.d.ts

@@ -41,6 +41,7 @@ export interface ImageError {
 }
 export interface ImagePipelineConfigSetting {
     isDownsampleEnabled?: boolean;
+    leakTracker?: any;
 }
 export declare class EventData implements IEventData {
     private _eventName;
@@ -81,6 +82,7 @@ export declare class ImageBase extends View {
     aspectRatio: number;
     decodeWidth: number;
     decodeHeight: number;
+    animatedImageView: boolean;
     alwaysFade: boolean;
     noCache: boolean;
     tintColor: Color;
@@ -112,6 +114,7 @@ export declare class ImageBase extends View {
     static roundBottomLeftRadiusProperty: Property<ImageBase, CoreTypes.LengthType>;
     static roundBottomRightRadiusProperty: Property<ImageBase, CoreTypes.LengthType>;
     static clipToBoundsProperty: Property<ImageBase, boolean>;
+    static animatedImageViewProperty: Property<ImageBase, boolean>;
     protected handleImageProgress(value: number, totalSize?: number): void;
     private static needsSizeAdjustment;
     computeScaleFactor(measureWidth: number, measureHeight: number, widthIsFinite: boolean, heightIsFinite: boolean, nativeWidth: number, nativeHeight: number, aspectRatio: number): {

package/image-common.js

@@ -147,6 +147,7 @@ ImageBase.roundTopRightRadiusProperty = new Property({ name: 'roundTopRightRadiu
 ImageBase.roundBottomLeftRadiusProperty = new Property({ name: 'roundBottomLeftRadius', defaultValue: 0, valueConverter: (v) => Length.toDevicePixels(Length.parse(v)) });
 ImageBase.roundBottomRightRadiusProperty = new Property({ name: 'roundBottomRightRadius', defaultValue: 0, valueConverter: (v) => Length.toDevicePixels(Length.parse(v)) });
 ImageBase.clipToBoundsProperty = new Property({ name: 'clipToBounds', defaultValue: true, valueConverter: booleanConverter });
+ImageBase.animatedImageViewProperty = new Property({ name: 'animatedImageView', defaultValue: false, valueConverter: booleanConverter });
 ImageBase.srcProperty.register(ImageBase);
 ImageBase.lowerResSrcProperty.register(ImageBase);
 ImageBase.placeholderImageUriProperty.register(ImageBase);
@@ -173,4 +174,5 @@ ImageBase.decodeHeightProperty.register(ImageBase);
 ImageBase.alwaysFadeProperty.register(ImageBase);
 ImageBase.noCacheProperty.register(ImageBase);
 ImageBase.clipToBoundsProperty.register(ImageBase);
+ImageBase.animatedImageViewProperty.register(ImageBase);
 //# sourceMappingURL=image-common.js.map

package/image.android.js

@@ -18,9 +18,13 @@ export function initialize(config) {
         if (config && config.isDownsampleEnabled) {
             builder.setDownsampleEnabled(true);
         }
+        if (config && config.leakTracker) {
+            builder.setCloseableReferenceLeakTracker(config.leakTracker);
+        }
         const imagePipelineConfig = builder.build();
         com.facebook.drawee.backends.pipeline.Fresco.initialize(context, imagePipelineConfig);
         initialized = true;
+        initializeConfig = null;
     }
 }
 export function getImagePipeline() {

package/image.d.ts

@@ -194,6 +194,11 @@ export class Img extends View {
      * Number value used as the resized image height
      */
     decodeHeight: number;
+
+    /**
+     * IOS: if you want to show animated images you need to set this to true
+     */
+    animatedImageView: boolean;
 }
 
 /**

package/image.ios.d.ts

@@ -31,10 +31,10 @@ export declare class ImagePipeline {
 }
 export declare function getImagePipeline(): ImagePipeline;
 export declare class Img extends ImageBase {
-    nativeViewProtected: SDAnimatedImageView;
+    nativeViewProtected: SDAnimatedImageView | UIImageView;
     isLoading: boolean;
     private _imageSourceAffectsLayout;
-    createNativeView(): SDAnimatedImageView;
+    createNativeView(): UIImageView;
     _setNativeClipToBounds(): void;
     onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void;
     updateImageUri(): void;

package/image.ios.js

@@ -3,39 +3,6 @@ import { ImageAsset, ImageSource, Screen, Trace, knownFolders, path } from '@nat
 import { isString } from '@nativescript/core/utils/types';
 import { RESOURCE_PREFIX, isFileOrResourcePath, isFontIconURI, layout } from '@nativescript/core/utils/utils';
 import { CLog, CLogTypes, ImageBase, ScaleType } from './image-common';
-var SDImageRoundAsCircleTransformer = /** @class */ (function (_super) {
-    __extends(SDImageRoundAsCircleTransformer, _super);
-    function SDImageRoundAsCircleTransformer() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SDImageRoundAsCircleTransformer.transformer = function () {
-        var transformer = SDImageRoundAsCircleTransformer.alloc().init();
-        return transformer;
-    };
-    Object.defineProperty(SDImageRoundAsCircleTransformer.prototype, "transformerKey", {
-        get: function () {
-            return 'SDImageRoundAsCircleTransformer';
-        },
-        enumerable: true,
-        configurable: true
-    });
-    SDImageRoundAsCircleTransformer.prototype.transformedImageWithImageForKey = function (image, key) {
-        if (!image) {
-            return null;
-        }
-        var width = image.size.width;
-        var height = image.size.height;
-        var minwidth = Math.min(width, height);
-        var cornerRadius = minwidth / 2;
-        var result = image
-            .sd_resizedImageWithSizeScaleMode(CGSizeMake(minwidth, minwidth), SDImageScaleMode.AspectFill)
-            .sd_roundedCornerImageWithRadiusCornersBorderWidthBorderColor(cornerRadius, UIRectCorner.BottomLeft | UIRectCorner.BottomRight | UIRectCorner.TopLeft | UIRectCorner.TopRight, 0, null)
-            .sd_resizedImageWithSizeScaleMode(CGSizeMake(width, height), SDImageScaleMode.AspectFit);
-        return result;
-    };
-    SDImageRoundAsCircleTransformer.ObjCProtocols = [SDImageTransformer];
-    return SDImageRoundAsCircleTransformer;
-}(NSObject));
 export class ImageInfo {
     constructor(width, height) {
         this.width = width;
@@ -236,7 +203,7 @@ export class Img extends ImageBase {
         };
     }
     createNativeView() {
-        const result = SDAnimatedImageView.new();
+        const result = this.animatedImageView ? SDAnimatedImageView.new() : UIImageView.new();
         result.contentMode = 1;
         result.clipsToBounds = true;
         result.userInteractionEnabled = true;
@@ -379,12 +346,15 @@ export class Img extends ImageBase {
                     transformers.push(SDImageBlurTransformer.transformerWithRadius(this.blurRadius));
                 }
                 if (this.roundAsCircle === true) {
-                    transformers.push(SDImageRoundAsCircleTransformer.new());
+                    transformers.push(NSImageRoundAsCircleTransformer.transformer());
                 }
                 if (this.roundBottomLeftRadius || this.roundBottomRightRadius || this.roundTopLeftRadius || this.roundTopRightRadius) {
                     transformers.push(NSImageRoundCornerTransformer.transformerWithTopLefRadiusTopRightRadiusBottomRightRadiusBottomLeftRadius(layout.toDeviceIndependentPixels(this.roundTopLeftRadius), layout.toDeviceIndependentPixels(this.roundTopRightRadius), layout.toDeviceIndependentPixels(this.roundBottomRightRadius), layout.toDeviceIndependentPixels(this.roundBottomLeftRadius)));
                 }
                 if (transformers.length > 0) {
+                    if (this.animatedImageView) {
+                        options |= 512;
+                    }
                     context.setValueForKey(SDImagePipelineTransformer.transformerWithTransformers(transformers), SDWebImageContextImageTransformer);
                 }
                 this.nativeViewProtected.sd_setImageWithURLPlaceholderImageOptionsContextProgressCompleted(uri, this.placeholderImage, options, context, this.onLoadProgress, this.handleImageLoaded);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nativescript-community/ui-image",
-    "version": "4.0.34",
+    "version": "4.1.3",
     "description": "Advanced and efficient image display plugin which uses Fresco (Android) and SDWebImage (iOS) to implement caching, placeholders, image effects, and much more.",
     "main": "./image",
     "sideEffects": false,
@@ -36,5 +36,5 @@
     },
     "license": "Apache-2.0",
     "readmeFilename": "README.md",
-    "gitHead": "9293bf7be60719ed1f475a9d9ce71a82d873821b"
+    "gitHead": "7234bbcc3e78bc8ea469bf75657ef2e3be3453d2"
 }

package/platforms/android/.gradle/buildOutputCleanup/cache.properties

@@ -0,0 +1,2 @@
+#Thu Dec 23 15:59:45 CET 2021
+gradle.version=6.4

package/platforms/android/include.gradle

@@ -14,8 +14,8 @@ dependencies {
 	implementation("com.facebook.fresco:imagepipeline-okhttp3:$frescoVersion") {
 		exclude group: 'com.facebook.soloader', module: 'soloader'
 	}
-	implementation ("com.facebook.fresco:animated-gif:$frescoVersion") {
-		exclude group: 'com.facebook.soloader', module: 'soloader'
-	}
+	// implementation ("com.facebook.fresco:animated-gif:$frescoVersion") {
+	// 	exclude group: 'com.facebook.soloader', module: 'soloader'
+	// }
     implementation(name:'widgets-release', ext:'aar')
 }

package/platforms/android/java/com/nativescript/image/DraweeView.java

@@ -24,8 +24,6 @@ import org.nativescript.widgets.BorderDrawable;
 
 import java.util.Arrays;
 
-import androidx.annotation.RequiresApi;
-
 public class DraweeView extends SimpleDraweeView {
     public int imageWidth = 0;
     public int imageHeight = 0;
@@ -108,7 +106,6 @@ public class DraweeView extends SimpleDraweeView {
     Path innerBorderPath;
     Path innerBorderTempPath;
 
-    @RequiresApi(api = Build.VERSION_CODES.KITKAT)
     private Path generateInnerBorderPath(BorderDrawable borderDrawable) {
 
         float borderTopLeftRadius = borderDrawable.getBorderTopLeftRadius();
@@ -154,7 +151,6 @@ public class DraweeView extends SimpleDraweeView {
         return innerBorderPath;
     }
 
-    @RequiresApi(api = Build.VERSION_CODES.KITKAT)
     @Override
     protected void onDraw(Canvas canvas) {
         Drawable drawable = getBackground();

package/platforms/android/native-api-usage.json

@@ -1,5 +1,32 @@
 {
     "uses": [
-        "com.facebook.drawee.drawable:ScalingUtils*","com.facebook.drawee.drawable.ScalingUtils:ScaleType*","com.facebook.drawee.generic:RoundingParams*","com.facebook.drawee.drawable:ProgressBarDrawable*","com.facebook.drawee.view:DraweeView*","com.facebook.drawee.interfaces:DraweeHierarchy*","com.facebook.drawee.interfaces:SettableDraweeHierarchy*","com.facebook.drawee.interfaces:SimpleDraweeControllerBuilder*","com.facebook.drawee.interfaces:DraweeController*","com.facebook.drawee.generic:GenericDraweeHierarchyBuilder*","com.facebook.drawee.generic:GenericDraweeHierarchy*","com.facebook.imagepipeline.request:ImageRequestBuilder*","com.facebook.imagepipeline.request:ImageRequest*","com.facebook.imagepipeline.core:ImagePipelineConfig*","com.facebook.imagepipeline.common:RotationOptions*","com.facebook.imagepipeline.common:ResizeOptions*","com.facebook.drawee.backends.pipeline:Fresco*","com.facebook.drawee.backends.pipeline:PipelineDraweeControllerBuilder*","com.facebook.drawee.backends.pipeline:PipelineDraweeController*","com.facebook.drawee.controller:AbstractDraweeControllerBuilder*","com.facebook.drawee.controller:AbstractDraweeController*","com.facebook.drawee.backends.pipeline.info:ImagePerfDataListener*","com.facebook.drawee.backends.pipeline.info:ImagePerfData*","com.facebook.drawee.controller:ControllerListener*","com.nativescript.image:DraweeView*","com.nativescript.image:ScalingBlurPostprocessor*","android.graphics.drawable:Animatable"
+        "com.facebook.drawee.drawable:ScalingUtils*",
+        "com.facebook.drawee.drawable.ScalingUtils:ScaleType*",
+        "com.facebook.drawee.generic:RoundingParams*",
+        "com.facebook.drawee.drawable:ProgressBarDrawable*",
+        "com.facebook.drawee.view:DraweeView*",
+        "com.facebook.drawee.interfaces:DraweeHierarchy*",
+        "com.facebook.drawee.interfaces:SettableDraweeHierarchy*",
+        "com.facebook.drawee.interfaces:SimpleDraweeControllerBuilder*",
+        "com.facebook.drawee.interfaces:DraweeController*",
+        "com.facebook.drawee.generic:GenericDraweeHierarchyBuilder*",
+        "com.facebook.drawee.generic:GenericDraweeHierarchy*",
+        "com.facebook.imagepipeline.request:ImageRequestBuilder*",
+        "com.facebook.imagepipeline.request:ImageRequest*",
+        "com.facebook.imagepipeline.core:ImagePipelineConfig*",
+        "com.facebook.imagepipeline.common:RotationOptions*",
+        "com.facebook.imagepipeline.common:ResizeOptions*",
+        "com.facebook.drawee.backends.pipeline:Fresco*",
+        "com.facebook.drawee.backends.pipeline:PipelineDraweeControllerBuilder*",
+        "com.facebook.drawee.backends.pipeline:PipelineDraweeController*",
+        "com.facebook.drawee.controller:AbstractDraweeControllerBuilder*",
+        "com.facebook.drawee.controller:AbstractDraweeController*",
+        "com.facebook.drawee.backends.pipeline.info:ImagePerfDataListener*",
+        "com.facebook.drawee.backends.pipeline.info:ImagePerfData*",
+        "com.facebook.drawee.controller:ControllerListener*",
+        "com.nativescript.image:DraweeView*",
+        "com.nativescript.image:ScalingBlurPostprocessor*",
+        "android.graphics.drawable:Animatable",
+        "com.facebook.imagepipeline.image:ImageInfo*"
     ]
 }

package/platforms/ios/src/NImage.h

@@ -4,3 +4,4 @@
 
 #import "NSImageRoundCornerTransformer.h"
 #import "NSImageDecodeSizeTransformer.h"
+#import "NSImageRoundAsCircleTransformer.h"

package/platforms/ios/src/NSImageRoundAsCircleTransformer.h

@@ -0,0 +1,8 @@
+#import <SDWebImage/SDImageTransformer.h>
+
+@interface NSImageRoundAsCircleTransformer: NSObject <SDImageTransformer>
+
+- (nonnull instancetype)init NS_UNAVAILABLE;
++ (nonnull instancetype)transformer;
+
+@end

package/platforms/ios/src/NSImageRoundAsCircleTransformer.m

@@ -0,0 +1,40 @@
+#import "NSImageRoundAsCircleTransformer.h"
+#import <SDWebImage/SDGraphicsImageRenderer.h>
+
+@interface NSImageRoundAsCircleTransformer ()
+
+@end
+
+@implementation NSImageRoundAsCircleTransformer
++ (instancetype)transformer {
+
+    NSImageRoundAsCircleTransformer *transformer = [NSImageRoundAsCircleTransformer new];
+    return transformer;
+}
+
+- (NSString *)transformerKey {
+    return [NSString stringWithFormat:@"NSImageRoundAsCircleTransformer"];
+}
+
+- (UIImage *)transformedImageWithImage:(UIImage *)image forKey:(NSString *)key {
+    if (!image) {
+        return nil;
+    }
+
+    CGFloat width = (CGFloat)image.size.width;
+    CGFloat height = (CGFloat)image.size.height;
+    CGFloat minwidth = MIN(width, height);
+    CGFloat cornerRadius = minwidth / 2;
+
+    UIImage * resultImage = [image sd_resizedImageWithSize:CGSizeMake(minwidth, minwidth) scaleMode:SDImageScaleModeAspectFill];
+    resultImage = [resultImage sd_roundedCornerImageWithRadius:cornerRadius corners:UIRectCornerAllCorners borderWidth:0 borderColor:nil];
+    return resultImage;
+    //     const result = (image as any)
+    //         .sd_resizedImageWithSizeScaleMode(CGSizeMake(minwidth, minwidth), SDImageScaleMode.AspectFill)
+    //         .sd_roundedCornerImageWithRadiusCornersBorderWidthBorderColor(cornerRadius, UIRectCorner.BottomLeft | UIRectCorner.BottomRight | UIRectCorner.TopLeft | UIRectCorner.TopRight, 0, null)
+    //         .sd_resizedImageWithSizeScaleMode(CGSizeMake(width, height), SDImageScaleMode.AspectFit);
+    //     return result;
+    // return resultImage;
+}
+
+@end

package/flipper/index.d.ts

@@ -1,4 +0,0 @@
-declare const ImagePlugin: {
-    install(client: any): void;
-};
-export default ImagePlugin;

package/flipper/index.js

@@ -1,9 +0,0 @@
-import { enableFlipper } from '../image';
-const ImagePlugin = {
-    install(client) {
-        enableFlipper();
-        client.addPlugin(new com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin());
-    }
-};
-export default ImagePlugin;
-//# sourceMappingURL=index.js.map