Pre render linear gradients

Please provide the following:

  1. SDK Version: 37.0.0
  2. Platforms(Android/iOS/web/all): Android/iOS

Hi, is it possible to pre render linear gradients (expo-linear-gradient). I am rendering about 350 gradients, most of which have 2 colours, in a collapsible (react-native-collapsible) element and it freezes for around 5 seconds when expanding/shrinking the collapsible or pressing on it. Here is the element I am rendering:

<TouchableOpacity onPress={() => props.changeColour(props.colours)}>
<LinearGradient
style={styles.container}
colors={props.colours}
start={[0, 1]}
end={[1, 0]}>

All changeColor does is set another’s linear gradient colours to the one tapped.

I store these elements in a simple array, where I loop through the colours from a json file and push them to the mentioned array. I render these elements directly (ie. return({arrayWithComponents}) ). I only notice this poor performance when I render these elements.

Thanks for any help

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.