zIndex isn't working for a react native project

z-index working fine in IOS. but again you will get isssue in android. In android z-index is not working you need to use elevation. But please do not forget to add z-index.

<TouchableOpacity
              style={{
                alignSelf: 'center',
                position: 'absolute',
                right: 10,
                top: 10,
                zIndex: 15,
                elevation: (Platform.OS === 'android') ? 50 : 0
              }}
              onPress={() => {}}
            >
              <Image
                source={require('dummy.png')}
              />
            </TouchableOpacity>

In React Native we have position: relative by default. If you want to make the correct use of zIndex, you might need to add position: 'absolute', for them to overlap as described in your use case.

For example:

<View style={{flex: 1}}>
               <View style={{width: 200, height: 200, zIndex: 1, position: 'absolute', backgroundColor: 'red'}} />
               <View style={{width: 200, height: 200, zIndex: 2, position: 'absolute', backgroundColor: 'blue'}} />
 </View>