npx expo install expo-linear-gradient
vagy:
yarn add react-native-linear-gradient
vagy:
npm install react-native-linear-gradient
import LinearGradient from 'react-native-linear-gradient'; <LinearGradient colors={['#4c669f', '#3b5998', '#192f6a']} style={styles.linearGradient}> <Text style={styles.buttonText}> Belépés </Text> </LinearGradient> var styles = StyleSheet.create({ linearGradient: { flex: 1, paddingLeft: 15, paddingRight: 15, borderRadius: 5 }, buttonText: { fontSize: 18, fontFamily: 'Gill Sans', textAlign: 'center', margin: 10, color: '#ffffff', backgroundColor: 'transparent', }, });
import { LinearGradient } from 'expo-linear-gradient'; import { StatusBar } from 'expo-status-bar'; import { ImageBackground, StyleSheet, Text, View } from 'react-native'; export default function App() { return ( <View style={styles.container}> <LinearGradient // Background Linear Gradient colors={['#ff8a00', '#e52d27']} style={styles.background} /> <StatusBar style="auto" /> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center', }, background: { position: 'absolute', left: 0, right: 0, top: 0, height: '100%', }, });