From c73c46f03c18ed4e763069720a7efa46dc0e84d2 Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Fri, 25 Dec 2020 22:41:02 +0530 Subject: [PATCH 1/8] Update index.tsx I have tried with possible solution using fast image so far it works properly. if its okay then you can try merge it! --- src/index.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index 2a7f58e..d3a2a80 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -13,6 +13,7 @@ import { ImageErrorEventData, } from 'react-native'; import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect'; +import FastImage from 'react-native-fast-image'; export interface BetterImageProps extends ImageProps { viewStyle?: StyleProp; @@ -27,6 +28,7 @@ export interface BetterImageProps extends ImageProps { const { Value, createAnimatedComponent, timing } = Animated; const AnimatedImage = createAnimatedComponent(Image); +const AnimatedFImage = createAnimatedComponent(FastImage); const AnimatedImageBackground = createAnimatedComponent(ImageBackground); const BetterImage = ({ @@ -35,6 +37,7 @@ const BetterImage = ({ imageFadeDuration = 250, thumbnailSource, source, + isFast = false, onLoadEnd, resizeMethod, resizeMode, @@ -102,7 +105,7 @@ const BetterImage = ({ [source, thumbnailSource] ); - const ImageComponent = children ? AnimatedImageBackground : AnimatedImage; + const ImageComponent = children ? AnimatedImageBackground : isFast ? AnimatedFImage : AnimatedImage; return ( From adfb08946b87039b07158a0d7296b423399b6295 Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Fri, 25 Dec 2020 22:43:38 +0530 Subject: [PATCH 2/8] Update package.json dependencies updated --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index f39846e..6facf38 100644 --- a/package.json +++ b/package.json @@ -142,6 +142,7 @@ ] }, "dependencies": { - "use-deep-compare-effect": "^1.4.0" + "use-deep-compare-effect": "^1.4.0", + "react-native-fast-image": "^8.3.4" } } From a7c48706e2bc692e46c9d7b60b59aa88270b573e Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Fri, 25 Dec 2020 22:53:32 +0530 Subject: [PATCH 3/8] Update index.tsx `isFast` prop added in `BetterImageProps` --- src/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index d3a2a80..477d781 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -19,7 +19,8 @@ export interface BetterImageProps extends ImageProps { viewStyle?: StyleProp; thumbnailFadeDuration?: number; imageFadeDuration?: number; - thumbnailSource?: ImageSourcePropType; + isFast?: number; + thumbnailSource?: boolean; thumbnailBlurRadius?: number; fallbackSource?: ImageSourcePropType; children?: ReactNode; From 89ae77e972a4de2a9444efb488b40acdd4f6ee97 Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Fri, 25 Dec 2020 22:59:17 +0530 Subject: [PATCH 4/8] Update index.tsx --- src/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index 477d781..7458702 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -20,7 +20,8 @@ export interface BetterImageProps extends ImageProps { thumbnailFadeDuration?: number; imageFadeDuration?: number; isFast?: number; - thumbnailSource?: boolean; + source?: ImageSourcePropType; + thumbnailSource?: ImageSourcePropType; thumbnailBlurRadius?: number; fallbackSource?: ImageSourcePropType; children?: ReactNode; From 5f6260c05d9be0c48de5302e7b94000fa4cc647c Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Fri, 25 Dec 2020 23:03:16 +0530 Subject: [PATCH 5/8] Update index.tsx --- src/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index 7458702..3a9e186 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -19,7 +19,7 @@ export interface BetterImageProps extends ImageProps { viewStyle?: StyleProp; thumbnailFadeDuration?: number; imageFadeDuration?: number; - isFast?: number; + isFast?: boolean; source?: ImageSourcePropType; thumbnailSource?: ImageSourcePropType; thumbnailBlurRadius?: number; From 0cdc3b91b69fee93fc8bbf724113e342ec18121f Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Sun, 27 Dec 2020 20:48:10 +0530 Subject: [PATCH 6/8] custom image component prop added --- src/index.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index 3a9e186..0ec22d2 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -13,7 +13,6 @@ import { ImageErrorEventData, } from 'react-native'; import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect'; -import FastImage from 'react-native-fast-image'; export interface BetterImageProps extends ImageProps { viewStyle?: StyleProp; @@ -29,8 +28,6 @@ export interface BetterImageProps extends ImageProps { const { Value, createAnimatedComponent, timing } = Animated; -const AnimatedImage = createAnimatedComponent(Image); -const AnimatedFImage = createAnimatedComponent(FastImage); const AnimatedImageBackground = createAnimatedComponent(ImageBackground); const BetterImage = ({ @@ -39,7 +36,7 @@ const BetterImage = ({ imageFadeDuration = 250, thumbnailSource, source, - isFast = false, + imageComponent = Image, onLoadEnd, resizeMethod, resizeMode, @@ -107,7 +104,8 @@ const BetterImage = ({ [source, thumbnailSource] ); - const ImageComponent = children ? AnimatedImageBackground : isFast ? AnimatedFImage : AnimatedImage; + const AnimatedImage = createAnimatedComponent(imageComponent); + const ImageComponent = children ? AnimatedImageBackground : AnimatedImage; return ( From 3078157d8b30e56b6e4c5044cb1751eebccf8a99 Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Sun, 27 Dec 2020 20:49:02 +0530 Subject: [PATCH 7/8] fast image dependency removed --- package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/package.json b/package.json index 6facf38..f39846e 100644 --- a/package.json +++ b/package.json @@ -142,7 +142,6 @@ ] }, "dependencies": { - "use-deep-compare-effect": "^1.4.0", - "react-native-fast-image": "^8.3.4" + "use-deep-compare-effect": "^1.4.0" } } From 436239cbc5b8f6e0c90054dcbfb88819d6895159 Mon Sep 17 00:00:00 2001 From: Krunal Badami Date: Sun, 27 Dec 2020 20:55:37 +0530 Subject: [PATCH 8/8] Update index.tsx --- src/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index 0ec22d2..c18d602 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,4 +1,4 @@ -import React, { useRef, useCallback, useState, ReactNode } from 'react'; +import React, { useRef, useCallback, useState, ReactNode, Component } from 'react'; import { View, Image, @@ -18,7 +18,7 @@ export interface BetterImageProps extends ImageProps { viewStyle?: StyleProp; thumbnailFadeDuration?: number; imageFadeDuration?: number; - isFast?: boolean; + imageComponent?: Component; source?: ImageSourcePropType; thumbnailSource?: ImageSourcePropType; thumbnailBlurRadius?: number;