ios app

argon-pro-react-native/screens/Pro.js

@@ -0,0 +1,172 @@
+/**
+ * 价值前沿 - 启动页
+ * 黑金主题设计
+ */
+
+import React from "react";
+import {
+  View,
+  Image,
+  StyleSheet,
+  StatusBar,
+  Dimensions,
+  Platform,
+  Pressable,
+} from "react-native";
+import { Box, VStack, HStack, Text, Center } from "native-base";
+import { LinearGradient } from "expo-linear-gradient";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+
+const { height, width } = Dimensions.get("screen");
+
+// 金色渐变
+const GOLD_GRADIENT = ['#D4AF37', '#F5D77A', '#D4AF37'];
+const GOLD_DARK = '#B8962E';
+const GOLD_LIGHT = '#F5D77A';
+const GOLD_PRIMARY = '#D4AF37';
+
+const Pro = ({ navigation }) => {
+  const insets = useSafeAreaInsets();
+
+  return (
+    <Box flex={1} bg="#000000">
+      <StatusBar barStyle="light-content" backgroundColor="#000000" />
+
+      {/* 背景装饰 */}
+      <Box position="absolute" top={0} left={0} right={0} bottom={0}>
+        {/* 顶部金色光晕 */}
+        <LinearGradient
+          colors={['rgba(212, 175, 55, 0.15)', 'rgba(212, 175, 55, 0.05)', 'transparent']}
+          start={{ x: 0.5, y: 0 }}
+          end={{ x: 0.5, y: 0.5 }}
+          style={StyleSheet.absoluteFill}
+        />
+        {/* 底部深色渐变 */}
+        <LinearGradient
+          colors={['transparent', 'rgba(0, 0, 0, 0.8)', '#000000']}
+          start={{ x: 0.5, y: 0.5 }}
+          end={{ x: 0.5, y: 1 }}
+          style={StyleSheet.absoluteFill}
+        />
+      </Box>
+
+      {/* 主内容 */}
+      <VStack flex={1} justifyContent="space-between" style={{ paddingTop: insets.top }}>
+        {/* 上部空间 */}
+        <Box flex={1} />
+
+        {/* Logo 区域 */}
+        <Center flex={2}>
+          <Box
+            bg="rgba(212, 175, 55, 0.08)"
+            borderWidth={1}
+            borderColor="rgba(212, 175, 55, 0.2)"
+            rounded="3xl"
+            p={6}
+            style={styles.logoContainer}
+          >
+            <Image
+              source={require("../assets/logo.jpg")}
+              style={styles.logo}
+              resizeMode="contain"
+            />
+          </Box>
+
+          {/* 品牌名称 */}
+          <VStack alignItems="center" mt={8} space={2}>
+            <Text
+              fontSize="4xl"
+              fontWeight="bold"
+              letterSpacing="xl"
+              style={styles.brandText}
+            >
+              价值前沿
+            </Text>
+            <Text
+              fontSize="md"
+              letterSpacing="lg"
+              color="rgba(212, 175, 55, 0.7)"
+            >
+              VALUE FRONTIER
+            </Text>
+          </VStack>
+        </Center>
+
+        {/* 特性描述 */}
+        <Center flex={1} px={8}>
+          <Text
+            fontSize="md"
+            color="rgba(255, 255, 255, 0.6)"
+            textAlign="center"
+            lineHeight="xl"
+          >
+            智能投资决策平台{"\n"}
+            发现市场热点，把握投资机会
+          </Text>
+        </Center>
+
+        {/* 底部按钮区域 */}
+        <VStack space={4} px={6} style={{ paddingBottom: insets.bottom + 30 }}>
+          {/* 开始使用按钮 */}
+          <Pressable onPress={() => navigation.navigate("App")}>
+            {({ isPressed }) => (
+              <LinearGradient
+                colors={isPressed ? [GOLD_DARK, GOLD_PRIMARY] : GOLD_GRADIENT}
+                start={{ x: 0, y: 0 }}
+                end={{ x: 1, y: 0 }}
+                style={[
+                  styles.primaryButton,
+                  { opacity: isPressed ? 0.9 : 1, transform: [{ scale: isPressed ? 0.98 : 1 }] }
+                ]}
+              >
+                <Text fontSize="lg" fontWeight="bold" color="#000000">
+                  开始使用
+                </Text>
+              </LinearGradient>
+            )}
+          </Pressable>
+
+          {/* 版本信息 */}
+          <Center>
+            <Text fontSize="xs" color="rgba(255, 255, 255, 0.3)">
+              Version 1.0.0
+            </Text>
+          </Center>
+        </VStack>
+      </VStack>
+    </Box>
+  );
+};
+
+const styles = StyleSheet.create({
+  logoContainer: {
+    shadowColor: '#D4AF37',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.3,
+    shadowRadius: 30,
+    elevation: 10,
+  },
+  logo: {
+    width: 160,
+    height: 160,
+  },
+  brandText: {
+    color: '#D4AF37',
+    textShadowColor: 'rgba(212, 175, 55, 0.5)',
+    textShadowOffset: { width: 0, height: 0 },
+    textShadowRadius: 20,
+  },
+  primaryButton: {
+    height: 56,
+    borderRadius: 16,
+    alignItems: 'center',
+    justifyContent: 'center',
+    shadowColor: '#D4AF37',
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.4,
+    shadowRadius: 12,
+    elevation: 8,
+  },
+});
+
+export default Pro;