How can I zoom Images in Canvas without losing quality?

[wDRxxx]

Hello,
How can I zoom Images in Canvas without losing quality?
I want to zoom big images, but if I zoom it with simple RN Image or Skia image, I have very bad quality zoom.
I have tried to use rn-image-zoom and it's working bad with big images.
Hope for help, thanks

[Volper212]

Here are the steps:

1. Get the image's width and height in pixels.
2. Convert the px width and height to dp (the unit used by React Native styles).
3. Make sure the Skia canvas has its width and height equal to those values (it should be bigger than the viewport for large images). Keep in mind it may be bigger than the container, so you need to adjust the style to support that.
4. Have it zoomed in to fit in the container by default.

If you run into trouble implementing this, contact me.

[Glazzes]

You can try out my library, I've built it around use cases like this one. In the docs you can check out the How to use with Skia Components guide.

[Volper212]

@openspacelabs/react-native-zoomable-view is also a library you can use.