Setting state inside of onScaleStart/onScaleChange causes image flicker

[lovelistudios]

Setting state inside of onScaleStart/onScaleChange causes image flicker

Note: I tried with the default renderItem function as well as a custom renderItem function that uses expo-image

I have 2 use cases for setting state inside of onScaleStart/onScaleChange:

1. I would like to use a Gallery inside of a ScrollView. However, zooming does not work unless I disable scroll on the ScrollView. Therefore, I am trying to disable scrollEnabled via a callback inside of onScaleStart, then I will reenable scrollEnabled in onScaleEnd. I thought perhaps that the issue was that rerendering the ScrollView was expensive, so I tried to just setState on a local throwaway value instead that is not used. However, this still caused the image flicker.
2. I would like to use a Gallery that does not take up the entire screen. However, when the user starts to Zoom, I would like to black out the rest of the screen and remove the header. I am trying to trigger these effects on either onScaleStart or have a gradual fadeout inside of onScaleChange.

[lsps9150414]

Same here. Also trying to setState onIndexChange and the swipe is glitching.
I tried wrapping the gallery component in a react.memo and made sure that it's not rerendered upon state change but this did not fix it.

@lovelistudios have you managed to resolve this issue?

[lovelistudios]

Same here. Also trying to setState onIndexChange and the swipe is glitching. I tried wrapping the gallery component in a react.memo and made sure that it's not rerendered upon state change but this did not fix it.

@lovelistudios have you managed to resolve this issue?

@lsps9150414 No, sorry, we weren't able to find a solution 😅