react-native-fast-image icon indicating copy to clipboard operation
react-native-fast-image copied to clipboard

Fix: Bitmap transformation with size limit

Open chrispader opened this issue 2 years ago • 6 comments

Original PR by @ArekChr: https://github.com/Expensify/react-native-fast-image/pull/6


This pull request introduces a new transformation method for handling Bitmap objects with a size limit. It provides an implementation that scales down the input Bitmap if its byte count exceeds the specified threshold.

This pull request addresses an issue encountered when dealing with large images on Android devices with hardware acceleration enabled. The issue manifests as a java.lang.RuntimeException: Canvas: trying to draw too large(xxx,xxx,xxx bytes) bitmap error. By introducing a new transformation method, this pull request offers a solution to display large images while still accommodating the specified size limit.

Changes Made:

Added a new class ResizeTransformation, transform, to perform the Bitmap transformation. The transform method uses a BitmapPool, the transform Bitmap, and output width and height as parameters. If the transform Bitmap's byte count exceeds the predefined MAX_BYTES threshold: A scaling factor is calculated based on the square root of the ratio between MAX_BYTES and the transform Bitmap's byte count. The new width and height are computed by multiplying the output width and height by the scaling factor. The Bitmap.createScaledBitmap() method creates a scaled Bitmap with new dimensions. The scaled Bitmap is returned as the result of the transformation. If the transform Bitmap's byte count is within the MAX_BYTES threshold: The original toTransform Bitmap is returned as it is.

Overall, this pull request aims to provide a reusable and efficient Bitmap transformation implementation that handles size limitations, allowing for optimized memory usage when working with large images.

Related issues: https://github.com/Expensify/App/issues/17427 https://github.com/Expensify/App/issues/18963

chrispader avatar Nov 21 '23 11:11 chrispader

nice!

cbjs avatar Nov 27 '23 09:11 cbjs

Hi @chrispader. I'm interesting in trying to solve the Android large image crash for Expensify/App and it looks like this was a good candidate until recently. Is this still a possible fix, or has it become deprecated with the recent merging of Expo-Image?

Julesssss avatar Jan 11 '24 15:01 Julesssss

Hi @chrispader. I'm interesting in trying to solve the Android large image crash for Expensify/App and it looks like this was a good candidate until recently. Is this still a possible fix, or has it become deprecated with the recent merging of Expo-Image?

Yea, with react-native-fast-image this fixed the problem. I'd have to look into the expo-image code and see how it's possible there. But i think since they also use Glide, it shouldn't be a problem.

chrispader avatar Jan 18 '24 14:01 chrispader

Hey agian @chrispader. I agree that this isn't necessary for us anymore. But we do have the same native Canvas crash with Expo-Image which I'm working on here.

Julesssss avatar Jan 18 '24 14:01 Julesssss

Hey agian @chrispader. I agree that this isn't necessary for us anymore. But we do have the same native Canvas crash with Expo-Image which I'm working on here.

i'm adding a comment in the issue there, because i'm not quite sure we mean the same thing.

chrispader avatar Jan 18 '24 14:01 chrispader

@chrispader thanks

numandev1 avatar Feb 06 '24 18:02 numandev1

Closing this PR since i don't think there's much traffic going on in this repo and this will probably not be merged anytime soon.

@Julesssss since we migrated to Expo-Image in Expensify, i don't think we're gonna need to keep this open either...

chrispader avatar Mar 27 '24 15:03 chrispader