I'm developing a mobile app with react-native-paper
, and I'm using List
in react-native-paper
.
I would like to show up whole message on the List
.
In default, List
omits the part of the message if the message is too long like the gif below.
https://gyazo.com/d60defc5f46b51408d68e793f9365172
I have already tried to change the parameters(head, middle, tail, and clip) of titleEllipsizeMode
.
However, these parameters didn't work as I expected.
This is my code.
<List.Section theme={{ colors: { primary: 'black' }}}>
<List.Accordion
title='Loooooooooooooooooooooooooooong title title title'
expanded={this.state.expanded}
onPress={this._handlePress}
>
<List.Item
title='Looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong title title title'
expanded={this.state.expanded}
titleEllipsizeMode='tail'
titleStyle={{ fontSize: 10 }}
/>
</List.Accordion>
</List.Section>
First of all the list title should not be too long as it's against the design guidelines. Normally if you need to have a subtext then it would move underneath it as in the picture below. Gmail-guidelines