add app/pages/Launch.js

Strides-SPAPP/app/pages/Launch.js

@@ -0,0 +1,107 @@
+/**
+ * 开屏页面
+ * @邠心vbe on 2021/03/22
+ */
+import React from 'react'
+import { Animated, Easing, Image, StyleSheet, View } from 'react-native'
+import {InitSomething} from '../components/Dialog';
+import MyStatusBar from '../components/MyStatusBar';
+import { PageList } from './Router';
+
+class Launch extends React.Component {
+  
+  constructor(props) {
+    super(props);
+    this.state = {
+      isShow: true,
+      opacity: new Animated.Value(0)
+    };
+  }
+
+  componentDidMount() {
+    this.init();
+    //MyStatusBar.setStatusBarThemes(MyStatusBar.DARK_STYLE, colorLight);
+    InitSomething();
+    if (isIOS) {
+      this.goHome(100);
+    } else {
+      this.goHome(2500);
+    }
+  }
+
+  init() {
+    Animated.timing(this.state.opacity, {
+      toValue: 1,
+      duration: 1500,
+      easing: Easing.linear,
+      useNativeDriver: true
+    }).start(() => {
+      
+    });
+  }
+
+  goHome(time) {
+    setTimeout(() => {
+      this.setState({
+        isShow: false
+      }, () => {
+        // 确保状态更新完成后再导航
+        startPage(PageList.home);
+      });
+    }, time);
+  }
+  
+  render() {
+    return (
+      this.state.isShow
+      ? isIOS
+        ? <View style={styles.iosContent}></View>
+        : <View style={styles.container}>
+            <Animated.View style={[styles.content, {opacity: this.state.opacity}]}>
+              <Image
+                style={styles.logo}
+                resizeMode='contain'
+                source={require('../images/app-logo.png')}/>
+              {/* <Text style={styles.slogan}>Feel The Green Energy</Text> */}
+            </Animated.View>
+          </View>
+      : <View style={styles.loaded}></View>
+    );
+  }
+}
+
+export default Launch
+
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    backgroundColor: colorLight,
+    ...StyleSheet.absoluteFillObject
+  },
+  iosContent: {
+    flex: 1,
+    backgroundColor: colorLight
+  },
+  loaded: {
+    flex: 1,
+    backgroundColor: '#eee'
+  },
+  content: {
+    alignItems: 'center',
+    paddingTop: $vh(30)
+  },
+  logo: {
+    width: 240,
+    height: 120,
+    marginLeft: 0,
+    //top: $vh(25),
+    //bottom: $vh(25),
+    //position: 'absolute'
+  },
+  slogan: {
+    color: textPrimary,
+    fontSize: 14,
+    fontStyle: 'italic',
+    fontWeight: 'bold'
+  }
+});