expo-gradient-text
Version:
A beautiful and customizable gradient text component for React Native Expo applications
9 lines (8 loc) • 715 B
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { Text } from 'react-native';
import { LinearGradient } from 'expo-linear-gradient';
import MaskedView from '@react-native-masked-view/masked-view';
const GradientText = ({ children, colors = ['#FF6B6B', '#4ECDC4'], start = { x: 0, y: 0 }, end = { x: 1, y: 0 }, style = {}, ...textProps }) => {
return (_jsx(MaskedView, { maskElement: _jsx(Text, { style: [{ backgroundColor: 'transparent' }, style], ...textProps, children: children }), children: _jsx(LinearGradient, { colors: colors, start: start, end: end, style: style, children: _jsx(Text, { style: [style, { opacity: 0 }], ...textProps, children: children }) }) }));
};
export default GradientText;