From 3d79e24ffb70b597dd07560394d9d9b379e68976 Mon Sep 17 00:00:00 2001 From: gibbyb Date: Tue, 8 Oct 2024 16:58:50 -0500 Subject: [PATCH] We are on Build a screen --- .gitignore | 6 ++ app/(tabs)/_layout.tsx | 34 ++++--- app/(tabs)/index.tsx | 78 +++++----------- app/(tabs)/settings.tsx | 25 ++++++ app/+not-found.tsx | 32 +++---- app/_layout.tsx | 37 ++------ assets/images/adaptive-icon.png | Bin 17547 -> 4202669 bytes assets/images/favicon.png | Bin 1466 -> 8911 bytes assets/images/icon.png | Bin 22380 -> 4202669 bytes assets/images/splash.png | Bin 47346 -> 2674033 bytes components/HelloWave.tsx | 37 -------- components/buttons/Button.tsx | 85 ++++++++++++++++++ components/{ => default}/Collapsible.tsx | 0 components/{ => default}/ExternalLink.tsx | 0 .../{ => default}/ParallaxScrollView.tsx | 0 .../{ => default}/navigation/TabBarIcon.tsx | 0 constants/Colors.ts | 2 +- example/app/(tabs)/_layout.tsx | 37 ++++++++ {app => example/app}/(tabs)/explore.tsx | 0 example/app/(tabs)/index.tsx | 70 +++++++++++++++ {app => example/app}/+html.tsx | 0 example/app/+not-found.tsx | 32 +++++++ example/app/_layout.tsx | 37 ++++++++ example/assets/fonts/SpaceMono-Regular.ttf | Bin 0 -> 93252 bytes example/assets/images/adaptive-icon.png | Bin 0 -> 17547 bytes example/assets/images/favicon.png | Bin 0 -> 1466 bytes example/assets/images/icon.png | Bin 0 -> 22380 bytes .../assets}/images/partial-react-logo.png | Bin .../assets}/images/react-logo.png | Bin .../assets}/images/react-logo@2x.png | Bin .../assets}/images/react-logo@3x.png | Bin example/assets/images/splash.png | Bin 0 -> 47346 bytes example/components/Collapsible.tsx | 41 +++++++++ example/components/ExternalLink.tsx | 24 +++++ example/components/ParallaxScrollView.tsx | 76 ++++++++++++++++ example/components/ThemedText.tsx | 60 +++++++++++++ example/components/ThemedView.tsx | 14 +++ .../components}/__tests__/ThemedText-test.tsx | 0 .../__snapshots__/ThemedText-test.tsx.snap | 0 example/components/navigation/TabBarIcon.tsx | 9 ++ example/constants/Colors.ts | 26 ++++++ example/hooks/useColorScheme.ts | 1 + example/hooks/useColorScheme.web.ts | 8 ++ example/hooks/useThemeColor.ts | 22 +++++ {scripts => example/scripts}/reset-project.js | 0 package-lock.json | 10 +++ package.json | 3 +- 47 files changed, 649 insertions(+), 157 deletions(-) create mode 100644 app/(tabs)/settings.tsx delete mode 100644 components/HelloWave.tsx create mode 100644 components/buttons/Button.tsx rename components/{ => default}/Collapsible.tsx (100%) rename components/{ => default}/ExternalLink.tsx (100%) rename components/{ => default}/ParallaxScrollView.tsx (100%) rename components/{ => default}/navigation/TabBarIcon.tsx (100%) create mode 100644 example/app/(tabs)/_layout.tsx rename {app => example/app}/(tabs)/explore.tsx (100%) create mode 100644 example/app/(tabs)/index.tsx rename {app => example/app}/+html.tsx (100%) create mode 100644 example/app/+not-found.tsx create mode 100644 example/app/_layout.tsx create mode 100755 example/assets/fonts/SpaceMono-Regular.ttf create mode 100644 example/assets/images/adaptive-icon.png create mode 100644 example/assets/images/favicon.png create mode 100644 example/assets/images/icon.png rename {assets => example/assets}/images/partial-react-logo.png (100%) rename {assets => example/assets}/images/react-logo.png (100%) rename {assets => example/assets}/images/react-logo@2x.png (100%) rename {assets => example/assets}/images/react-logo@3x.png (100%) create mode 100644 example/assets/images/splash.png create mode 100644 example/components/Collapsible.tsx create mode 100644 example/components/ExternalLink.tsx create mode 100644 example/components/ParallaxScrollView.tsx create mode 100644 example/components/ThemedText.tsx create mode 100644 example/components/ThemedView.tsx rename {components => example/components}/__tests__/ThemedText-test.tsx (100%) rename {components => example/components}/__tests__/__snapshots__/ThemedText-test.tsx.snap (100%) create mode 100644 example/components/navigation/TabBarIcon.tsx create mode 100644 example/constants/Colors.ts create mode 100644 example/hooks/useColorScheme.ts create mode 100644 example/hooks/useColorScheme.web.ts create mode 100644 example/hooks/useThemeColor.ts rename {scripts => example/scripts}/reset-project.js (100%) diff --git a/.gitignore b/.gitignore index ec8a36a..6623142 100644 --- a/.gitignore +++ b/.gitignore @@ -12,3 +12,9 @@ web-build/ # macOS .DS_Store + +# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb +# The following patterns were generated by expo-cli + +expo-env.d.ts +# @end expo-cli \ No newline at end of file diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx index 22a49b6..0edcba2 100644 --- a/app/(tabs)/_layout.tsx +++ b/app/(tabs)/_layout.tsx @@ -1,21 +1,28 @@ -import { Tabs } from 'expo-router'; -import React from 'react'; - -import { TabBarIcon } from '@/components/navigation/TabBarIcon'; +import { Tabs } from "expo-router"; +import { TabBarIcon } from '@/components/default/navigation/TabBarIcon'; import { Colors } from '@/constants/Colors'; import { useColorScheme } from '@/hooks/useColorScheme'; -export default function TabLayout() { - const colorScheme = useColorScheme(); +const TabLayout = () => { + const scheme = useColorScheme() ?? 'light'; return ( + headerStyle: { + backgroundColor: Colors[scheme].background, + }, + headerShadowVisible: false, + headerTintColor: Colors[scheme].tint, + tabBarStyle: { + backgroundColor: Colors[scheme].background, + }, + }} + > ( @@ -24,14 +31,15 @@ export default function TabLayout() { }} /> ( - + ), }} /> ); -} +}; +export default TabLayout; diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx index 324aeb7..4662e77 100644 --- a/app/(tabs)/index.tsx +++ b/app/(tabs)/index.tsx @@ -1,70 +1,34 @@ -import { Image, StyleSheet, Platform } from 'react-native'; +import { StyleSheet } from "react-native"; +import { ThemedText } from "@/components/ThemedText"; +import { ThemedView } from "@/components/ThemedView"; -import { HelloWave } from '@/components/HelloWave'; -import ParallaxScrollView from '@/components/ParallaxScrollView'; -import { ThemedText } from '@/components/ThemedText'; -import { ThemedView } from '@/components/ThemedView'; +import Button from "@/components/buttons/Button"; -export default function HomeScreen() { +const Index = () => { return ( - - }> - - Welcome! - + + + Home Screen + + +