masked-view icon indicating copy to clipboard operation
masked-view copied to clipboard

When the maskelement is an image , the masked view is not rendered(Android)

Open vaishnav-197 opened this issue 1 year ago • 4 comments

When the maskelement is an image , the masked view is not rendered . the onLoadStart in the image is only fired , whereas onLoadEnd and OnLoad is not being triggered

This works perfectly on IOS . all the three functions and triggered correctly

"react": "17.0.2", "react-native": "0.67.5", "@react-native-masked-view/masked-view": "^0.2.8",

const maskElement = ( <Image onLoad={() => console.log('onLoad')} onLoadStart={() => console.log('onLoadStart')} onLoadEnd={() => { setLoaded(true); console.log('onLoadEnd'); }} style={{width: size, height: size, backgroundColor: 'transparent', borderRadius: size / 2}} source={global_images.mask} /> );

vaishnav-197 avatar Mar 29 '23 10:03 vaishnav-197

the same problem here

nitoba avatar Apr 24 '23 19:04 nitoba

Same

CraemEeg avatar Jun 03 '23 23:06 CraemEeg

Here is a work around. It triggers a rerender when the image source of the mask is loaded:

https://github.com/react-native-masked-view/masked-view/issues/135

Moistbobo avatar Jul 01 '23 13:07 Moistbobo

As documentation says

By default hardware rendering mode will be used for best performance, however if you need to animate your maskElement then you’ll need to switch to software to get your mask to update. This prop only affects Android.

So you may need to set androidRenderingMode="software" to re-render maskElement properly

roma-hladilka avatar May 20 '24 12:05 roma-hladilka