Init HomeScreen

This commit is contained in:
Vincent BRIDIER 2022-09-30 17:40:03 +02:00
parent 322ed3406c
commit 3f38eff393
No known key found for this signature in database
GPG key ID: 8571BFA20420D512
6 changed files with 108 additions and 20 deletions

View file

@ -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 />
);
};

View 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;

View file

@ -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;

View file

@ -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,

View 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;

View 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;