add ai and todo example templates for native frontends (#293)

This commit is contained in:
Aman Varshney
2025-06-02 16:30:53 +05:30
committed by GitHub
parent 9dbeea8983
commit 7851d0636d
42 changed files with 1606 additions and 536 deletions

View File

@@ -1,27 +1,44 @@
import { TabBarIcon } from "@/components/tabbar-icon";
import { useColorScheme } from "@/lib/use-color-scheme";
import { Tabs } from "expo-router";
import { TabBarIcon } from "@/components/tabbar-icon";
export default function TabLayout() {
const { isDarkColorScheme } = useColorScheme();
return (
<Tabs
screenOptions={{
headerShown: false,
tabBarActiveTintColor: "black",
tabBarActiveTintColor: isDarkColorScheme
? "hsl(217.2 91.2% 59.8%)"
: "hsl(221.2 83.2% 53.3%)",
tabBarInactiveTintColor: isDarkColorScheme
? "hsl(215 20.2% 65.1%)"
: "hsl(215.4 16.3% 46.9%)",
tabBarStyle: {
backgroundColor: isDarkColorScheme
? "hsl(222.2 84% 4.9%)"
: "hsl(0 0% 100%)",
borderTopColor: isDarkColorScheme
? "hsl(217.2 32.6% 17.5%)"
: "hsl(214.3 31.8% 91.4%)",
},
}}
>
<Tabs.Screen
name="index"
options={{
title: "Tab One",
tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
title: "Home",
tabBarIcon: ({ color }) => <TabBarIcon name="home" color={color} />,
}}
/>
<Tabs.Screen
name="two"
options={{
title: "Tab Two",
tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
title: "Explore",
tabBarIcon: ({ color }) => (
<TabBarIcon name="compass" color={color} />
),
}}
/>
</Tabs>

View File

@@ -1,17 +1,19 @@
import { Container } from "@/components/container";
import { Text, View } from "react-native";
import { ScrollView, Text, View } from "react-native";
export default function TabOne() {
return (
<Container>
<View className="p-6 flex-1 justify-center">
<Text className="text-2xl font-bold text-foreground text-center mb-4">
Tab One
</Text>
<Text className="text-foreground text-center">
This is the first tab of the application.
</Text>
</View>
</Container>
);
return (
<Container>
<ScrollView className="flex-1 p-6">
<View className="py-8">
<Text className="text-3xl font-bold text-foreground mb-2">
Tab One
</Text>
<Text className="text-lg text-muted-foreground">
Explore the first section of your app
</Text>
</View>
</ScrollView>
</Container>
);
}

View File

@@ -1,17 +1,19 @@
import { Container } from "@/components/container";
import { Text, View } from "react-native";
import { ScrollView, Text, View } from "react-native";
export default function TabTwo() {
return (
<Container>
<View className="p-6 flex-1 justify-center">
<Text className="text-2xl font-bold text-foreground text-center mb-4">
Tab Two
</Text>
<Text className="text-foreground text-center">
This is the second tab of the application.
</Text>
</View>
</Container>
);
return (
<Container>
<ScrollView className="flex-1 p-6">
<View className="py-8">
<Text className="text-3xl font-bold text-foreground mb-2">
Tab Two
</Text>
<Text className="text-lg text-muted-foreground">
Discover more features and content
</Text>
</View>
</ScrollView>
</Container>
);
}