react-native-template-rocketseat/src/pages/Main/index.js

<!-- *** Obrigado por estar vendo o nosso README. Se você tiver alguma sugestão *** que possa melhorá-lo ainda mais dê um fork no repositório e crie uma Pull *** Request ou abra uma Issue com a tag "sugestão". *** Obrigado novamente! Agora vamos rodar ess

import React from 'react';

import {
  Text, Image, StyleSheet, Dimensions, ImageBackground, StatusBar,
} from 'react-native';

const styles = StyleSheet.create({
  container: {
    alignItems: 'center',
    flex: 1,
    paddingHorizontal: 20,
  },
  fileName: {
    fontWeight: 'bold',
    marginTop: 5,
  },
  instructions: {
    color: '#DDD',
    fontSize: 14,
    marginTop: 20,
    textAlign: 'center',
  },
  logo: {
    height: Dimensions.get('window').height * 0.11,
    marginVertical: Dimensions.get('window').height * 0.11,
    width: Dimensions.get('window').height * 0.11 * (1950 / 662),
  },
  welcome: {
    color: '#fff',
    fontSize: 22,
    fontWeight: 'bold',
    textAlign: 'center',
  },
});

const Main = () => (
  <ImageBackground
    source={{
      uri: 'https://s3-sa-east-1.amazonaws.com/rocketseat-cdn/background.png',
    }}
    style={styles.container}
    resizeMode="cover"
  >
    <StatusBar barStyle="light-content" backgroundColor="#7159c1" />
    <Image
      source={{
        uri: 'https://s3-sa-east-1.amazonaws.com/rocketseat-cdn/rocketseat_logo.png',
      }}
      style={styles.logo}
      resizeMode="contain"
    />
    <Text style={styles.welcome}>Welcome to OmniStack!</Text>
    <Text style={styles.instructions}>This is the main page of your application</Text>
    <Text style={styles.instructions}>You can edit this file in:</Text>
    <Text style={[styles.instructions, styles.fileName]}>src/pages/Main/index.js</Text>
  </ImageBackground>
);

export default Main;