Init HomeScreen
This commit is contained in:
parent
322ed3406c
commit
3f38eff393
6 changed files with 108 additions and 20 deletions
|
|
@ -11,11 +11,12 @@ import type {Node} from 'react';
|
|||
|
||||
// Views
|
||||
import InstallScreen from './App/Views/InstallScreen';
|
||||
import HomeScreen from './App/Views/HomeScreen';
|
||||
|
||||
const App: () => Node = () => {
|
||||
|
||||
return (
|
||||
<InstallScreen />
|
||||
<HomeScreen />
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
43
ComApp/src/App/Views/HomeScreen.js
Normal file
43
ComApp/src/App/Views/HomeScreen.js
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
import React from 'react';
|
||||
import { View, ImageBackground, TouchableOpacity, Text, Image } from 'react-native';
|
||||
// Common Styles
|
||||
import commonStyles from '../../Resources/CommonStyles';
|
||||
// Style
|
||||
import styles from '../../Resources/Styles/HomeStyle';
|
||||
// Translations
|
||||
import i18n from "../../I18n";
|
||||
// FileSytem
|
||||
import * as FileSystem from 'expo-file-system';
|
||||
|
||||
class HomeScreen extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<ImageBackground source={{ uri: FileSystem.documentDirectory + 'BackgroundImage.png' }} style={commonStyles.background}>
|
||||
<View style={styles.container}>
|
||||
<TouchableOpacity onPress={() => { }} style={styles.button}>
|
||||
<Image source={{ uri: FileSystem.documentDirectory + 'HomeButtonImage.png' }} style={styles.btnImg} />
|
||||
<Text style={styles.btnTxt}>{i18n.t('home_s.1')}</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => { }} style={styles.button}>
|
||||
<Image source={{ uri: FileSystem.documentDirectory + 'HomeButtonImage.png' }} style={styles.btnImg} />
|
||||
<Text style={styles.btnTxt}>{i18n.t('home_s.2')}</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => { }} style={styles.button}>
|
||||
<Image source={{ uri: FileSystem.documentDirectory + 'HomeButtonImage.png' }} style={styles.btnImg} />
|
||||
<Text style={styles.btnTxt}>{i18n.t('home_s.3')}</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => { }} style={styles.button}>
|
||||
<Image source={{ uri: FileSystem.documentDirectory + 'HomeButtonImage.png' }} style={styles.btnImg} />
|
||||
<Text style={styles.btnTxt}>{i18n.t('global.videos')}</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => { }} style={styles.button}>
|
||||
<Image source={{ uri: FileSystem.documentDirectory + 'HomeButtonImage.png' }} style={styles.btnImg} />
|
||||
<Text style={styles.btnTxt}>{i18n.t('global.contacts')}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</ImageBackground>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default HomeScreen;
|
||||
|
|
@ -1,9 +1,11 @@
|
|||
import React from 'react';
|
||||
import { ImageBackground, View, Image, TextInput, Button, StyleSheet, Alert } from 'react-native';
|
||||
import { ImageBackground, View, Image, TextInput, Button, Alert } from 'react-native';
|
||||
// Helpers
|
||||
import Helpers from '../Lib/Helpers';
|
||||
// Common Styles
|
||||
import commonStyles from '../../Resources/CommonStyles';
|
||||
// Style
|
||||
import styles from '../../Resources/Styles/InstallStyle';
|
||||
// Translations
|
||||
import i18n from "../../I18n";
|
||||
// Controller
|
||||
|
|
@ -17,7 +19,7 @@ class InstallScreen extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<ImageBackground source={require('../../Resources/assets/img/background_ldc.png')} style={commonStyles.background}>
|
||||
<View style={commonStyles.container}>
|
||||
<View style={styles.container}>
|
||||
<Image source={require('../../Resources/assets/img/logo-square-ldc.png')} style={styles.logo} />
|
||||
<View style={styles.actions}>
|
||||
<TextInput
|
||||
|
|
@ -48,15 +50,4 @@ class InstallScreen extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
logo: {
|
||||
width: 150,
|
||||
height: 150,
|
||||
marginBottom: 20
|
||||
},
|
||||
actions: {
|
||||
marginTop: 20
|
||||
},
|
||||
});
|
||||
|
||||
export default InstallScreen;
|
||||
|
|
@ -4,12 +4,7 @@ const commonStyles = StyleSheet.create({
|
|||
background: {
|
||||
width: '100%',
|
||||
height: '100%'
|
||||
},
|
||||
container: {
|
||||
flex: 1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
},
|
||||
textInput: {
|
||||
height: 40,
|
||||
width: 300,
|
||||
|
|
|
|||
39
ComApp/src/Resources/Styles/HomeStyle.js
Normal file
39
ComApp/src/Resources/Styles/HomeStyle.js
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
import { StyleSheet } from 'react-native';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
alignItems: 'flex-end',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
text: {
|
||||
height: 40,
|
||||
width: 300,
|
||||
borderColor: 'grey',
|
||||
borderWidth: 1,
|
||||
marginBottom: 20,
|
||||
},
|
||||
button: {
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'white',
|
||||
marginBottom: 20,
|
||||
marginRight: 50,
|
||||
width: 400,
|
||||
height: 80,
|
||||
borderRadius: 10
|
||||
},
|
||||
btnTxt: {
|
||||
fontSize: 20
|
||||
},
|
||||
btnImg: {
|
||||
position: 'absolute',
|
||||
left: 15,
|
||||
height: 50,
|
||||
width: 50,
|
||||
resizeMode: 'stretch'
|
||||
}
|
||||
});
|
||||
|
||||
export default styles;
|
||||
19
ComApp/src/Resources/Styles/InstallStyle.js
Normal file
19
ComApp/src/Resources/Styles/InstallStyle.js
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
import { StyleSheet } from 'react-native';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
logo: {
|
||||
width: 150,
|
||||
height: 150,
|
||||
marginBottom: 20
|
||||
},
|
||||
actions: {
|
||||
marginTop: 20
|
||||
},
|
||||
});
|
||||
|
||||
export default styles;
|
||||
Loading…
Add table
Reference in a new issue