Traté de hacer un ícono de insignia con texto rojo, pero todos los estilos que apliqué al texto no funcionaron en absoluto.

IconoConBade.js

 import React from 'react'; import {StyleSheet, Text, View} from 'react-native'; import MatComIcon from 'react-native-vector-icons/MaterialCommunityIcons'; export const IconWithBadge = props => { const {text, iconName} = props; return ( <View> <MatComIcon name={iconName ?? 'cart-variant'} size={22} color="grey" /> {text && ( <View style={styles.badgeStyle}> <Text styles={styles.BadgeTxt}>12</Text> </View> )} </View> ); }; const styles = StyleSheet.create({ badgeStyle: { position: 'absolute', right: -5, top: -5, }, BadgeTxt: {color: 'red', fontWeight: 'bold'}, });

Este es mi Header.js

todo en el estilo de texto no funciona