From d3d11c9d4823066ff24bd61dfc9f8416a0faabfe Mon Sep 17 00:00:00 2001 From: richarjiang Date: Mon, 11 Aug 2025 10:12:35 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E9=87=8D=E6=9E=84=E9=A1=B9=E7=9B=AE?= =?UTF-8?q?=E5=B9=B6=E6=B7=BB=E5=8A=A0=E6=96=B0=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重命名项目为 Digital Pilates - 更新 bundleIdentifier 为 digital-pilates - 重新设计底部导航栏，增加选中状态和标签 - 添加 CLAUDE.md 文件，提供代码助手指导 - 删除 README.md 文件中的冗余信息 --- CLAUDE.md | 19 ++++++ README.md | 50 --------------- app.json | 4 +- app/(tabs)/_layout.tsx | 136 +++++++++++++++++++++++++++++++++++------ 4 files changed, 137 insertions(+), 72 deletions(-) create mode 100644 CLAUDE.md delete mode 100644 README.md diff --git a/CLAUDE.md b/CLAUDE.md new file mode 100644 index 0000000..796f028 --- /dev/null +++ b/CLAUDE.md @@ -0,0 +1,19 @@ +# CLAUDE.md + +This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. + +## Commands +- **Start development server**: `npm start` +- **Run on Android**: `npm run android` +- **Run on iOS**: `npm run ios` +- **Run on Web**: `npm run web` +- **Lint**: `npm run lint` +- **Reset project**: `npm run reset-project` + +## Architecture +- **Framework**: React Native (Expo) with TypeScript. +- **Navigation**: Expo Router for file-based routing (`app/` directory). +- **UI**: Themed components (`ThemedText`, `ThemedView`) and reusable UI elements (`Collapsible`, `ParallaxScrollView`). +- **Platform-Specific**: Android (`android/`) and iOS (`ios/`) configurations with native modules. +- **Hooks**: Custom hooks for color scheme (`useColorScheme`) and theme management (`useThemeColor`). +- **Dependencies**: React Navigation for tab-based navigation, Expo modules for native features (haptics, blur, etc.). \ No newline at end of file diff --git a/README.md b/README.md deleted file mode 100644 index 48dd63f..0000000 --- a/README.md +++ /dev/null @@ -1,50 +0,0 @@ -# Welcome to your Expo app 👋 - -This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app). - -## Get started - -1. Install dependencies - - ```bash - npm install - ``` - -2. Start the app - - ```bash - npx expo start - ``` - -In the output, you'll find options to open the app in a - -- [development build](https://docs.expo.dev/develop/development-builds/introduction/) -- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/) -- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/) -- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo - -You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction). - -## Get a fresh project - -When you're ready, run: - -```bash -npm run reset-project -``` - -This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing. - -## Learn more - -To learn more about developing your project with Expo, look at the following resources: - -- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides). -- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web. - -## Join the community - -Join our community of developers creating universal apps. - -- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute. -- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions. diff --git a/app.json b/app.json index e5f26c6..55b1334 100644 --- a/app.json +++ b/app.json @@ -10,7 +10,7 @@ "newArchEnabled": true, "ios": { "supportsTablet": true, - "bundleIdentifier": "com.anonymous.digitalpilates" + "bundleIdentifier": "digital-pilates" }, "android": { "adaptiveIcon": { @@ -41,4 +41,4 @@ "typedRoutes": true } } -} +} \ No newline at end of file diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx index cfbc1e2..1e1ebf8 100644 --- a/app/(tabs)/_layout.tsx +++ b/app/(tabs)/_layout.tsx @@ -1,43 +1,139 @@ -import { Tabs } from 'expo-router'; +import * as Haptics from 'expo-haptics'; +import { Tabs, usePathname } from 'expo-router'; import React from 'react'; -import { Platform } from 'react-native'; +import { Text, TouchableOpacity, View } from 'react-native'; -import { HapticTab } from '@/components/HapticTab'; import { IconSymbol } from '@/components/ui/IconSymbol'; -import TabBarBackground from '@/components/ui/TabBarBackground'; -import { Colors } from '@/constants/Colors'; -import { useColorScheme } from '@/hooks/useColorScheme'; export default function TabLayout() { - const colorScheme = useColorScheme(); + const pathname = usePathname(); return ( { + const routeName = route.name; + const isSelected = (routeName === 'index' && pathname === '/') || + (routeName === 'explore' && pathname === '/explore') || + pathname.includes(routeName); + + return { + tabBarActiveTintColor: '#192126', + tabBarButton: (props) => { + const { children, onPress } = props; + + const handlePress = (event: any) => { + if (process.env.EXPO_OS === 'ios') { + Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light); + } + onPress && onPress(event); + }; + + return ( + + {children} + + ); }, - default: {}, - }), + tabBarStyle: { + position: 'absolute', + bottom: 20, + height: 68, + borderRadius: 34, + backgroundColor: '#192126', + shadowColor: '#000', + shadowOffset: { width: 0, height: 2 }, + shadowOpacity: 0.2, + shadowRadius: 10, + elevation: 5, + paddingHorizontal: 10, + paddingTop: 0, + paddingBottom: 0, + marginHorizontal: 20, + width: '90%', + alignSelf: 'center', + }, + tabBarItemStyle: { + backgroundColor: 'transparent', + height: 68, + marginTop: 0, + marginBottom: 0, + paddingTop: 0, + paddingBottom: 0, + }, + tabBarShowLabel: false, + }; }}> , + tabBarIcon: ({ color }) => { + const isHomeSelected = pathname === '/' || pathname === '/index'; + return ( + + + {isHomeSelected && ( + + Home + + )} + + ); + }, }} /> , + tabBarIcon: ({ color }) => { + const isExploreSelected = pathname === '/explore'; + return ( + + + {isExploreSelected && ( + + Explore + + )} + + ); + }, }} />