madsleejensen / react-native-image-sequence

native implementation for creating frame based image animations
MIT License
107 stars 67 forks source link

Size attribute should scale with DPI on Android #18

Closed ptelad closed 6 years ago

ptelad commented 6 years ago

Hi madsleejensen, First of all, great work on this lib, I love it.

Backstory: I'm working on porting my company's react-native app to Android from iOS and we have some hi-res PNG sequences in it using your lib. Moving to Android I noticed that all the animations are super blurry on high density devices like the S9, and this was not a problem on iOS.

The issue: After much digging around I noticed these lines:

if (this.desiredWidth != 0 && this.desiredHeight != 0) {
    return Bitmap.createScaledBitmap(bitmap, this.desiredWidth, this.desiredHeight, true);
}

And I remembered from my experience with bitmaps in Android that the createScaledBitmap function takes the pixels you give it quite literally, it is the dev's job to scale them according to the current DPI.

The fix: Simply multiply this.desiredWidth and this.desiredHeight with:

DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
metrics.density

Should do the trick. Full disclosure: I haven't tried it myself yet

Workaround: Set the size to {width: 0, height: 0}

ptelad commented 6 years ago

UPDATE I did try the solution, it works! I will have a pull request ready tomorrow.