summaryrefslogtreecommitdiff
path: root/app/(tabs)/index.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'app/(tabs)/index.tsx')
-rw-r--r--app/(tabs)/index.tsx70
1 files changed, 70 insertions, 0 deletions
diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx
new file mode 100644
index 0000000..324aeb7
--- /dev/null
+++ b/app/(tabs)/index.tsx
@@ -0,0 +1,70 @@
+import { Image, StyleSheet, Platform } from 'react-native';
+
+import { HelloWave } from '@/components/HelloWave';
+import ParallaxScrollView from '@/components/ParallaxScrollView';
+import { ThemedText } from '@/components/ThemedText';
+import { ThemedView } from '@/components/ThemedView';
+
+export default function HomeScreen() {
+ return (
+ <ParallaxScrollView
+ headerBackgroundColor={{ light: '#A1CEDC', dark: '#1D3D47' }}
+ headerImage={
+ <Image
+ source={require('@/assets/images/partial-react-logo.png')}
+ style={styles.reactLogo}
+ />
+ }>
+ <ThemedView style={styles.titleContainer}>
+ <ThemedText type="title">Welcome!</ThemedText>
+ <HelloWave />
+ </ThemedView>
+ <ThemedView style={styles.stepContainer}>
+ <ThemedText type="subtitle">Step 1: Try it</ThemedText>
+ <ThemedText>
+ Edit <ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> to see changes.
+ Press{' '}
+ <ThemedText type="defaultSemiBold">
+ {Platform.select({ ios: 'cmd + d', android: 'cmd + m' })}
+ </ThemedText>{' '}
+ to open developer tools.
+ </ThemedText>
+ </ThemedView>
+ <ThemedView style={styles.stepContainer}>
+ <ThemedText type="subtitle">Step 2: Explore</ThemedText>
+ <ThemedText>
+ Tap the Explore tab to learn more about what's included in this starter app.
+ </ThemedText>
+ </ThemedView>
+ <ThemedView style={styles.stepContainer}>
+ <ThemedText type="subtitle">Step 3: Get a fresh start</ThemedText>
+ <ThemedText>
+ When you're ready, run{' '}
+ <ThemedText type="defaultSemiBold">npm run reset-project</ThemedText> to get a fresh{' '}
+ <ThemedText type="defaultSemiBold">app</ThemedText> directory. This will move the current{' '}
+ <ThemedText type="defaultSemiBold">app</ThemedText> to{' '}
+ <ThemedText type="defaultSemiBold">app-example</ThemedText>.
+ </ThemedText>
+ </ThemedView>
+ </ParallaxScrollView>
+ );
+}
+
+const styles = StyleSheet.create({
+ titleContainer: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ gap: 8,
+ },
+ stepContainer: {
+ gap: 8,
+ marginBottom: 8,
+ },
+ reactLogo: {
+ height: 178,
+ width: 290,
+ bottom: 0,
+ left: 0,
+ position: 'absolute',
+ },
+});