Skip to content

Componente de separador ligero y reutilizable para React Native. Ideal para crear divisiones horizontales y verticales en tus aplicaciones móviles.

License

Notifications You must be signed in to change notification settings

urian121/react-native-separator-ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Native Separator

npm version GitHub Repo npm downloads

react-native-separator-ui es una librería moderna, intuitiva, liviana y flexible para crear separadores horizontales o verticales en aplicaciones React Native.

Ideal para crear divisiones horizontales y verticales en tus aplicaciones móviles, ayudándote a estructurar y organizar interfaces de forma limpia, profesional y reutilizable.

Ventajas principales

  • 🎨 Sencillo pero potente: Solo dos props para controlar todo
  • 📱 Responsive: Se adapta automáticamente al tamaño de la pantalla
  • 📦 Ligero: Sin dependencias adicionales
  • 🎯 Preciso: Control total sobre el tamaño en píxeles
  • 🔧 Flexibilidad: Horizontal y vertical con un solo componente

Instalación

Puedes instalar react-native-separator-ui usando npm o yarn:

npm install react-native-separator-ui
# o
yarn add react-native-separator-ui

Uso básico

Puedes usar react-native-separator-ui de la siguiente manera:

// Importar la librería
import Separator from 'react-native-separator-ui';

// Uso horizontal (por defecto)
<Separator height={1} />

// Uso vertical
<Separator height={16} orientation="vertical" />

Props

Propiedad Tipo Default Descripción
height number 1 Tamaño del separador en píxeles
orientation 'horizontal'
'vertical'
'horizontal' Dirección del separador

Ejemplos

// Separador horizontal simple
<Separator />

// Separador vertical más grueso
<Separator height={16} orientation="vertical" />

// En un layout completo
<View style={{ padding: 16 }}>
  <Text>Primero</Text>
  <Separator height={20} />
  <Text>Segundo</Text>

  <View style={{ flexDirection: 'row', marginTop: 20 }}>
    <Text>Columna A</Text>
    <Separator height={16} orientation="vertical" />
    <Text>Columna B</Text>
  </View>
</View>

🤝 Únete y Contribuye

Si encuentras algún problema o tienes una idea para mejorar el paquete, por favor abre un issue o envía un pull request en GitHub

👨‍💻 Desarrollador

Urian Viera
🌐 urianviera.com
📺 YouTube
💌 urian1213viera@gmail.com
¡Apóyame en PayPal!

Copyright

© 2025 Urian Viera. Todos los derechos reservados.

🛡 License

Distribuido bajo la licencia MIT

About

Componente de separador ligero y reutilizable para React Native. Ideal para crear divisiones horizontales y verticales en tus aplicaciones móviles.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published