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',
|
|||
|
},
|
|||
|
})
|