Содержание плоского списка не центрировано - PullRequest
Новая
       53

Содержание плоского списка не центрировано

0 голосов
/ 17 апреля 2020

Когда есть горизонтальный ScrollView с шириной 100% как ListHeaderComponent в плоском списке. Содержимое плоского списка больше не центрировано.

Все содержимое находится слева.

это ListHeaderComponent 

renderTags = () => {
  const { displayedTagList } = this.state
  return (
    <SwipeableRow 
      horizontal
      showsHorizontalScrollIndicator={false}
     >
       displayedTagList.map((tag) => {
         return(
           <HashtagView onPress={() => { this.clickTag(tag) }}>
             <HashtagText>{tag}</HashtagText>
           </HashtagView>
         )
       })
     </SwipeableRow>
    )
  }

со стилем 

const SwipeableRow = styled.ScrollView`
  width: ${wp('100%')};
  margin-vertical: ${hp('1%')};
  backgroundColor: blue;
`

и здесь flatList 

<FlatList
  data={displayData}
  renderItem={({ item }) => {
    <displayedItemsContainer></displayedItemsContainer>
  }
  ListHeaderComponent={this.renderTags}
  numColumns={2}
/>

и стиль отображаемых элементов 

const displayedItemsContainer = styled.View`
  margin-vertical: ${wp('1%')};
  margin-horizontal: ${wp('1.25%')};
`
...