how to have a dropdown on top of a view when open?

In react native i'm using "react-native-dropdown-picker" library to make a dropdown, the problem is that when i open the picker it stays under the next view, so i decided to use zindex and i managed to place the picker on top of the next view, the problem is that i can't click on any of the options, when i click any of the dropdown's options, the touch is recognized on the view under the picker.

The following code is the code for the toolbar component where the dropdown is stored.

<View style={styles.toolbar}>
            <View style={{flexDirection:'row',alignItems:'center',justifyContent:'space-between',width:'100%'}}>
                <TouchableWithoutFeedback onPress={() => {props.toggleDrawer()}} >
                    <View style={styles.menu}>
                        <View style={styles.menuBar}/>
                        <View style={styles.menuBar}/>
                        <View style={styles.menuBar}/>
                    </View>
                </TouchableWithoutFeedback>
                    {logo}
            </View>
            <DropDownPicker
                        items={condominiumsList}
                        defaultValue={condominium}
                        containerStyle={{height: 45}}
                        style={styles.formBoxes}
                        labelStyle={{fontFamily:'segoeui4',fontSize:14,flex:1}}
                        dropDownStyle={styles.formBoxes}
                        onChangeItem={item=>{condominiumInputHandler(item.value)}}
                />
        </View>

And this code shows where the toolbar is used and the view thats under it:

<NavigationContainer>
          <View style={{...styles.default,...styles.marginTopPhone}}>  
            <ToolbarLogged toggleDrawer={()=>{navigation.toggleDrawer()}}
                idLang={(stringLang==strings_pt)?1:2} lang={stringLang}/> 
            <DrawerCustom.Navigator drawerContent={props => <DrawerContent langFile={stringLang} lang={(stringLang==strings_pt)? 1 : 0}  {...{...props}}/>}>
                <DrawerCustom.Screen name='Dashboard' component={makeLayout} initialParams={{ name: stringLang.dashboard}}/>
                <DrawerCustom.Screen name='Condominium' component={makeLayout} initialParams={{ name: stringLang.condominium}}/>
                <DrawerCustom.Screen name='Profile' component={makeLayout} initialParams={{ name: stringLang.profile}}/>
                <DrawerCustom.Screen name='Signout' component={Signout} />
            </DrawerCustom.Navigator>
          </View>
        </NavigationContainer>

The makeLayout function, makes the current layout depending on the name param thats given, and as u can see if i dont use zindex on the superior view of the toolbar, the dropdown gets loaded under the screen given by the makelayout function, and if i use zindex then i cant select any of the options on the dropdown.