Skip to content

Instantly share code, notes, and snippets.

@fabiomazucato
Created December 28, 2020 03:03
Show Gist options
  • Save fabiomazucato/c45e56858905db8a746541ba64363208 to your computer and use it in GitHub Desktop.
Save fabiomazucato/c45e56858905db8a746541ba64363208 to your computer and use it in GitHub Desktop.
Skeleton - Home (view.js)
import React from 'react'
import { SafeAreaView, ScrollView, View, Text, StatusBar } from 'react-native'
import {
Header,
LearnMoreLinks,
Colors,
DebugInstructions,
ReloadInstructions
} from 'react-native/Libraries/NewAppScreen'
import HomeLoading from './components/homeLoading'
import styles from './styles'
const Home = (props) => {
const { isLoading } = props
return (
<>
<StatusBar barStyle='dark-content' />
{isLoading ? (
<HomeLoading />
) : (
<SafeAreaView>
<ScrollView
contentInsetAdjustmentBehavior='automatic'
style={styles.scrollView}
>
<Header />
{global.HermesInternal == null ? null : (
<View style={styles.engine}>
<Text style={styles.footer}>Engine: Hermes</Text>
</View>
)}
<View style={styles.body}>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Step One</Text>
<Text style={styles.sectionDescription}>
Edit <Text style={styles.highlight}>App.js</Text> to change
this screen and then come back to see your edits.
</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>See Your Changes</Text>
<Text style={styles.sectionDescription}>
<ReloadInstructions />
</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Debug</Text>
<Text style={styles.sectionDescription}>
<DebugInstructions />
</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Learn More</Text>
<Text style={styles.sectionDescription}>
Read the docs to discover what to do next:
</Text>
</View>
<LearnMoreLinks />
</View>
</ScrollView>
</SafeAreaView>
)}
</>
)
}
export default Home
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment