Sometimes you can't rely on assumptions for default UI elements sizing -- in that case, being more explicit is what you need.
Here is a good example.
ListItem from 'react-native-elements' may produce the UX which looks like this:
Notice how Friends List element starts to grow dynamically. Funny, right?
So, to fix this issue, all I had to do is to add explicit height to ListItem style:
<ListItem style={{ height: 70, }}>
And after that is just works.
It was a bit scary at first to see the height of a component changing dynamically on its own. First I tried to see if there is height defined anywhere explicitly -- nope. Then I had a suspicion that it may something to do with:
import { Col, Row, Grid } from "react-native-easy-grid" This is another 3rd party components set I like to use a lot, and in this case I used it inside the ListItem. Removing it completely and replacing it with plain vanilla <View/> elements didn't help.
The only thing that worked is the explicit height prop on the ListItem. It was much easier to fix than I thought after all, but, this leaves me wonder about the overall quality of 3rd party software that is out there, if you can't rely on simple implicit sizing behaviour.