react-native-matrix-text
v1.0.3
Published
Componente animado de lluvia digital estilo Matrix compatible con Expo y React Native Web
Maintainers
Readme
🚀 Características
- ⚛️ Compatibilidad Total: Funciona perfectamente en proyectos con Expo y React Native CLI.
- ⚡ Alto Rendimiento: Animaciones optimizadas nativamente para evitar caídas de frames.
- 🎨 Altamente Personalizable: Controla el color, la velocidad, el tamaño y la fuente del texto de forma independiente.
- 📦 Ligero: Cero dependencias pesadas para mantener tu bundle limpio.
📦 Instalación
Puedes instalar este paquete utilizando tu gestor de paquetes favorito:
# Con npm
npm install react-native-matrix-text
# Con yarn
yarn add react-native-matrix-text
# Con pnpm
pnpm add react-native-matrix-text💻 Uso Básico
Importa el componente en tu archivo y envuélvelo en un contenedor (preferiblemente con fondo oscuro para resaltar el efecto):
import React from 'react';
import { View, StyleSheet, StatusBar } from 'react-native';
import MatrixText from 'react-native-matrix-text';
export default function App() {
return (
<View style={styles.container}>
<StatusBar barStyle="light-content" backgroundColor="#000000" />
<MatrixText
text="SISTEMA INICIADO..."
color="#00FF00"
speed={45}
fontSize={18}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#000000',
justifyContent: 'center',
alignItems: 'center',
padding: 20,
},
});