Search code examples
stylesreact-nativez-index

React Native - zIndex

I try to make FlatList where circles are different sizes, for each cirle, i need to have own zIndex.

enter image description here

Numbers in circles, show zIndex number, as you see its not working.

I use zIndex on <TouchableWithoutFeedback>

Here is my component:

<TouchableWithoutFeedback
        onPress={() => dispatch(selectHockeyPlayer(item))}
        style={[
          styles.listItem,
          {
            width: playerWidth,
            height: playerWidth,
            transform: [{scale: scaleNum + 1.2}],
            zIndex: Math.floor(scaleNum + 2),
          },
          isRated ? styles.isRated : null,
          styles.circle,
          activePlayer(item, styles.selectedListItem),
        ]}>
Solution

  • Allright, i figured out what was the problem, FlatList doesnt work with zIndex, so i had to use ScrollView.