search

SrBrahma / react-native-shadow-2

Cross-platform shadow for React Native. Supports Android, iOS, Web, and Expo
MIT License
674 stars 56 forks source link

Issue with borderRadius in the latest version 7 when size of the elements changes #72

Closed midrizi closed 1 year ago

midrizi commented 1 year ago

With version 7: https://snack.expo.dev/pawromLkg

image

With version 6: https://snack.expo.dev/m1WNh4Ekc

image

SrBrahma commented 1 year ago

Thanks for the report. It seems that the code that takes care of the radii limitation is not considering when the child changes its size. I will take a look when I have the time. In the meantime, you may want to try a smaller radius, which wouldn't be limited by the small child size.

midrizi commented 1 year ago

@SrBrahma Thanks for the quick reply, take your time. But even if I use small values like everything including 10 and above breaks it.

SrBrahma commented 1 year ago

Beware that in v7 we no longer use the radius property, but the style={{ borderRadius: 10 }}, so that's what you want to change.

Here it worked, although there is a visual artifact that also needs to be fixed.

image

Setting the borderRadius to 8 gives a clean result on Web. Not a good solution, but a workaround in the meantime.

SrBrahma commented 1 year ago

As this is an ugly bug, I will try to fix it on Monday. Thanks once again for the report!

SrBrahma commented 1 year ago

Hi, sorry for the delay. I was trying to fix that artifact on the web (

image

) but it seems to be a non-deterministic issue caused by high-resolution screens on web that have window.devicePixelRatio !== 1. Mine for example, in my quite new laptop, is 1.5. It was taking too long (and nothing I tried worked), so I decided to just update the package with the original issue's fix, under 7.0.8. Please, let me know if it fixed your problem.