Comment utiliser zIndex dans react-native
J'ai envie d'atteindre les objectifs suivants:
Les images ci-dessous sont ce que je peux faire maintenant, mais ce n'est PAS ce que je veux.
Exemple de code que j'ai droit:
renderA() {
return (
<View style={ position: 'absolute', zIndex: 0 }> //parent of A
<View style={ zIndex: 2 }> //element A
</View>
<View style={ zIndex: 2 }> //element A
</View>
</View>
);
}
renderB() {
return (
<View style={ position: 'absolute', zIndex: 1 }> //element B
</View>
);
}
render() {
return (
<View>
{this.renderA()}
{this.renderB()}
</View>
);
}
Mettre en mots, je veux
- Parent: à être en dessous de tout.
- Élément B: être au-dessus de tout parent d'Un, mais au-dessous de l'élément de A.
- Élément A: au-dessus de tout.
Noter que Parent d'Un et Élément B les deux doivent être absolument positionné, et les deux éléments A et des éléments de B doivent être cliquable...!
source d'informationauteur SudoPlz
Vous devez vous connecter pour publier un commentaire.
Je crois qu'il y a différentes façons de le faire en se fondant sur ce que vous avez besoin exactement, mais d'une façon serait de simplement mettre les deux Éléments A et B à l'intérieur de Parent A.
J'ai enfin résolu ce problème en créant un second objet qui imite B.
Mon schéma ressemble maintenant à ceci:
J'ai maintenant B1 (à l'intérieur d'Un parent d') et B2 à l'extérieur de l'il.
B1 et B2 sont juste à côté l'un de l'autre, de sorte à l'œil nu, il semble que si c'est juste 1 objet.
Mise à JOUR: Apparemment,
zIndex
a été ajouté à lareact-native
de la bibliothèque. J'ai essayé de le faire fonctionner sans succès. Vérifier ici pour les détails de la correction.