Vue enfant qui quitte la vue parent dans réagit natif - réagit natif

J'ai un parent <View> type et un enfant <Text> type. Si la valeur du texte est grande, le texte sort de la vue du conteneur. Une idée de comment le contenir? P.S. Je ne veux pas que le texte soit coupé et suivi de "...", car j'ai besoin de lui ajouter une animation et de le faire défiler de nouveau dans la vue.

Réponses:

Pour résoudre ce problème, je suggère d'utiliser flex. Voici un exemple simple:

<View style={{
flex:1,
flexWrap:"wrap",
flexDirection:"row",
justifyContent:"center",
alignItems:"center",
marginTop:50}}>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
<Text>Something</Text>
</View>

La clé ici est la flex:1 et le flexWrap:"wrap", qui indique à la vue d'utiliser tous lesl'espace disponible et enrouler ses enfants autour de lui. Si vous ne parvenez toujours pas à le faire fonctionner, essayez de lui donner un style "alignItems" comme je l'ai fait dans l'exemple ci-dessus.

Avec ce code, vous pouvez créer quelque chose comme ceci:

Capture d'écran du code ci-dessus