Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import { View, Text, ImageBackground, StyleSheet, Alert } from 'react-native';
- import bg from './../../assets/imgs/bg.png';
- import { Input } from "@rneui/themed";
- import { Button } from '@rneui/base';
- export interface LoginScreenProps {
- }
- export function LoginScreen(props: LoginScreenProps) {
- return (
- <ImageBackground source={bg} style={styles.background}>
- <View style={styles.container}>
- <Text style={styles.logo}>APP</Text>
- {/* EMAIL */ }
- <Input
- placeholder='Digite seu email'
- inputContainerStyle={styles.inputContainer}
- inputStyle={{color:'white'}}
- placeholderTextColor="lightgrey"
- leftIcon={{name:'person', color:'white'}}
- />
- {/* SENHA */}
- <Input
- placeholder='Digite sua senha'
- inputContainerStyle={styles.inputContainer}
- placeholderTextColor="lightgrey"
- inputStyle={{color:'white'}}
- leftIcon={{name:'lock', color:'white'}}
- secureTextEntry={true}
- />
- {/* BOTÃO */}
- <Button title='Logar'
- buttonStyle={styles.btn}
- />
- {/* OPÇÃO CADASTRAR */}
- <Text style={styles.cadastrar}>Não possui conta?
- {'\n'}
- Clique aqui para se cadastrar</Text>
- </View>
- </ImageBackground>
- );
- }
- const styles = StyleSheet.create({
- cadastrar: {
- fontSize: 20,
- color: 'white',
- margin: 30,
- textAlign: 'center',
- textDecorationLine: 'underline'
- },
- background: {width:'100%', height:'100%'},
- container: {
- flex: 1,
- justifyContent: 'center',
- padding: 10,
- alignItems: 'stretch'
- },
- inputContainer:{
- backgroundColor:'rgba(255,255, 255, 0.3)',
- borderRadius: 30,
- paddingLeft: 10,
- marginBottom: -15
- },
- btn: {borderRadius:30, marginTop: 10, marginHorizontal: 10},
- logo: { color: 'white', fontSize: 50, textAlign: 'center'}
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement