mirror of
https://github.com/FranP-code/create-better-t-stack.git
synced 2025-10-12 23:52:15 +00:00
add ai and todo example templates for native frontends (#293)
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user