Comment utiliser le rayon de bordure uniquement pour 1 angle (react-native)?

Question

Comment utiliser le rayon de bordure dans React Natif seulement pour un coin?

J'ai une fenêtre modale

Comme vous pouvez voir que les coins inférieurs ne sont pas arrondis, cela se produit lorsque j'ai utilisé backgroundColor pour les boutons. J'essayais de définir le débordement masqué sur wrapper modal et cela ne m'a pas aidé. Maintenant, je veux utiliser le rayon de bordure pour les boutons (seulement pour un coin).

Mon code http://jsbin.com/sexeputuqe/edit?html,css

Answer 1

Avez-vous déjà essayé avec le suivant?
- borderBottomLeftRadius: nombre
- borderBottomRightRadius: nombre
- borderTopLeftRadius: nombre
- borderTopRightRadius: nombre

En outre, vous pouvez trouver plus d’informations dans la documentation de la vue .

Answer 2

• borderBottomLeftRadius: nombre
• borderBottomRightRadius: numéro
• borderTopLeftRadius: nombre
• borderTopRightRadius: numéro

Cela a fonctionné pour moi.

Merci

Answer 3

Supposons que seul le rayon soit défini pour les coins supérieur gauche et inférieur gauche de la balise Image.

<View style={styles.imgBox}>
  <Image source={{ uri: 'your image url' }} style={styles.img} />
</View>

 const styles = EStyleSheet.create({
 imgBox: {
       width: px(72),
       height: px(72),
       borderBottomLeftRadius: 2,
       borderTopLeftRadius: 2,
       overflow: 'hidden',
 },
 img: {
       width: px(72),
       height: px(72),
  },
})

semble bon pour iOS.