React-native-google-places-autocomplete: Custom ListView row renderer

[antonsivogrivov]

I think it's good to give the possibility to set custom renderer for ListView rows.

[antonsivogrivov]

If you share this idea, I would be glad to do pull request.

[mayask]

Hi @tonygriv

Using

• props.styles.row
• props.styles.description
• props.styles. predefinedPlacesDescription
  is not enough for you?

I'm curious, what's your use case?

[antonsivogrivov]

I use

query={{
key: 'my_api_key',
language: config.LANG,
types: 'address',
}}

For example I would like to display only name of the street, but not the hole formatted_address

[mayask]

Ok, I just added a renderDescription prop for this.

https://github.com/FaridSafi/react-native-google-places-autocomplete/commit/1353de50215fb26cfed291ce41765ff0c07431c0

[mayask]

@tonygriv

rowData passed to it has the following structure:

{
  "description": "Times Square, New York, NY, United States",
  "id": "81e2bb1d8297281ef1da7fe4f3f3d17c06ef0421",
  "matched_substrings": [
    {
      "length": 5,
      "offset": 0
    }
  ],
  "place_id": "EilUaW1lcyBTcXVhcmUsIE5ldyBZb3JrLCBOWSwgVW5pdGVkIFN0YXRlcw",
  "reference": "CjQtAAAAn4_hv2vzZFmn7O8BhTI5WORL-1rV9tO5QwY4andzWPLIGplv21bh0XcDIlIqdqhaEhDCBL9TYX4_BredscSE24MSGhRPvrBEPUF_lcxJjCPspbVYOrm4Jw",
  "terms": [
    {
      "offset": 0,
      "value": "Times Square"
    },
    {
      "offset": 14,
      "value": "New York"
    },
    {
      "offset": 24,
      "value": "NY"
    },
    {
      "offset": 28,
      "value": "United States"
    }
  ],
  "types": [
    "route",
    "geocode"
  ]
}

[antonsivogrivov]

Thanks!

[mayask]

I'll let you know when it bones avail in the next version
Sincerely,
Maxim Yaskevich

On Sat, Oct 15, 2016 at 5:08 PM +0300, "Anton Sivogrivov" [email protected] wrote:

Thanks!

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[mayask]

Available in v1.2.5

[antonsivogrivov]

I didn't pay attention to the fact that renderDescription is called in the block :(
I need to format rows for example like this:

<View>
   <View>{street}</View>
   <View>{someOtherLocationData}</View>
</View>

Is it possible to make these improvements?

[mayask]

@tonygriv renderRow prop was exclusively added in v1.2.6

[antonsivogrivov]

Awesome! Thanks a lot :)

[brascene]

I'm using renderRow prop to modify list, but I'm not able to change the height of single list item. Any ideas?

Thanks!

[mayask]

Hi. Use props.styles.description prop

[brascene]

Isn't that prop for text style?
In renderRow I return View whose height I want to change, but it's not being applied.

[brascene]

Found it, this is the prop I've been looking for: "row" : { height: 50 }

[GerardCasadevall]

I need to format rows for example like this:

<View> <Icon type="MaterialIcons" name="location-on" style={[ Styles.smallIcons, { color: Theme.darkGrayColor } ]} /> <Text>{row.structured_formatting.main_text}</Text> <Text>{row.structured_formatting.secondary_text}</Text> </View>

Is it possible ?