CODEWITHSUNDEEP
react-native
Seva
Seva

Reputation: 685

ListItem lost its content after applying alignItems: 'center' to the parent view

I only applied alignItems: 'center' to the View, and lost all content of ListItems.

enter image description here

Any ideas how to fix? Thanks a lot.

Upvotes: 0

Views: 32

Answers (1)

Kishan Mundha
Kishan Mundha

Reputation: 3141

This is because we are setting alignment center of parent view. Don't set alignment center of parent view. Create another child view and set alignment center of that.

<View style={{ flex: 1 }}>
    <View style={{ alignItems: 'center' }}>
      {/*... QR code image */
    </View>
    <View>
      {/*... list view*/}
    </View>
</View>

Or you can also set alignSelf instance of alignItems

<View style={{ flex: 1 }}>
    <View style={{ alignSelf: 'center' }}>
      {/*... QR code image */
    </View>
    <View>
      {/*... list view*/}
    </View>
</View>

alignSelf set position for only that element. It will not reflect other element which is child of same parent.

Upvotes: 1

Related Questions