React-native-paper: List.Section and List.Item margins

Created on 17 May 2020  路  4Comments  路  Source: callstack/react-native-paper

Is it possible to get rid of the margins when using List.Section / List.Item?
see example image:
image

I'd like to control the margin between items...
I was trying different approaches with margin/padding but it didn't work for me.

<List.Section style={{ margin: 0, padding: 0 }}>
      <List.Item style={{ margin: 0, padding: 0 }}>
question

Most helpful comment

@Trancever are you sure?
according to MD Lists specs
there should be a divider, for sure, and list items should not have such margins between them

I agree. The margins are massive (and moreso that it isn't editable). I think I can see the margins from outer space

All 4 comments

This is not possible. We use the same margins/paddings as MD Guidelines recommend.

@Trancever are you sure?
according to MD Lists specs
there should be a divider, for sure, and list items should not have such margins between them

@Trancever are you sure?
according to MD Lists specs
there should be a divider, for sure, and list items should not have such margins between them

I agree. The margins are massive (and moreso that it isn't editable). I think I can see the margins from outer space

Workaround for this arbitrary restriction is to wrap it with a <View> and give it negative marginVertical values

Was this page helpful?
0 / 5 - 0 ratings

Related issues

timothystewart6 picture timothystewart6  路  4Comments

talaikis picture talaikis  路  3Comments

sm2017 picture sm2017  路  4Comments

ZhengYuTay picture ZhengYuTay  路  3Comments

zachariahtimothy picture zachariahtimothy  路  3Comments