81 lines
2.4 KiB
TypeScript
81 lines
2.4 KiB
TypeScript
import {Button, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
|
||
import { Asset } from 'expo-asset';
|
||
import { Image } from 'expo-image';
|
||
import {router} from "expo-router";
|
||
|
||
export default function Page() {
|
||
const wb = require('../../assets/images/welcome_image.png');
|
||
return (
|
||
<View style={styles.container}>
|
||
<Image source={wb} style={styles.Image} />
|
||
<View style={styles.textContainer}>
|
||
<Text style={styles.textTitle}>欢迎来到龙盾云御</Text>
|
||
<Text style={styles.text}>今天是新的一天。这是你的一天。你塑造它，登录以开始管理你的项目。</Text>
|
||
</View>
|
||
<TouchableOpacity style={styles.loginButton} onPress={()=>{
|
||
router.push("/(login)/login")
|
||
}}>
|
||
<Text style={styles.loginButtonText}>登录</Text>
|
||
</TouchableOpacity>
|
||
</View>
|
||
)
|
||
}
|
||
const styles = StyleSheet.create({
|
||
container: {
|
||
paddingVertical:80,
|
||
paddingHorizontal:50,
|
||
flex: 1,
|
||
alignItems: 'center',
|
||
justifyContent: 'center',
|
||
display:'flex',
|
||
flexDirection:'column',
|
||
|
||
},
|
||
Image:{
|
||
flex:1,
|
||
flexBasis:6,
|
||
width:'100%',
|
||
resizeMode:'cover',
|
||
maxHeight:'50%'
|
||
},
|
||
textContainer:{
|
||
flex:1,
|
||
flexBasis:4,
|
||
display:'flex',
|
||
flexDirection:'column',
|
||
justifyContent:'center',
|
||
gap:25,
|
||
alignItems:'center',
|
||
width:'100%',
|
||
},
|
||
textTitle:{
|
||
color:'#1F41BB',
|
||
fontSize:35,
|
||
fontWeight:'800',
|
||
textAlign:'center'
|
||
},
|
||
text:{
|
||
color:'#000',
|
||
textAlign:'center',
|
||
fontSize:16,
|
||
fontWeight:'500',
|
||
},
|
||
loginButton: {
|
||
backgroundColor: '#1F41BB',
|
||
width: '100%',
|
||
padding: 15, // 添加一些内边距
|
||
borderRadius: 5, // 可选，添加圆角
|
||
alignItems: 'center', // 水平居中
|
||
marginTop: 50, // 可选，添加一些顶部外边距
|
||
shadowOffset: { width: 0, height: 10 }, // 水平偏移和垂直偏移
|
||
shadowOpacity: 0.5, // 阴影透明度
|
||
shadowRadius: 10, // 阴影半径
|
||
elevation: 5, // Android特有的阴影效果，iOS使用shadowRadius
|
||
shadowColor: '#CBD6FF', // 阴影颜色
|
||
},
|
||
loginButtonText: {
|
||
color: '#FFFFFF',
|
||
fontSize: 18,
|
||
fontWeight: 'bold',
|
||
},
|
||
}) |