Can not click on location from the list on android device

I got the list showing but I can not click on them (Can click on IOS Simulator but can not click on Android device)

Here is my code

 <View style={[styles.containerTop]}>   
    <GooglePlacesAutocomplete
                        placeholder='Search'
                        minLength={2} // minimum length of text to search
                        autoFocus={false}
                        returnKeyType={'search'} // Can be left out for default return key https://facebook.github.io/react-native/docs/textinput.html#returnkeytype
                        listViewDisplayed='auto'
                        fetchDetails={true}
                        renderDescription={row => row.description} // custom description render
                        onPress={(data, location = null) => { // 'details' is provided when fetchDetails = true
                            console.log(data);
                            console.log(location);
                        }}
                        getDefaultValue={() => this.props.currentAddress}

                        query={{
                            // available options: https://developers.google.com/places/web-service/autocomplete
                            key: 'xxxxxxxxx',
                            language: 'en', // language of the results
                            types: '', // default: 'geocode'
                        }}
                        styles={{
                            description: {
                                fontWeight: 'bold',
                                backgroundColor: 'white',
                            },
                            predefinedPlacesDescription: {
                                color: '#1faadb',
                                backgroundColor: 'white',
                            },
                            textInputContainer: {
                                backgroundColor: 'rgba(47, 111, 45, 0.0)',
                                borderBottomWidth: 0,
                                borderTopWidth: 0,
                                zIndex: 500,
                            },
                            textInput: {
                                backgroundColor: 'white',
                                borderBottomWidth: 0.1,
                                borderColor: 'rgb(47, 111, 45, 0.1)',
                            },
                            listView: {
                                marginTop: 50,
                                elevation: 1,
                                backgroundColor: 'white',
                                position: 'absolute',
                                zIndex: 500,
                            },
                        }}

                        currentLocation={this.state.currentLocationStatus} // Will add a 'Current location' button at the top of the predefined places list
                        currentLocationLabel="Current location"
                        nearbyPlacesAPI='GooglePlacesSearch' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch
                        GoogleReverseGeocodingQuery={{
                            // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro
                        }}
                        GooglePlacesSearchQuery={{
                            // available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search
                            rankby: 'distance',
                            types: 'food',
                        }}

                        filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities

                        predefinedPlaces={this.state.predefinedList}

                        predefinedPlacesAlwaysVisible={true}
                    />
 </View>

    containerTop: {
        height: 0,
        flexDirection: 'row',
        padding: 25,
        paddingBottom: 50,
        marginTop: (isIphoneX() ? 20 : 0),
        zIndex: 200,
    },

[bell-steven]

Looks like this might have been resolved. Please open a new issue if this is still a problem.

[tvillafane]

What worked for me was the following (pseudo coded layout scheme):

<View flex={1}>
    <View style={{ position: 'relative', height: 50 }}>
        <Autocomplete style={{  container: { positition: 'absolute', height: 50 } }} />
    </View>
    <View style={{ flex: 1, zIndex: -1 }}>
        *ALL MY CONTENT*
    </View>
</View>

Make the header container which contains the autocomplete component have no z index stuff . and then put a negative zIndex on the container of the rest of your content. Works on my Pixel with Android 9