Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- import { View,TouchableOpacity, Text, StyleSheet, Image, Dimensions } from 'react-native';
- import BacgroundImage from './BackgroundImage';
- import Buttons from './Reusable/Button';
- const { width: WIDTH } = Dimensions.get('window');
- class LaunchScreen extends Component {
- render() {
- return (
- <BacgroundImage>
- <View style={styles.logoContainer}>
- <Image
- source={require('./images/logo.png')}
- style={styles.PlaceLogo}
- />
- </View>
- <View style={styles.Buttons}>
- <Buttons style={styles.signupButton}
- onPress={() => navigate('Login')}>
- <Text style={styles.buttonText}> SIGN UP</Text>
- </Buttons>
- <Buttons style={styles.loginButton}>
- <Text style={styles.buttonText}> SIGN IN</Text>
- </Buttons>
- </View >
- <View style={styles.sepratorView}>
- <Text style={styles.sepratorText}>--------- or connect with us on ---------</Text>
- </View >
- <View style={styles.socialButtonStyle}>
- <TouchableOpacity
- style={styles.fbstyle}
- activeOpacity={0.5}
- >
- <Image
- source={require('./images/facebookicon.png')}
- style={styles.iconstyle}
- />
- <View
- style={styles.sepratorLine}
- />
- <Text
- style={styles.socialButtonText}
- >FACEBOOK</Text>
- </TouchableOpacity>
- <TouchableOpacity
- style={styles.googlestyle}
- onPress={this.signIn}
- activeOpacity={0.5}
- >
- <Image
- source={require('./images/google.png')}
- style={styles.iconstyle}
- />
- <View
- style={styles.sepratorLine}
- />
- <Text style={styles.socialButtonText} >GOOGLE</Text>
- </TouchableOpacity>
- </View>
- </BacgroundImage>
- );
- };
- }
- const styles = StyleSheet.create({
- logoContainer: {
- flex: 1
- },
- PlaceLogo: {
- width: WIDTH - 140,
- margin: 75,
- resizeMode: 'center',
- justifyContent: 'center',
- alignItems: 'center',
- },
- yosoButtons: {
- width: WIDTH - 80,
- justifyContent:'center',
- marginTop:350
- },
- signupButton: {
- height:40,
- paddingTop:7,
- marginBottom: 15,
- },
- loginButton: {
- height:40,
- paddingTop:7,
- marginBottom: 15
- },
- buttonText: {
- },
- sepratorText: {
- textAlign:'center',
- fontSize:20,
- color: '#b6b7ba',
- },
- sepratorView: {
- flexDirection: 'row',
- justifyContent:'center',
- alignItems:'center'
- },
- socialButtonStyle:{
- flex:1,
- flexDirection:'row',
- justifyContent:'center',
- alignItems:'center',
- margin:5
- },
- fbstyle:{
- flex:1,
- flexDirection:'row',
- borderColor:'white',
- alignItems:'center',
- backgroundColor:'#485a96',
- borderWidth:1,
- borderRadius:35,
- height: 40,
- marginLeft:15,
- marginRight:15
- },
- googlestyle:{
- flex:1,
- flexDirection:'row',
- alignItems:'center',
- backgroundColor:'#dc4e41',
- borderWidth:1,
- borderRadius:35,
- borderColor:'white',
- height: 40,
- marginRight:15
- },
- iconstyle:{
- resizeMode:'stretch',
- height:25,
- width:25
- },
- sepratorLine:{
- backgroundColor:'white',
- width:2,
- height: 40
- },
- socialButtonText:{
- color: '#fff',
- flex:1,
- textAlign: 'center',
- fontSize: 15,
- fontWeight: "bold"
- }
- });
- export default LaunchScreen;
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement