feat: 添加引导流程和个人信息收集功能
- 在应用中集成引导流程,用户首次启动时显示欢迎页面和个人信息收集页面 - 使用 AsyncStorage 存储用户的引导状态和个人信息 - 在个人页面中添加重置引导流程的功能 - 更新依赖项,添加 @react-native-async-storage/async-storage 库以支持数据存储 - 修改布局以支持新页面的导航和显示
This commit is contained in:
71
app/index.tsx
Normal file
71
app/index.tsx
Normal file
@@ -0,0 +1,71 @@
|
||||
import { ThemedView } from '@/components/ThemedView';
|
||||
import { useThemeColor } from '@/hooks/useThemeColor';
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||||
import { router } from 'expo-router';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { ActivityIndicator, Text, View } from 'react-native';
|
||||
|
||||
const ONBOARDING_COMPLETED_KEY = '@onboarding_completed';
|
||||
|
||||
export default function SplashScreen() {
|
||||
const backgroundColor = useThemeColor({}, 'background');
|
||||
const primaryColor = useThemeColor({}, 'primary');
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
checkOnboardingStatus();
|
||||
}, []);
|
||||
|
||||
const checkOnboardingStatus = async () => {
|
||||
try {
|
||||
const onboardingCompleted = await AsyncStorage.getItem(ONBOARDING_COMPLETED_KEY);
|
||||
|
||||
// 添加一个短暂的延迟以显示启动画面
|
||||
setTimeout(() => {
|
||||
if (onboardingCompleted === 'true') {
|
||||
router.replace('/(tabs)');
|
||||
} else {
|
||||
router.replace('/onboarding');
|
||||
}
|
||||
setIsLoading(false);
|
||||
}, 1000);
|
||||
} catch (error) {
|
||||
console.error('检查引导状态失败:', error);
|
||||
// 如果出现错误,默认显示引导页面
|
||||
setTimeout(() => {
|
||||
router.replace('/onboarding');
|
||||
setIsLoading(false);
|
||||
}, 1000);
|
||||
}
|
||||
};
|
||||
|
||||
if (!isLoading) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<ThemedView style={{
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor
|
||||
}}>
|
||||
<View style={{
|
||||
width: 80,
|
||||
height: 80,
|
||||
borderRadius: 40,
|
||||
backgroundColor: primaryColor,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
marginBottom: 20,
|
||||
}}>
|
||||
<Text style={{
|
||||
fontSize: 32,
|
||||
}}>
|
||||
🧘♀️
|
||||
</Text>
|
||||
</View>
|
||||
<ActivityIndicator size="large" color={primaryColor} />
|
||||
</ThemedView>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user