Saltar al contenido

React Native – ios – círculo con borde – color de fondo del círculo saliendo del círculo

Solución:

Puede agregar un color de borde diferente a un círculo. prueba esto

container: {
  width: 60,
  height: 60,
  borderRadius: 60 / 2,
  backgroundColor: 'red',
  borderColor: 'black',
  borderWidth: 3
}

ingrese la descripción de la imagen aquí

Esto parece un error en React Native. Puede solucionarlo utilizando 2 círculos:

class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.outerCircle}>
      	  <View style={styles.innerCircle} />
      	</View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'white',
  },
  outerCircle: {
    borderRadius: 40,
    width: 80,
    height: 80,
    backgroundColor: 'white',
  },
  innerCircle: {
    borderRadius: 35,
    width: 70,
    height: 70,
    margin: 5,
    backgroundColor: 'black'
  },
});

Intente configurar accesorios de estilo como

{
overflow: 'hidden'
} 

con tu estilo en View style.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *