Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Vector pixelating on zoom-in

I'm trying to create a zoomable ImageView that can display vector images (SVG converted to Vector Drawable) that doesn't loose it's sharpness when zooming in.

I've used multiple Zooming approaches like this or this to handle the zooming, pinching and dragging. This resulted in a blurry mess when trying to zoom in, as seen below.

As I understand it from this article, these approaches don't work because the vector is drawn to bitmap , therefore pixelating when zooming in.

Is there any workaround to redraw the vector for each zoom step? Or should I try to draw the vector in a bigger size before displaying it?

Any Help is appreciated.

blurry when zooming in

Redraw on zoom? Draw bigger Canvas, then zoom?

like image 466
Alvaro Garcia Avatar asked Aug 09 '26 09:08

Alvaro Garcia


1 Answers

This is happening to conserve memory.

The Solution:

You should do subsampling scaling, which is to zoom in on stages.

for example: After zooming to 300% make a new bitmap from the vector which have the rectangle you are in only then start to zoom in the new image (see GIF below)

enter image description here

coding this will take some time, but I recommend using subsampling-scale-image-view library as an interface to do this. you can with a few changes make it for vector scaling.

like image 191
Jabbar Avatar answered Aug 11 '26 22:08

Jabbar



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!