Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- import { Text, Image, StyleSheet, View, TextInput, TouchableHighlight } from 'react-native';
- import TextField from 'react-native-md-textinput';
- const styles = StyleSheet.create({
- container: {
- alignItems: 'center',
- flex: 1,
- resizeMode: 'cover',
- width: null,
- height: null,
- },
- logo: {
- marginTop: 70,
- width: 150,
- height: 150,
- resizeMode: 'contain'
- },
- label: {
- marginBottom: -10,
- alignItems: 'flex-start',
- fontSize: 20,
- fontWeight: '300',
- color: 'rgb(94, 109, 155)'
- },
- inputWrap: {
- position: 'absolute',
- marginTop: 240
- },
- input: {
- borderBottomColor: '#305596',
- borderBottomWidth: 1,
- width: 320,
- fontSize: 20,
- fontWeight: '500',
- color: 'grey',
- },
- btn: {
- marginTop: 25,
- backgroundColor: '#FFF',
- borderRadius: 50,
- borderWidth: 2,
- width: 320,
- borderColor: '#FFF'
- },
- txt: {
- fontSize: 20,
- fontWeight: '500',
- textAlign: 'center',
- flexDirection: 'column',
- padding: 10,
- color: 'rgb(94, 109, 155)'
- },
- })
- class Register extends Component {
- constructor(props) {
- super(props);
- this.state = {
- username: "",
- email: "",
- password: "",
- confirm: ""
- }
- }
- static navigationOptions = {
- title: 'Register',
- header: null,
- tabBarVisible: false
- }
- render() {
- return <Image source={require('../images/bg-crem.jpg')} style={styles.container}>
- <Image source={require('../images/logo-crem.png')} style={styles.logo}></Image>
- <View style={styles.inputWrap}>
- <Text style={styles.label} >Username</Text>
- <TextInput
- style={styles.input}
- underlineColorAndroid={'transparent'}
- keyboardType={'default'}
- onChangeText={username => this.setState(() => ({ username }))}
- value={this.state.username}
- />
- <Text style={styles.label} >Email</Text>
- <TextInput
- style={styles.input}
- underlineColorAndroid={'transparent'}
- keyboardType={'email-address'}
- onChangeText={email => this.setState(() => ({ email }))}
- value={this.state.email}
- />
- <Text style={[styles.label, { marginTop: 15 }]} >Password</Text>
- <TextInput
- style={styles.input}
- underlineColorAndroid={'transparent'}
- onChangeText={password => this.setState(() => ({ password }))}
- secureTextEntry={true}
- value={this.state.password}
- />
- <Text style={[styles.label, { marginTop: 15 }]} >Password</Text>
- <TextInput
- style={styles.input}
- underlineColorAndroid={'transparent'}
- onChangeText={confirm => this.setState(() => ({ confirm }))}
- secureTextEntry={true}
- value={this.state.confirm}
- />
- <TouchableHighlight onPress={() => this.props.navigation.navigate('Dashboard')} style={styles.btn} underlayColor={'rgba(244, 236, 233, 0.8)'} >
- <Text style={styles.txt} >SIGN UP</Text>
- </TouchableHighlight>
- </View>
- </Image>
- }
- }
- export default Register;
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement