Skip to content

P
pianoApp
Commit 194a1e62 authored by norhalimah's avatar norhalimah
Browse files
Options

backhandler fixed

parent d794fa83
Hide whitespace changes
Inline Side-by-side
Showing with 210 additions and 229 deletions
img/background.jpg
View replaced file @ d794fa83 View file @ 194a1e62
img/background.jpg

6.75 KB | W: | H:

img/background.jpg

35.6 KB | W: | H:

img/background.jpg
img/background.jpg
img/background.jpg
img/background.jpg
  • 2-up
  • Swipe
  • Onion skin
screens/home.js
View file @ 194a1e62
...@@ -20,17 +20,18 @@ class Home extends React.PureComponent { ...@@ -20,17 +20,18 @@ class Home extends React.PureComponent {
async componentDidMount() { async componentDidMount() {
Orientation.lockToPortrait(); Orientation.lockToPortrait();
BackHandler.addEventListener('hardwareBackPress', exitApp);
// Orientation.lockAsync(Orientation.OrientationLock.PORTRAIT_UP); // Orientation.lockAsync(Orientation.OrientationLock.PORTRAIT_UP);
} }
componentWillUnmount() { componentWillUnmount() {
Orientation.lockToPortrait(); Orientation.lockToPortrait();
BackHandler.removeEventListener('hardwareBackPress', exitApp);
// Orientation.lockAsync(Orientation.OrientationLock.PORTRAIT_UP); // Orientation.lockAsync(Orientation.OrientationLock.PORTRAIT_UP);
} }
render() { render() {
BackHandler.addEventListener('hardwareBackPress', exitApp);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground <ImageBackground
...@@ -41,7 +42,7 @@ class Home extends React.PureComponent { ...@@ -41,7 +42,7 @@ class Home extends React.PureComponent {
}}> }}>
<SafeAreaView> <SafeAreaView>
<ScrollView> <ScrollView>
<View style={{marginTop: '5%', marginBottom: '5%'}}> <View style={{marginTop: '15%', marginBottom: '5%'}}>
<TouchableOpacity <TouchableOpacity
style={styles.menu} style={styles.menu}
onPress={() => { onPress={() => {
...@@ -87,8 +88,8 @@ const styles = StyleSheet.create({ ...@@ -87,8 +88,8 @@ const styles = StyleSheet.create({
marginLeft: '3%', marginLeft: '3%',
marginRight: '3%', marginRight: '3%',
borderRadius: 10, borderRadius: 10,
borderWidth: 2, borderWidth: 5,
borderColor: 'white', borderColor: 'black',
backgroundColor: 'white', backgroundColor: 'white',
}, },
}); });
screens/logbook.js
View file @ 194a1e62
...@@ -41,16 +41,17 @@ class LogBook extends React.PureComponent { ...@@ -41,16 +41,17 @@ class LogBook extends React.PureComponent {
componentDidMount() { componentDidMount() {
Orientation.lockToPortrait(); Orientation.lockToPortrait();
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
this.displayData(); this.displayData();
} }
homeExit = async () => { homeExit = async () => {
this.props.navigation.navigate('1'); this.props.navigation.navigate('1');
BackHandler.removeEventListener('hardwareBackPress', this.homeExit);
//Orientation.lockToPortrait(); //Orientation.lockToPortrait();
}; };
render() { render() {
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground <ImageBackground
...@@ -69,25 +70,28 @@ class LogBook extends React.PureComponent { ...@@ -69,25 +70,28 @@ class LogBook extends React.PureComponent {
key ={id} key ={id}
style={{ style={{
flexDirection: 'row', flexDirection: 'row',
padding: 10, paddingLeft: 15,
paddingRight: 15,
paddingBottom:10,
paddingTop:5,
backgroundColor: 'white', backgroundColor: 'white',
borderBottomWidth:1, borderBottomWidth:1,
}}> }}>
<View style={{alignItems: 'center'}}> <View style={{alignItems: 'center',marginRight:5}}>
<View style={{marginRight:10, marginBottom:10}}> <View>
<Text style={{color:'black', fontSize: 40}}>{(item.date !== undefined) ? item.date.split(' ')[0].trim() : ''}</Text> <Text style={{color:'black', fontSize: 40,textAlign: 'center'}}>{(item.date !== undefined) ? item.date.split(' ')[0].trim() : ''}</Text>
<Text style={{color:'black', fontSize: 15, marginLeft:11}}>{(item.date !== undefined) ? item.date.split(' ')[1].trim() : ''}</Text> <Text style={{color:'black', fontSize: 15, textAlign: 'center'}}>{(item.date !== undefined) ? item.date.split(' ')[1].trim() : ''}</Text>
</View> </View>
<View style={{marginRight:5}}> <View>
<Text style={{color:'black', fontSize: 15}}>{item.day}</Text> <Text style={{color:'black', fontSize: 15, textAlign: 'center'}}>{item.day}</Text>
</View> </View>
</View> </View>
<View style={{borderWidth:1, borderColor : 'blue'}}/> <View style={{borderWidth:1, borderColor : 'gray'}}/>
<View style={{flexDirection: 'column',marginLeft:5,marginTop:5}}> <View style={{flexDirection: 'column',marginLeft:5,marginTop:10}}>
<Text style={{color:'green', fontSize: 15}}>Correct : {item.correct}</Text> <Text style={{color:'green', fontSize: 15}}>Correct:{item.correct}</Text>
<Text style={{color:'red', fontSize: 15}}>Wrong : {item.wrong}</Text> <Text style={{color:'red', fontSize: 15}}>Wrong: {item.wrong}</Text>
<Text style={{color:'black', fontSize: 15}}>Timer : {item.timer}</Text> <Text style={{color:'black', fontSize: 15}}>Timer: {item.timer}</Text>
<Text style={{color:'black', fontSize: 15}}>Time : {item.time}</Text> <Text style={{color:'black', fontSize: 15}}>Time: {item.time}</Text>
</View> </View>
</View> </View>
)).reverse()} )).reverse()}
...@@ -105,6 +109,7 @@ const styles = StyleSheet.create({ ...@@ -105,6 +109,7 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
backgroundColor: '#9001f5',
}, },
menu: { menu: {
marginTop: '3%', marginTop: '3%',
......
screens/quiz.js
View file @ 194a1e62
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
import React from 'react'; import React from 'react';
import { import {
//ImageBackground, ImageBackground,
Text, Text,
View, View,
StatusBar, StatusBar,
...@@ -59,6 +59,7 @@ const NOTESFF1 = [{name: 'F#2', url: require('../sound/f_ff.mp3')}]; ...@@ -59,6 +59,7 @@ const NOTESFF1 = [{name: 'F#2', url: require('../sound/f_ff.mp3')}];
const NOTESGG1 = [{name: 'G#2', url: require('../sound/g_gg.mp3')}]; const NOTESGG1 = [{name: 'G#2', url: require('../sound/g_gg.mp3')}];
const NOTESAA1 = [{name: 'A#2', url: require('../sound/a_aa.mp3')}]; const NOTESAA1 = [{name: 'A#2', url: require('../sound/a_aa.mp3')}];
const keywordsList = []; const keywordsList = [];
const exitApp = () => BackHandler.exitApp();
var imageN = ''; var imageN = '';
var indexN = 0; var indexN = 0;
...@@ -82,6 +83,7 @@ class Quiz extends React.Component { ...@@ -82,6 +83,7 @@ class Quiz extends React.Component {
showC : false, showC : false,
showW : false, showW : false,
showDone : false, showDone : false,
showQuit : false,
maxCount : 5, maxCount : 5,
records: [], records: [],
}; };
...@@ -96,9 +98,9 @@ class Quiz extends React.Component { ...@@ -96,9 +98,9 @@ class Quiz extends React.Component {
// loaded successfully // loaded successfully
sound.play((success) => { sound.play((success) => {
if (success) { if (success) {
console.log('successfully finished playing'); // console.log('successfully finished playing');
} else { } else {
console.log('playback failed due to audio decoding errors'); // console.log('playback failed due to audio decoding errors');
sound.release(); sound.release();
} }
}); });
...@@ -108,10 +110,10 @@ class Quiz extends React.Component { ...@@ -108,10 +110,10 @@ class Quiz extends React.Component {
let index = -1; let index = -1;
if ((index = keywordsList.indexOf(keyword.name)) !== -1) { if ((index = keywordsList.indexOf(keyword.name)) !== -1) {
list.splice(index, 1); list.splice(index, 1);
console.log(list); // console.log(list);
} else { } else {
list.push(keyword.name); list.push(keyword.name);
console.log(list); // console.log(list);
} }
this.setState({keywordsList: list}); this.setState({keywordsList: list});
}; };
...@@ -171,7 +173,7 @@ class Quiz extends React.Component { ...@@ -171,7 +173,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -184,7 +186,7 @@ class Quiz extends React.Component { ...@@ -184,7 +186,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -202,7 +204,7 @@ class Quiz extends React.Component { ...@@ -202,7 +204,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -215,7 +217,7 @@ class Quiz extends React.Component { ...@@ -215,7 +217,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -233,7 +235,7 @@ class Quiz extends React.Component { ...@@ -233,7 +235,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -246,7 +248,7 @@ class Quiz extends React.Component { ...@@ -246,7 +248,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -264,7 +266,7 @@ class Quiz extends React.Component { ...@@ -264,7 +266,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -277,7 +279,7 @@ class Quiz extends React.Component { ...@@ -277,7 +279,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -295,7 +297,7 @@ class Quiz extends React.Component { ...@@ -295,7 +297,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -308,7 +310,7 @@ class Quiz extends React.Component { ...@@ -308,7 +310,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -326,7 +328,7 @@ class Quiz extends React.Component { ...@@ -326,7 +328,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -339,7 +341,7 @@ class Quiz extends React.Component { ...@@ -339,7 +341,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -357,7 +359,7 @@ class Quiz extends React.Component { ...@@ -357,7 +359,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -388,7 +390,7 @@ class Quiz extends React.Component { ...@@ -388,7 +390,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -401,7 +403,7 @@ class Quiz extends React.Component { ...@@ -401,7 +403,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -419,7 +421,7 @@ class Quiz extends React.Component { ...@@ -419,7 +421,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -432,7 +434,7 @@ class Quiz extends React.Component { ...@@ -432,7 +434,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -450,7 +452,7 @@ class Quiz extends React.Component { ...@@ -450,7 +452,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -463,7 +465,7 @@ class Quiz extends React.Component { ...@@ -463,7 +465,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -481,7 +483,7 @@ class Quiz extends React.Component { ...@@ -481,7 +483,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -494,8 +496,8 @@ class Quiz extends React.Component { ...@@ -494,8 +496,8 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
this.setState({showW: true}); this.setState({showW: true});
...@@ -512,7 +514,7 @@ class Quiz extends React.Component { ...@@ -512,7 +514,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -525,7 +527,7 @@ class Quiz extends React.Component { ...@@ -525,7 +527,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -543,7 +545,7 @@ class Quiz extends React.Component { ...@@ -543,7 +545,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -556,7 +558,7 @@ class Quiz extends React.Component { ...@@ -556,7 +558,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -574,7 +576,7 @@ class Quiz extends React.Component { ...@@ -574,7 +576,7 @@ class Quiz extends React.Component {
this.setState({correct : this.state.correct + 1}); this.setState({correct : this.state.correct + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime); this.handlerArgCall((this.state.correct + 1), this.state.wrong, stime);
console.log('finish'); // console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -587,7 +589,7 @@ class Quiz extends React.Component { ...@@ -587,7 +589,7 @@ class Quiz extends React.Component {
this.setState({wrong : this.state.wrong + 1}); this.setState({wrong : this.state.wrong + 1});
this.setState({showDone: true}); this.setState({showDone: true});
this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime); this.handlerArgCall(this.state.correct, (this.state.wrong + 1), stime);
console.log('finish'); //console.log('finish');
this.backAction(); this.backAction();
} }
else { else {
...@@ -601,7 +603,7 @@ class Quiz extends React.Component { ...@@ -601,7 +603,7 @@ class Quiz extends React.Component {
homeExit = async () => { homeExit = async () => {
// this.props.navigation.navigate('1'); // this.props.navigation.navigate('1');
Alert.alert('Hold on!', 'Are you sure you want to exit?', [ Alert.alert('Hold on!', 'Are you sure you want to quit?', [
{ {
text: 'Cancel', text: 'Cancel',
onPress: () => null, onPress: () => null,
...@@ -609,7 +611,7 @@ class Quiz extends React.Component { ...@@ -609,7 +611,7 @@ class Quiz extends React.Component {
}, },
{ text: 'YES', onPress: () => [ this.props.navigation.navigate('1'), Orientation.lockToPortrait()]}, { text: 'YES', onPress: () => [ this.props.navigation.navigate('1'), Orientation.lockToPortrait()]},
]); ]);
return true;
}; };
backAction = () => { backAction = () => {
...@@ -619,14 +621,14 @@ class Quiz extends React.Component { ...@@ -619,14 +621,14 @@ class Quiz extends React.Component {
componentDidMount() { componentDidMount() {
//this.removeArray(); //this.removeArray();
// BackHandler.addEventListener('hardwareBackPress', this.homeExit); BackHandler.addEventListener('hardwareBackPress', this.homeExit);
Orientation.lockToLandscape(); Orientation.lockToLandscape();
this.displayData(); this.displayData();
} }
componentWillUnmount() { componentWillUnmount() {
this.removeArray(); this.removeArray();
// BackHandler.addEventListener('hardwareBackPress', this.homeExit); BackHandler.removeEventListener('hardwareBackPress', this.homeExit);
//clearInterval(this.interval); //clearInterval(this.interval);
// Orientation.lockToLandscape(); // Orientation.lockToLandscape();
} }
...@@ -642,18 +644,18 @@ this.setState({records: []}); ...@@ -642,18 +644,18 @@ this.setState({records: []});
this.setState({ this.setState({
logbook: JSON.parse(value), logbook: JSON.parse(value),
}); });
console.log(this.state.logbook); // console.log(this.state.logbook);
RNFS.readFile(path1, 'ascii') RNFS.readFile(path1, 'ascii')
.then((ccc) => { .then((ccc) => {
console.log('has notes has counter'); console.log('has notes has counter');
console.log(ccc); // console.log(ccc);
imageN = Math.floor(Math.random() * this.state.logbook.length); imageN = Math.floor(Math.random() * this.state.logbook.length);
this.setState({ this.setState({
name : this.state.logbook[imageN], name : this.state.logbook[imageN],
maxCount : ccc, maxCount : ccc,
}); });
indexN = Notes.findIndex(item=> item.name === this.state.name); indexN = Notes.findIndex(item=> item.name === this.state.name);
console.log(this.state.name); // console.log(this.state.name);
}) })
.catch((err) => { .catch((err) => {
console.log(err.message, err.code); console.log(err.message, err.code);
...@@ -663,9 +665,9 @@ this.setState({records: []}); ...@@ -663,9 +665,9 @@ this.setState({records: []});
name : this.state.logbook[imageN], name : this.state.logbook[imageN],
maxCount : 10, maxCount : 10,
}); });
console.log(this.state.name); // console.log(this.state.name);
indexN = Notes.findIndex(item=> item.name === this.state.name); indexN = Notes.findIndex(item=> item.name === this.state.name);
console.log(indexN); // console.log(indexN);
}); });
} }
else { else {
...@@ -713,13 +715,13 @@ this.setState({records: []}); ...@@ -713,13 +715,13 @@ this.setState({records: []});
value = JSON.parse(value); value = JSON.parse(value);
value.push(obj); value.push(obj);
// console.log(value); // console.log(value);
console.log('We have data!!'); // console.log('We have data!!');
AsyncStorage.setItem('@storage_key', JSON.stringify(value), (err)=> { AsyncStorage.setItem('@storage_key', JSON.stringify(value), (err)=> {
if (err){ if (err){
console.log('an error'); console.log('an error');
throw err; throw err;
} }
console.log('success'); // console.log('success');
}).catch((err)=> { }).catch((err)=> {
console.log('error is: ' + err); console.log('error is: ' + err);
}); });
...@@ -731,7 +733,7 @@ this.setState({records: []}); ...@@ -731,7 +733,7 @@ this.setState({records: []});
console.log('an error'); console.log('an error');
throw err; throw err;
} }
console.log('success'); //console.log(JSON.stringify(this.state.listN)); // console.log('success'); //console.log(JSON.stringify(this.state.listN));
}).catch((err)=> { }).catch((err)=> {
console.log('error is: ' + err); console.log('error is: ' + err);
}); });
...@@ -781,31 +783,39 @@ this.setState({records: []}); ...@@ -781,31 +783,39 @@ this.setState({records: []});
const CorrectAlertBox = () =>{ const CorrectAlertBox = () =>{
return ( return (
<Modal transparent={true} visible={this.state.showC}> <Modal transparent={true} visible={this.state.showC} animationType="slide">
<View style={{backgroundColor: '#000000aa', flex: 1}}> <View style={{backgroundColor: '#000000aa', flex: 1}}>
<View <View
style={{ style={{
marginTop: Dimensions.get('window').height * 0.3, marginLeft: Dimensions.get('window').width * 0.25,
marginLeft: Dimensions.get('window').width * 0.3,
backgroundColor: 'white',
width : Dimensions.get('window').width * 0.4, width : Dimensions.get('window').width * 0.4,
borderRadius: 5, alignItems: 'center',
}}> }}>
<Text style={{fontSize: 20, margin:10}}>Correct</Text> <ImageBackground
source={require('../img/correctAlert.png')}
style={{
width: '130%',
height: '95%',
}}>
<Text style={{fontSize: 25,textAlign: 'center', marginTop:Dimensions.get('window').height * 0.43, marginLeft:120, color:'white'}}>Correct</Text>
<View <View
style={{ style={{
alignItems: 'flex-end', alignItems: 'center',
marginLeft:120,
}}> }}>
<TouchableOpacity style={{ <TouchableOpacity style={{
backgroundColor: 'black', backgroundColor: 'white',
borderColor: 'black',
padding: 15, padding: 15,
borderRadius: 5, borderRadius: 5,
margin:10, marginTop:10,
marginBottom:10,
}} }}
onPress={() => this.setState({showC: false})}> onPress={() => this.setState({showC: false})}>
<Text style={{color: 'white'}}>Ok</Text> <Text style={{color: 'black'}}>OK</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</ImageBackground>
</View> </View>
</View> </View>
</Modal> </Modal>
...@@ -814,40 +824,48 @@ this.setState({records: []}); ...@@ -814,40 +824,48 @@ this.setState({records: []});
const WrongAlertBox = () =>{ const WrongAlertBox = () =>{
return ( return (
<Modal transparent={true} visible={this.state.showW}> <Modal transparent={true} visible={this.state.showW} animationType="slide">
<View style={{backgroundColor: '#000000aa', flex: 1}}> <View style={{backgroundColor: '#000000aa', flex: 1}}>
<View <View
style={{ style={{
marginTop: Dimensions.get('window').height * 0.3, marginLeft: Dimensions.get('window').width * 0.25,
marginLeft: Dimensions.get('window').width * 0.3,
backgroundColor: 'white',
width : Dimensions.get('window').width * 0.4, width : Dimensions.get('window').width * 0.4,
borderRadius: 5, alignItems: 'center',
}}> }}>
<Text style={{fontSize: 20, margin:10}}>Wrong</Text> <ImageBackground
source={require('../img/wrongAlert.png')}
style={{
width: '130%',
height: '95%',
}}>
<Text style={{fontSize: 25,textAlign: 'center', marginTop:Dimensions.get('window').height * 0.43, marginLeft:120, color:'white'}}>Wrong</Text>
<View <View
style={{ style={{
alignItems: 'flex-end', alignItems: 'center',
marginLeft:120,
}}> }}>
<TouchableOpacity style={{ <TouchableOpacity style={{
backgroundColor: 'black', backgroundColor: 'white',
borderColor: 'black',
padding: 15, padding: 15,
borderRadius: 5, borderRadius: 5,
margin:10, marginTop:10,
marginBottom:10,
}} }}
onPress={() => this.setState({showW: false})}> onPress={() => this.setState({showW: false})}>
<Text style={{color: 'white'}}>Ok</Text> <Text style={{color: 'black'}}>OK</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</ImageBackground>
</View> </View>
</View> </View>
</Modal> </Modal>
); );
}; };
const DoneAlertBox = () =>{ const DoneAlertBox = () =>{
return ( return (
<Modal transparent={true} visible={this.state.showDone}> <Modal transparent={true} visible={this.state.showDone} animationType="slide">
<View style={{backgroundColor: '#000000aa', flex: 1}}> <View style={{backgroundColor: '#000000aa', flex: 1}}>
<View <View
style={{ style={{
...@@ -858,8 +876,8 @@ this.setState({records: []}); ...@@ -858,8 +876,8 @@ this.setState({records: []});
borderRadius: 5, borderRadius: 5,
}}> }}>
<Text style={{fontSize: 20, margin:10}}>Well Done</Text> <Text style={{fontSize: 20, margin:10}}>Well Done</Text>
<Text style={{fontSize: 15, marginLeft:10}}>Correct : {this.state.correct}</Text> <Text style={{fontSize: 15, marginLeft:10, color: 'green'}}>Correct : {this.state.correct}</Text>
<Text style={{fontSize: 15, marginLeft:10}}>Wrong: {this.state.wrong}</Text> <Text style={{fontSize: 15, marginLeft:10, color:'red'}}>Wrong: {this.state.wrong}</Text>
<View <View
style={{ style={{
alignItems: 'flex-end', alignItems: 'flex-end',
...@@ -871,7 +889,7 @@ this.setState({records: []}); ...@@ -871,7 +889,7 @@ this.setState({records: []});
margin : 10, margin : 10,
}} }}
onPress={() => this.setState({showDone: false})}> onPress={() => this.setState({showDone: false})}>
<Text style={{color: 'white'}}>Ok</Text> <Text style={{color: 'white'}}>OK</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
...@@ -882,6 +900,12 @@ this.setState({records: []}); ...@@ -882,6 +900,12 @@ this.setState({records: []});
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground
source={require('../img/background.jpg')}
style={{
width: '100%',
height: '100%',
}}>
<CorrectAlertBox /> <CorrectAlertBox />
<WrongAlertBox /> <WrongAlertBox />
<DoneAlertBox /> <DoneAlertBox />
...@@ -901,6 +925,8 @@ this.setState({records: []}); ...@@ -901,6 +925,8 @@ this.setState({records: []});
backgroundColor: 'black', backgroundColor: 'black',
padding: 5, padding: 5,
borderRadius: 10, borderRadius: 10,
borderColor:'white',
borderWidth:3,
width: 200, width: 200,
alignItems: 'center', alignItems: 'center',
}, },
...@@ -908,7 +934,7 @@ this.setState({records: []}); ...@@ -908,7 +934,7 @@ this.setState({records: []});
fontSize: 25, fontSize: 25,
color: '#FFF', color: '#FFF',
textAlign: 'center', textAlign: 'center',
paddingTop: 10, paddingTop: 5,
alignItems: 'center', alignItems: 'center',
}, },
}} }}
...@@ -929,6 +955,7 @@ this.setState({records: []}); ...@@ -929,6 +955,7 @@ this.setState({records: []});
</View> </View>
<Image style={styles.logo} source={Notes[indexN].image} /> <Image style={styles.logo} source={Notes[indexN].image} />
</View> </View>
<View style={{borderWidth:5, borderColor:'black'}}/>
<View style={styles.c2}> <View style={styles.c2}>
{NOTESWHITE.map((item, id) => ( {NOTESWHITE.map((item, id) => (
<TouchableHighlight <TouchableHighlight
...@@ -1063,6 +1090,7 @@ this.setState({records: []}); ...@@ -1063,6 +1090,7 @@ this.setState({records: []});
</TouchableHighlight> </TouchableHighlight>
))} ))}
</View> </View>
</ImageBackground>
</View> </View>
); );
} }
......
screens/settings.js
View file @ 194a1e62
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
import React from 'react'; import React from 'react';
import { import {
SafeAreaView, SafeAreaView,
//ImageBackground, ImageBackground,
Text, Text,
View, View,
TouchableOpacity, TouchableOpacity,
...@@ -148,10 +148,17 @@ export default class Settings extends React.Component { ...@@ -148,10 +148,17 @@ export default class Settings extends React.Component {
}); });
}; };
componentWillUnmount() {
Orientation.lockToPortrait();
BackHandler.removeEventListener('hardwareBackPress', this.homeExit);
// Orientation.lockAsync(Orientation.OrientationLock.PORTRAIT_UP);
}
componentDidMount() { componentDidMount() {
// notes.splice(0, notes.length); // notes.splice(0, notes.length);
// console.log(notes); // console.log(notes);
Orientation.lockToPortrait(); Orientation.lockToPortrait();
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
// console.log(notes.length); // console.log(notes.length);
counter = 0; counter = 0;
RNFS.unlink(path1).then(res => { RNFS.unlink(path1).then(res => {
...@@ -180,14 +187,19 @@ export default class Settings extends React.Component { ...@@ -180,14 +187,19 @@ export default class Settings extends React.Component {
}; };
render() { render() {
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground
source={require('../img/background.jpg')}
style={{
width: '100%',
height: '100%',
}}>
<SafeAreaView> <SafeAreaView>
<View style={{alignItems:'center',marginTop: '15%', marginLeft: config.deviceWidth * 0.08, <View style={{alignItems:'center',marginTop: '15%', marginLeft: config.deviceWidth * 0.08,
marginRight: config.deviceWidth * 0.1, flexDirection: 'row', marginRight: config.deviceWidth * 0.1, flexDirection: 'row',
flexWrap: 'wrap'}}> flexWrap: 'wrap'}}>
<Text style={{fontSize: 15,marginRight:5}}>No. of Questions : </Text> <Text style={{fontSize: 16,marginRight:9}}>No. of Questions : </Text>
<NumericInput <NumericInput
value={this.state.value} value={this.state.value}
minValue={0} minValue={0}
...@@ -213,6 +225,7 @@ export default class Settings extends React.Component { ...@@ -213,6 +225,7 @@ export default class Settings extends React.Component {
width: config.deviceWidth, width: config.deviceWidth,
marginLeft: config.deviceWidth * 0.08, marginLeft: config.deviceWidth * 0.08,
marginRight: config.deviceWidth * 0.1, marginRight: config.deviceWidth * 0.1,
marginBottom: config.deviceHeight * 0.12,
}}> }}>
{Notes.map((item, id) => ( {Notes.map((item, id) => (
<View key={id}> <View key={id}>
...@@ -240,6 +253,7 @@ export default class Settings extends React.Component { ...@@ -240,6 +253,7 @@ export default class Settings extends React.Component {
</View> </View>
</ScrollView> </ScrollView>
</SafeAreaView> </SafeAreaView>
</ImageBackground>
</View> </View>
); );
} }
...@@ -256,8 +270,8 @@ const styles = StyleSheet.create({ ...@@ -256,8 +270,8 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
width: config.deviceWidth * 0.4, width: config.deviceWidth * 0.4,
alignItems: 'center', alignItems: 'center',
borderWidth: 1, borderWidth: 3,
borderColor: 'black', borderColor: 'white',
borderRadius: 10, borderRadius: 10,
backgroundColor: 'rgba(52, 52, 52, 0.0)', backgroundColor: 'rgba(52, 52, 52, 0.0)',
//opacity: 0.5, //opacity: 0.5,
...@@ -269,7 +283,7 @@ const styles = StyleSheet.create({ ...@@ -269,7 +283,7 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
width: config.deviceWidth * 0.4, width: config.deviceWidth * 0.4,
alignItems: 'center', alignItems: 'center',
borderWidth: 1, borderWidth: 3,
borderColor: 'black', borderColor: 'black',
backgroundColor: 'white', backgroundColor: 'white',
// backgroundColor: 'rgba(0,0,0,0)', // backgroundColor: 'rgba(0,0,0,0)',
......
screens/totalScore.js deleted 100644 → 0
View file @ d794fa83
/* eslint-disable prettier/prettier */
/* eslint-disable react/no-did-mount-set-state */
/* eslint-disable prettier/prettier */
/* eslint-disable no-unused-vars */
/* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */
import React, {Component} from 'react';
import {
Text,
View,
StyleSheet,
TouchableHighlight,
ImageBackground,
Image,
Button,
Alert,
} from 'react-native';
import styles from './style.js';
import {useNavigation} from '@react-navigation/native';
export default class TotalScore extends Component {
constructor(props: Object) {
super(props);
this.state = {
timer: 0,
correct: 0,
wrong: 0,
};
}
componentDidMount() {
this.setState({
correct: this.props.route.params.c,
wrong: this.props.route.params.w,
});
}
componentWillUnmount() {
clearInterval(this.interval);
}
';';
render() {
const {
container,
selectedKeywordStyle,
buttonStyle,
textStyle,
buttonB1,
buttonB2,
buttonB3,
buttonB4,
buttonB5,
SbuttonB1,
SbuttonB2,
SbuttonB3,
SbuttonB4,
SbuttonB5,
} = styles;
return (
<View style={styles.container}>
<View style={styles.c1}>
<View style={styles.boxScore}>
<Text style={{fontSize: 20}}>Total Score </Text>
<Text>Correct :{this.state.correct}</Text>
<Text>Wrong :{this.state.wrong}</Text>
</View>
<Button
title="START AGAIN"
color="#E07EF9"
onPress={() => this.props.navigation.navigate('1')}
/>
</View>
</View>
);
}
}
style/style.js
View file @ 194a1e62
...@@ -53,46 +53,56 @@ export default StyleSheet.create({ ...@@ -53,46 +53,56 @@ export default StyleSheet.create({
borderWidth: 3, borderWidth: 3,
borderRadius: 10, borderRadius: 10,
position: 'absolute', position: 'absolute',
marginTop: config.deviceWidth * 0.1, marginTop: config.deviceWidth * 0.11,
backgroundColor:'white',
}, },
correct: { correct: {
width: 100, width: 100,
textAlign: 'center', textAlign: 'center',
paddingTop: 15, paddingTop: 15,
color: 'black', color: 'white',
height: 60, height: 60,
borderRadius: 10, borderRadius: 10,
alignItems: 'center', alignItems: 'center',
fontSize: 25, fontSize: 25,
marginRight: 10, marginRight: 10,
backgroundColor:'green', backgroundColor:'green',
borderColor:'white',
borderWidth: 2,
}, },
wrong: { wrong: {
width: 100, width: 100,
height: 60, height: 60,
borderRadius: 10, borderRadius: 10,
borderColor:'white',
alignItems: 'center', alignItems: 'center',
textAlign: 'center', textAlign: 'center',
paddingTop: 15, paddingTop: 15,
color: 'black', color: 'white',
fontSize: 25, fontSize: 25,
marginRight: 10, marginRight: 10,
backgroundColor:'red', backgroundColor:'red',
borderWidth: 2,
}, },
timer: { timer: {
width: 65, width: 65,
height: 60, height: 60,
borderRadius: 10, borderRadius: 10,
borderColor:'white',
alignItems: 'center', alignItems: 'center',
textAlign: 'center', textAlign: 'center',
paddingTop: 16, paddingTop: 16,
color: 'white', color: 'white',
fontSize: 25, fontSize: 25,
backgroundColor:'black', backgroundColor:'black',
borderWidth: 2,
}, },
submit: { submit: {
width: '40%', width: '40%',
marginTop: config.deviceWidth * 0.055, marginTop: config.deviceWidth * 0.055,
borderColor:'white',
borderWidth: 2,
borderRadius: 5,
}, },
viewMain: { viewMain: {
width: '20%', width: '20%',
...@@ -115,7 +125,7 @@ export default StyleSheet.create({ ...@@ -115,7 +125,7 @@ export default StyleSheet.create({
marginLeft: config.deviceHeight * 1.0, marginLeft: config.deviceHeight * 1.0,
}, },
buttonStyle: { buttonStyle: {
width: config.deviceWidth * 0.072, width: config.deviceWidth * 0.075,
alignItems: 'center', alignItems: 'center',
backgroundColor: 'white', backgroundColor: 'white',
borderRightWidth: 1, borderRightWidth: 1,
...@@ -123,7 +133,7 @@ export default StyleSheet.create({ ...@@ -123,7 +133,7 @@ export default StyleSheet.create({
borderBottomWidth: 1, borderBottomWidth: 1,
}, },
selectedKeywordStyle: { selectedKeywordStyle: {
width: config.deviceWidth * 0.072, width: config.deviceWidth * 0.075,
alignItems: 'center', alignItems: 'center',
backgroundColor: '#EEA1E1', backgroundColor: '#EEA1E1',
borderRightWidth: 1, borderRightWidth: 1,
...@@ -133,25 +143,25 @@ export default StyleSheet.create({ ...@@ -133,25 +143,25 @@ export default StyleSheet.create({
buttonB1: { buttonB1: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.047, marginLeft: config.deviceWidth * 0.048,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
buttonB2: { buttonB2: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
width: '5%', width: '5%',
marginLeft: config.deviceWidth * 0.119, marginLeft: config.deviceWidth * 0.123,
position: 'absolute', position: 'absolute',
}, },
buttonB3: { buttonB3: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
width: '5%', width: '5%',
marginLeft: config.deviceWidth * 0.26, marginLeft: config.deviceWidth * 0.275,
position: 'absolute', position: 'absolute',
}, },
...@@ -159,81 +169,81 @@ export default StyleSheet.create({ ...@@ -159,81 +169,81 @@ export default StyleSheet.create({
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.335, marginLeft: config.deviceWidth * 0.348,
position: 'absolute', position: 'absolute',
}, },
buttonB5: { buttonB5: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginBottom: 10, marginBottom: 10,
marginLeft: config.deviceWidth * 0.406, marginLeft: config.deviceWidth * 0.423,
position: 'absolute', position: 'absolute',
}, },
SbuttonB1: { SbuttonB1: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.047, marginLeft: config.deviceWidth * 0.048,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
SbuttonB2: { SbuttonB2: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
width: '5%', width: '5%',
marginLeft: config.deviceWidth * 0.119, marginLeft: config.deviceWidth * 0.123,
position: 'absolute', position: 'absolute',
}, },
SbuttonB3: { SbuttonB3: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
width: '5%', width: '5%',
marginLeft: config.deviceWidth * 0.26, marginLeft: config.deviceWidth * 0.275,
position: 'absolute', position: 'absolute',
}, },
SbuttonB4: { SbuttonB4: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.335, marginLeft: config.deviceWidth * 0.348,
position: 'absolute', position: 'absolute',
}, },
SbuttonB5: { SbuttonB5: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.406, marginLeft: config.deviceWidth * 0.423,
position: 'absolute', position: 'absolute',
}, },
buttonB11: { buttonB11: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.55, marginLeft: config.deviceWidth * 0.575,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
buttonB21: { buttonB21: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.623, marginLeft: config.deviceWidth * 0.65,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
buttonB31: { buttonB31: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.767, marginLeft: config.deviceWidth * 0.798,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
...@@ -242,57 +252,57 @@ export default StyleSheet.create({ ...@@ -242,57 +252,57 @@ export default StyleSheet.create({
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.839, marginLeft: config.deviceWidth * 0.872,
position: 'absolute', position: 'absolute',
}, },
buttonB51: { buttonB51: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginBottom: 10, marginBottom: 10,
marginLeft: config.deviceWidth * 0.91, marginLeft: config.deviceWidth * 0.95,
position: 'absolute', position: 'absolute',
}, },
SbuttonB11: { SbuttonB11: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.55, marginLeft: config.deviceWidth * 0.575,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
SbuttonB21: { SbuttonB21: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.623, marginLeft: config.deviceWidth * 0.65,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
SbuttonB31: { SbuttonB31: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.767, marginLeft: config.deviceWidth * 0.798,
width: '5%', width: '5%',
position: 'absolute', position: 'absolute',
}, },
SbuttonB41: { SbuttonB41: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.839, marginLeft: config.deviceWidth * 0.872,
position: 'absolute', position: 'absolute',
}, },
SbuttonB51: { SbuttonB51: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'blue', backgroundColor: '#92ddea',
width: '5%', width: '5%',
height: '65%', height: '55%',
marginLeft: config.deviceWidth * 0.91, marginLeft: config.deviceWidth * 0.95,
position: 'absolute', position: 'absolute',
}, },
boxScore: { boxScore: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment