Skip to content

Instantly share code, notes, and snippets.

@vidux
Created April 9, 2020 16:21
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vidux/4dc55c21cc49bdc20fad861fc6ba6756 to your computer and use it in GitHub Desktop.
Save vidux/4dc55c21cc49bdc20fad861fc6ba6756 to your computer and use it in GitHub Desktop.
React Native google places autocomplete - geocode with strictbounds
//"react-native-google-places-autocomplete": "1.4.1",
<GooglePlacesAutocomplete
placeholder='search your address here'
minLength={2} // minimum length of text to search
autoFocus={true}
returnKeyType={'search'} // Can be left out for default return key https://facebook.github.io/react-native/docs/textinput.html#returnkeytype
keyboardAppearance={'light'} // Can be left out for default keyboardAppearance https://facebook.github.io/react-native/docs/textinput.html#keyboardappearance
listViewDisplayed='auto' // true/false/undefined
renderDescription={row => row.description} // custom description render
onPress={(data, details = null) => { // 'details' is provided when fetchDetails = true
;
if(data && data.description){
this.setState({searched_text:data.description})
}
}}
textInputProps={{
onChangeText: this.onChangeTexFunction
}}
getDefaultValue={() => ''}
query={{
key: 'your api key',
language: 'en',
components: 'country:lk', // your country
// types: "(regions)" , types
location:"6.881309, 79.904293",
radius:37000, //37 km around location point
strictbounds:true,
}}
styles={{
textInputContainer: {
backgroundColor: 'rgba(0,0,0,0)',
borderTopWidth: 0,
borderBottomWidth: 0
},
textInput: {
marginLeft: 0,
marginRight: 0,
height: 40,
color: '#5d5d5d',
fontSize: 20
},
predefinedPlacesDescription: {
color: '#1faadb'
},
}}
nearbyPlacesAPI='GoogleReverseGeocoding'
GoogleReverseGeocodingQuery={{
fields: 'formatted_address',
}}
filterReverseGeocodingByTypes={['route', 'street_address', 'locality', 'premise','political']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities
debounce={100} // debounce the requests in ms. Set to 0 to remove debounce. By default 0ms.
/>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment