2017-09-09 4 views
0

J'essaie d'aligner la vignette à la topLeft en utilisant justifyContent: 'flex-start'. Mais ça ne marche pas. Voici mon code.JustifyContent ne fonctionne pas dans la liste dans NativeBase

<Content> 
<View key = {index} style={styles.commentBody}> 
    <List> 
    <ListItem avatar> 
     <View style={{ justifyContent: 'flex-start'}}> 
     <Left> 
      <Thumbnail 
      source={post.Thumbnail} 
      /> 
     </Left> 
    </View> 

    <Body> 
     <Text>{post.body}</Text> 
    </Body> 

    <Right> 
     <Text note>3:43 pm</Text> 
    </Right> 

    </ListItem> 

</List> 
</View> 

J'ai essayé d'ajouter le justifyContent: 'flex-start' à la Miniature style aussi, mais pas de chance.

Comment faire apparaître la vignette en haut à gauche et non au centre?

Merci.

Répondre

1

Généralement, par défaut, tous les composants commencent par flexDirection: row, justifyContent: flex-start et alignItems: flex-start. Si vous essayez de configurer Flex-Start, il y a peut-être un problème avec votre structure. Essayez d'ajouter une bordure avec des couleurs différentes à vos composants pour comprendre la zone qu'ils ont dans votre écran (largeur, marge, marge, etc.). Identifiez si le composant que vous souhaitez aligner doit être aligné sur la zone. Vérifiez si le parent a ou manque un style qui vous empêche d'aligner le composant. Gardez à l'esprit d'ajouter flex: 1 aux composants que vous souhaitez aligner. Jetez également un coup d'œil aux documents sur l'utilisation de alignItems et justifyContents https://facebook.github.io/react-native/docs/flexbox.html

Espérons que ça aide.