Untitled
unknown
plain_text
11 days ago
1.8 kB
1
Indexable
Never
import React from 'react'; import { View, Text, StyleSheet } from 'react-native'; const HomeScreen = () => { return ( <View style={styles.container}> <View style={styles.header}> <Text style={styles.title}>FunZone</Text> </View> <View style={styles.dashboard}> <View style={styles.buttonContainer}> <TouchableOpacity style={styles.button}> <Text style={styles.buttonText}>Games</Text> </TouchableOpacity> <TouchableOpacity style={styles.button}> <Text style={styles.buttonText}>Stories</Text> </TouchableOpacity> <TouchableOpacity style={styles.button}> <Text style={styles.buttonText}>Art Studio</Text> </TouchableOpacity> <TouchableOpacity style={styles.button}> <Text style={styles.buttonText}>Music Zone</Text> </TouchableOpacity> </View> </View> </View> ); }; const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#FFC107', }, header: { height: 100, backgroundColor: '#FF9800', justifyContent: 'center', alignItems: 'center', }, title: { fontSize: 24, color: '#FFFFFF', }, dashboard: { flex: 1, justifyContent: 'center', alignItems: 'center', }, buttonContainer: { flexDirection: 'row', flexWrap: 'wrap', justifyContent: 'space-around', }, button: { width: 100, height: 100, borderRadius: 10, backgroundColor: '#FFFFFF', justifyContent: 'center', alignItems: 'center', margin: 10, }, buttonText: { fontSize: 18, color: '#FF9800', }, }); export default HomeScreen;
Leave a Comment