Skip to content

P
pianoApp
Commit 31faf1ff authored by norhalimah's avatar norhalimah
Browse files
Options

update

parent 4a8f1f62
Show whitespace changes
Inline Side-by-side
Showing with 685 additions and 3 deletions
.vscode/settings.json 0 → 100644
View file @ 31faf1ff
{
"java.configuration.updateBuildConfiguration": "automatic"
}
\ No newline at end of file
App.js
View file @ 31faf1ff
...@@ -13,6 +13,7 @@ import LogBookScale from './screens/logbookScale'; ...@@ -13,6 +13,7 @@ import LogBookScale from './screens/logbookScale';
import LogBookListen from './screens/logbookListen'; import LogBookListen from './screens/logbookListen';
import Home from './screens/home'; import Home from './screens/home';
import Quiz from './screens/quiz'; import Quiz from './screens/quiz';
import MetronomeSkill from './screens/metronome';
import Orientation from 'react-native-orientation'; import Orientation from 'react-native-orientation';
const Stack = createStackNavigator(); const Stack = createStackNavigator();
...@@ -174,6 +175,31 @@ class App extends React.PureComponent { ...@@ -174,6 +175,31 @@ class App extends React.PureComponent {
/> />
<Stack.Screen <Stack.Screen
name="4" name="4"
component={MetronomeSkill}
options={({navigation}) => ({
//title: 'C Major',
headerStyle: {
backgroundColor: '#E07EF9',
},
headerTintColor: '#fff',
title: '',
headerTransparent: true,
headerBackImage: () => (
<Icon
name="chevron-left"
type="font-awesome"
size={26}
color="black"
onPress={() => {
navigation.navigate('1');
Orientation.lockToPortrait();
}}
/>
),
})}
/>
<Stack.Screen
name="5"
component={LogBook} component={LogBook}
options={{ options={{
title: 'Records', title: 'Records',
...@@ -189,7 +215,7 @@ class App extends React.PureComponent { ...@@ -189,7 +215,7 @@ class App extends React.PureComponent {
}} }}
/> />
<Stack.Screen <Stack.Screen
name="5" name="6"
component={Settings} component={Settings}
options={{ options={{
title: 'Settings ', title: 'Settings ',
......
android/app/src/main/java/com/pianoapp/MainActivity.java
View file @ 31faf1ff
...@@ -3,6 +3,7 @@ package com.pianoapp; ...@@ -3,6 +3,7 @@ package com.pianoapp;
import android.content.Intent; // <--- import import android.content.Intent; // <--- import
import android.content.res.Configuration; // <--- import import android.content.res.Configuration; // <--- import
import com.facebook.react.ReactActivity; import com.facebook.react.ReactActivity;
//import com.reactlibrary.RNMetronomePackage;
public class MainActivity extends ReactActivity { public class MainActivity extends ReactActivity {
......
android/app/src/main/java/com/pianoapp/MainApplication.java
View file @ 31faf1ff
...@@ -4,6 +4,10 @@ import android.app.Application; ...@@ -4,6 +4,10 @@ import android.app.Application;
import android.content.Context; import android.content.Context;
import com.facebook.react.PackageList; import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication; import com.facebook.react.ReactApplication;
//import com.reactlibrary.RNMetronomePackage;
//import com.reactlibrary.RNMetronomePackage;
//import com.reactlibrary.RNMetronomePackage;
//import com.reactlibrary.RNMetronomePackage;
import com.reactnativecommunity.asyncstorage.AsyncStoragePackage; import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
import com.zmxv.RNSound.RNSoundPackage; import com.zmxv.RNSound.RNSoundPackage;
import com.zmxv.RNSound.RNSoundPackage; import com.zmxv.RNSound.RNSoundPackage;
......
android/settings.gradle
View file @ 31faf1ff
rootProject.name = 'PianoApp' rootProject.name = 'PianoApp'
include ':react-native-metronome'
project(':react-native-metronome').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-metronome/android')
include ':react-native-metronome'
project(':react-native-metronome').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-metronome/android')
include ':react-native-metronome'
project(':react-native-metronome').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-metronome/android')
include ':@react-native-async-storage_async-storage' include ':@react-native-async-storage_async-storage'
project(':@react-native-async-storage_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-async-storage/async-storage/android') project(':@react-native-async-storage_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-async-storage/async-storage/android')
include ':react-native-sound' include ':react-native-sound'
......
ios/Podfile
View file @ 31faf1ff
...@@ -18,6 +18,8 @@ target 'PianoApp' do ...@@ -18,6 +18,8 @@ target 'PianoApp' do
pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-async-storage/async-storage' pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-async-storage/async-storage'
pod 'RNMetronome', :path => '../node_modules/react-native-metronome'
target 'PianoAppTests' do target 'PianoAppTests' do
inherit! :complete inherit! :complete
# Pods for testing # Pods for testing
......
package.json
View file @ 31faf1ff
...@@ -34,7 +34,8 @@ ...@@ -34,7 +34,8 @@
"react-native-sound": "^0.11.0", "react-native-sound": "^0.11.0",
"react-native-stopwatch-timer": "^0.0.21", "react-native-stopwatch-timer": "^0.0.21",
"react-native-super-grid": "^4.0.3", "react-native-super-grid": "^4.0.3",
"react-native-vector-icons": "^7.1.0" "react-native-vector-icons": "^7.1.0",
"swipeable-modal-react-native": "^1.0.8"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.12.9", "@babel/core": "^7.12.9",
......
screens/home.js
View file @ 31faf1ff
...@@ -68,13 +68,22 @@ class Home extends React.PureComponent { ...@@ -68,13 +68,22 @@ class Home extends React.PureComponent {
onPress={() => this.props.navigation.navigate('4')}> onPress={() => this.props.navigation.navigate('4')}>
<Image <Image
style={styles.image2} style={styles.image2}
source={require('../media/img/metronome.png')}
/>
<Text style={styles.textmenu}>{'\n'}Metronome</Text>
</TouchableOpacity>
<TouchableOpacity
style={styles.menu}
onPress={() => this.props.navigation.navigate('5')}>
<Image
style={styles.image2}
source={require('../media/img/records.png')} source={require('../media/img/records.png')}
/> />
<Text style={styles.textmenu}>{'\n'}Records</Text> <Text style={styles.textmenu}>{'\n'}Records</Text>
</TouchableOpacity> </TouchableOpacity>
<TouchableOpacity <TouchableOpacity
style={styles.menu} style={styles.menu}
onPress={() => this.props.navigation.navigate('5')}> onPress={() => this.props.navigation.navigate('6')}>
<Image <Image
style={styles.image3} style={styles.image3}
source={require('../media/img/settings.png')} source={require('../media/img/settings.png')}
......
screens/metronome.js 0 → 100644
View file @ 31faf1ff
/* eslint-disable prettier/prettier */
/* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */
/* eslint-disable prettier/prettier */
import React from 'react';
import {
ImageBackground,
Text,
View,
StatusBar,
TouchableHighlight,
Button,
Image,
// Alert,
Modal,
TouchableOpacity,
BackHandler,
Pressable,
TextInput,
SafeAreaView,
Dimensions,
ScrollView,
} from 'react-native';
import Orientation from 'react-native-orientation';
import styles from '../style/styleMetronome';
import Sound from 'react-native-sound';
//import RNMetronome from 'react-native-metronome';
const playIcon = require('../media/img/play.png');
const stopIcon = require('../media/img/stop.png');
const leftIcon = require('../media/img/left.png');
const rightIcon = require('../media/img/right.png');
const settingsIcon = require('../media/img/settings.png');
const listIcon = require('../media/img/list.png');
const config = {
deviceWidth: Dimensions.get('window').width,
deviceHeight: Dimensions.get('window').height,
};
class MetronomeSkill extends React.Component {
constructor(props) {
super(props);
Sound.setCategory('Playback'); // true = mixWithOthers
this.state = {
logbook: [],
index:0,
correct: 0,
wrong: 0,
keywordsList: '',
count: 1,
name : '',
start : true,
showC : false,
showW : false,
showDone : false,
showSet : false,
showList: false,
showNotes: false,
maxCount : 5,
records: [],
bpm: 80,
soundNumber: 0,
showImg: true,
};
}
toggleKeyword = (keyword) => {
console.log(keyword);
};
onSubmit = () => {
console.log('Submit');
};
homeExit = async () => {
this.props.navigation.navigate('1');
};
backAction = () => {
//this.setState({showDone: false, showQuit: false});
this.props.navigation.navigate('1');
Orientation.lockToPortrait();
};
componentDidMount() {
//this.removeArray();
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
Orientation.lockToPortrait();
// this.displayData();
}
componentWillUnmount() {
this.removeArray();
BackHandler.removeEventListener('hardwareBackPress', this.homeExit);
//clearInterval(this.interval);
// Orientation.lockToLandscape();
}
';';
//reset
removeArray = () => {
console.log('Remove');
};
renderImage(){
var imgSource = this.state.showImg ? playIcon : stopIcon;
return (
<Image
style={{height:150, width:150}}
source={imgSource}
/>
);
}
setExit = async () => {
this.setState({showSet: false});
};
modalSet = () => {
console.log('Settings');
this.setState({showSet: true});
BackHandler.addEventListener('hardwareBackPress', this.setExit);
// BackHandler.removeEventListener('hardwareBackPress', this.setExit);
};
render() {
return (
<View style={{flex: 1}}>
<ImageBackground
source={require('../media/img/background.jpg')}
style={styles.imagebackground}>
{/* Modal 1*/}
<Modal transparent={true} visible={this.state.showSet} animationType="none">
<View style={{ backgroundColor: '#545252',marginTop:275,height:'65%', width:'93%', marginRight:30}}>
<SafeAreaView>
<View style={{alignItems: 'center', marginTop:10}}><Text style={{ fontSize:25, color: 'gray'}}>Settings</Text>
</View>
<ScrollView>
<View
style={{ flexDirection: 'column',
flexWrap: 'wrap',
width: config.deviceWidth,
marginLeft: config.deviceWidth * 0.04,
marginRight: config.deviceWidth * 0.1,
marginBottom: config.deviceHeight * 0.12}}>
<Text style={{fontSize:20, margin:10}}>Tone</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Visual Block</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Tempo Calculation</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>UI Sound Effect</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Mute Reminder</Text>
</View>
</ScrollView>
<View style={{alignItems: 'center', height:'30%'}}>
<TouchableOpacity style={{backgroundColor:'white', width:'15%', height:'15%',borderRadius:5}} onPress={() => this.setState({showSet: false})}>
<Text style={{marginLeft:10}}>Back</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
</View>
</Modal>
{/* Modal 2*/}
<Modal transparent={true} visible={this.state.showList} animationType="none">
<View style={{ backgroundColor: '#545252',marginTop:275,height:'65%', width:'93%', marginLeft:30}}>
<SafeAreaView>
<View style={{alignItems: 'center', marginTop:10}}><Text style={{ fontSize:25, color: 'gray'}}>List</Text>
</View>
<ScrollView>
<View
style={{ flexDirection: 'column',
flexWrap: 'wrap',
width: config.deviceWidth,
marginLeft: config.deviceWidth * 0.04,
marginRight: config.deviceWidth * 0.1,
marginBottom: config.deviceHeight * 0.12}}>
<Text style={{fontSize:20, margin:10}}>Tone</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Visual Block</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Tempo Calculation</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>UI Sound Effect</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Mute Reminder</Text>
</View>
</ScrollView>
<View style={{alignItems: 'center', height:'30%'}}>
<TouchableOpacity style={{backgroundColor:'white', width:'15%', height:'15%',borderRadius:5}} onPress={() => this.setState({showList: false})}>
<Text style={{marginLeft:10}}>Back</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
</View>
</Modal>
{/* Modal 3*/}
<Modal transparent={true} visible={this.state.showNotes} animationType="none">
<View style={{ backgroundColor: '#545252',marginTop:275,height:'60%', width:'100%', borderTopRightRadius: 30, borderTopLeftRadius: 30}}>
<SafeAreaView>
<View style={{alignItems: 'center', marginTop:10}}><Text style={{ fontSize:25, color: 'gray'}}>Notes</Text>
</View>
<ScrollView>
<View
style={{ flexDirection: 'column',
flexWrap: 'wrap',
width: config.deviceWidth,
marginLeft: config.deviceWidth * 0.04,
marginRight: config.deviceWidth * 0.1,
marginBottom: config.deviceHeight * 0.12}}>
<Text style={{fontSize:20, margin:10}}>Tone</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Visual Block</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Tempo Calculation</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>UI Sound Effect</Text>
<View style={{borderWidth:3, borderColor:'black', width:'85%'}}/>
<Text style={{fontSize:20, margin:10}}>Mute Reminder</Text>
</View>
</ScrollView>
<View style={{alignItems: 'center', height:'30%'}}>
<TouchableOpacity style={{backgroundColor:'white', width:'15%', height:'15%',borderRadius:5}} onPress={() => this.setState({showNotes: false})}>
<Text style={{marginLeft:10}}>Back</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
</View>
</Modal>
<StatusBar hidden />
<SafeAreaView>
<View style={{height: '70%',marginTop:50}}>
<View style={{height:'60%', width:'100%'}}>
<View style={{alignItems:'center'}}>
<View style={{backgroundColor:'white', height:'80%', width:'95%', marginLeft:10, marginRight:10, marginTop:40, borderRadius:10}}>
<View style={{flexDirection: 'row', marginTop:8, marginLeft:30, marginRight:15, justifyContent: 'space-between'}}>
<Text>TEMPO</Text>
<Text/>
<Text style={{marginLeft:120}}>T.S</Text>
<Text>SUB DIV.</Text>
</View>
<View style={{flexDirection: 'row', marginTop:1, marginLeft:30, marginRight:15, justifyContent: 'space-between'}}>
<Text style={{fontSize:40}}>75</Text>
<Text style={{fontSize:20, marginTop:20, marginRight:30,marginLeft:5}}>Andante</Text>
<Text style={{fontSize:40, marginRight:25}}>4/4</Text>
<Text style={{fontSize:40, marginRight:10}}>@</Text>
</View>
<View style={{flexDirection: 'row', marginLeft:10, marginRight:10, justifyContent: 'space-between'}}>
<TouchableOpacity style={{backgroundColor:'darkmagenta',borderColor:'darkorchid', borderWidth:3,width:'20%', height:'200%'}}><Text/></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'darkmagenta',borderColor:'darkorchid', borderWidth:3,width:'20%', height:'200%'}}><Text/></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'darkmagenta',borderColor:'darkorchid', borderWidth:3,width:'20%', height:'200%'}}><Text/></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'darkmagenta',borderColor:'darkorchid', borderWidth:3,width:'20%', height:'200%'}}><Text/></TouchableOpacity>
</View>
<View style={{flexDirection: 'row', marginTop:25, marginLeft:10, marginRight:10, justifyContent: 'space-between'}}>
<TouchableOpacity style={{backgroundColor:'grey',width:'100%', height:'180%'}}><Text/></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'#129da6', height:'180%', width:'8%', position: 'absolute'}}><Text/></TouchableOpacity>
</View>
</View>
</View>
</View>
<View style={{borderWidth:3, borderColor:'black', width:'100%'}}/>
<View style={{backgroundColor:'gray', height: '125%', width:'100%'}}>
<View style={{flexDirection: 'row', marginTop: config.deviceHeight * 0.03}}>
<TouchableOpacity style={{backgroundColor:'#7097A6', width:'15%', height:'135%', marginLeft : config.deviceWidth * 0.05, marginRight : config.deviceWidth * 0.6, borderRadius:8}} onPress={this.modalSet}>
<Image style={{height:35, width:35, alignItems: 'center', marginLeft:10, marginTop:10}} source={settingsIcon}/></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'#7097A6', width:'15%', height:'135%',borderRadius:8}} onPress={() => this.setState({showList: true})}>
<Image style={{height:35, width:35, alignItems: 'center', marginLeft:10, marginTop:10}} source={listIcon}/>
</TouchableOpacity>
</View>
<View style={{marginTop: config.deviceHeight * 0.01, alignItems:'center'}}>
<TouchableOpacity style={{backgroundColor:'#AAACAD',borderColor:'white',borderWidth:3, padding:130, borderRadius:200, position: 'absolute'}}><Text>1</Text></TouchableOpacity>
<TouchableOpacity style={{position: 'absolute',top:18, right: config.deviceWidth * 0.5}}><Image style={{height:252, width:110}} source={leftIcon}/></TouchableOpacity>
<TouchableOpacity style={{position: 'absolute',top:19, left:config.deviceWidth * 0.5}}><Image style={{height:250, width:110}} source={rightIcon}/></TouchableOpacity>
<TouchableOpacity style={{position: 'absolute',top:60}} onPress={ () => this.setState({ showImg: !this.state.showImg }) } >{this.renderImage()}</TouchableOpacity>
</View>
<View style={{flexDirection: 'row', marginTop: config.deviceHeight * 0.4}}>
<TouchableOpacity style={{backgroundColor:'#7097A6', width:'20%', height:'120%', marginLeft : config.deviceWidth * 0.05, marginRight : config.deviceWidth * 0.51, borderRadius:8,alignItems: 'center'}} onPress={() => this.setState({showNotes: true})}><Text style={{fontSize:35, marginTop:10}}>4/4</Text></TouchableOpacity>
<TouchableOpacity style={{backgroundColor:'#7097A6', width:'20%', height:'120%', borderRadius:8,alignItems: 'center'}} onPress={() => this.setState({showNotes: true})}><Text style={{fontSize:35, marginTop:10}}>TAP</Text></TouchableOpacity>
</View>
</View>
</View>
</SafeAreaView>
</ImageBackground>
</View>
);
}
}
export default MetronomeSkill;
style/styleMetronome.js 0 → 100644
View file @ 31faf1ff
/* eslint-disable prettier/prettier */
import {StyleSheet, Dimensions} from 'react-native';
import config from './config';
export default StyleSheet.create({
imagebackground: {
width: '100%',
height: '100%',
},
//Modal Quit
modalbackground: {
backgroundColor: '#000000aa',
flex: 1,
},
viewmodalQ: {
marginLeft: Dimensions.get('window').height * 0.3,
width : Dimensions.get('window').height * 0.4,
height : Dimensions.get('window').width * 0.35,
marginTop : Dimensions.get('window').width * 0.25,
alignItems: 'center',
backgroundColor:'white',
borderRadius: 10,
borderColor: 'black',
borderWidth: 5,
},
textquit: {
fontSize: 25,
fontFamily: 'sans-serif',
textAlign: 'center',
marginTop: 5,
color:'black',
},
viewmodalQQ : {
alignItems: 'center',
flexDirection: 'row',
marginTop:15,
},
buttonyes: {
backgroundColor: 'white',
padding: 15,
borderRadius: 10,
marginTop:10,
marginBottom:10,
borderTopColor:'black',
borderRightColor:'black',
borderWidth: 3,
marginRight:5,
},
buttonno: {
backgroundColor: 'white',
paddingLeft: 18,
paddingRight: 18,
paddingTop: 15,
paddingBottom: 15,
borderRadius: 10,
marginTop:10,
marginBottom:10,
borderWidth: 3,
borderTopColor:'black',
marginLeft:5,
},
textqq: {
color: 'black',
fontFamily: 'sans-serif',
},
// Modal Correct and Wrong
viewmodalCW: {
marginLeft: Dimensions.get('window').height * 0.25,
width : Dimensions.get('window').height * 0.4,
alignItems: 'center',
},
imagecw: {
width: '130%',
height: '95%',
},
textcw: {
fontSize: 25,
fontFamily: 'sans-serif',
textAlign: 'center',
marginTop:Dimensions.get('window').width * 0.43,
marginLeft:120,
color:'white',
},
viewbutton: {
alignItems: 'center',
marginLeft:120,
},
buttonc: {
backgroundColor: 'white',
borderColor: 'black',
padding: 15,
borderRadius: 5,
marginTop:10,
marginBottom:10,
},
buttonok: {
color: 'black',
},
// Modal Done
viewmodalD: {
marginLeft: Dimensions.get('window').height * 0.3,
width : Dimensions.get('window').height * 0.4,
alignItems: 'center',
},
imagedone :{
width: '120%',
height: '98%',
},
viewmodalDD: {
alignItems: 'center',
marginLeft:70,
},
textwelldone: {
fontSize: 25,
fontFamily: 'sans-serif',
textAlign: 'center',
marginTop:Dimensions.get('window').width * 0.42,
marginLeft:65,
color:'white',
},
modaltextcorrect: {
fontSize: 15,
fontFamily: 'sans-serif',
marginLeft:65,
textAlign: 'center',
color: 'green',
},
modaltextwrong: {
fontSize: 15,
fontFamily: 'sans-serif',
marginLeft:65,
textAlign: 'center',
color: 'red',
},
c1: {
height: '70%',
alignItems: 'center',
borderColor: 'black',
marginTop:50,
},
cc1: {
flexDirection: 'row',
marginLeft: 0,
},
t: {
fontSize: 25,
fontFamily: 'sans-serif',
},
c2: {
flexDirection: 'row',
height: '35%',
marginLeft: 15,
marginRight:15,
},
t1: {
color: 'black',
paddingTop: 120,
},
button: {
flex: 7,
alignItems: 'center',
backgroundColor: 'white',
borderRightWidth: 1,
borderColor: 'black',
borderBottomWidth: 1,
},
b1: {
marginBottom: 25,
width: 200,
height: 50,
borderRadius: 15,
alignItems: 'center',
backgroundColor: 'purple',
},
buttonText: {
textAlign: 'center',
paddingTop: 15,
color: 'white',
fontSize: 15,
fontFamily: 'sans-serif',
},
logo: {
height: config.deviceWidth * 0.22,
width: config.deviceHeight * 0.5,
borderColor: 'black',
borderWidth: 3,
borderRadius: 10,
position: 'absolute',
marginTop: config.deviceWidth * 0.11,
backgroundColor:'white',
},
correct: {
width: 80,
textAlign: 'center',
paddingTop: 15,
color: 'white',
height: 60,
borderRadius: 10,
alignItems: 'center',
fontSize: 25,
marginRight: 10,
backgroundColor:'green',
borderColor:'white',
borderWidth: 2,
fontFamily: 'sans-serif',
},
wrong: {
width: 70,
height: 60,
borderRadius: 10,
borderColor:'white',
alignItems: 'center',
textAlign: 'center',
paddingTop: 15,
color: 'white',
fontSize: 25,
marginRight: 10,
backgroundColor:'red',
borderWidth: 2,
fontFamily: 'sans-serif',
},
timer: {
width: 65,
height: 60,
borderRadius: 10,
borderColor:'white',
alignItems: 'center',
textAlign: 'center',
paddingTop: 16,
color: 'white',
fontSize: 25,
backgroundColor:'black',
borderWidth: 2,
fontFamily: 'sans-serif',
},
submit: {
width: '40%',
marginTop: config.deviceHeight * 0.055,
borderColor:'white',
borderWidth: 2,
borderRadius: 5,
},
viewMain: {
width: '20%',
alignContent: 'flex-end',
marginLeft: 180,
marginTop: '173%',
position: 'absolute',
},
container: {
flex: 1,
},
textStyle: {
fontSize: 16,
padding: 8,
textAlign: 'center',
fontFamily: 'sans-serif',
},
buttonView: {
flexDirection: 'column',
marginLeft: config.deviceWidth * 1.0,
},
//White Notes
buttonStyle: {
width: config.deviceHeight * 0.075,
alignItems: 'center',
backgroundColor: 'white',
borderRightWidth: 1,
borderColor: 'black',
borderBottomWidth: 1,
},
selectedKeywordStyle: {
width: config.deviceWidth * 0.075,
alignItems: 'center',
backgroundColor: '#EEA1E1',
borderRightWidth: 1,
borderColor: 'black',
borderBottomWidth: 1,
},
//Black Notes
buttonB1: {
alignItems: 'center',
backgroundColor: 'black',
height: '55%',
width: '5%',
position: 'absolute',
},
SbuttonB1: {
alignItems: 'center',
backgroundColor: '#92ddea',
height: '55%',
width: '5%',
position: 'absolute',
},
});
yarn.lock
View file @ 31faf1ff
...@@ -6962,6 +6962,11 @@ supports-hyperlinks@^2.0.0: ...@@ -6962,6 +6962,11 @@ supports-hyperlinks@^2.0.0:
has-flag "^4.0.0" has-flag "^4.0.0"
supports-color "^7.0.0" supports-color "^7.0.0"
swipeable-modal-react-native@^1.0.8:
version "1.0.8"
resolved "https://registry.yarnpkg.com/swipeable-modal-react-native/-/swipeable-modal-react-native-1.0.8.tgz#432cd084470f5123938e5ed9ba219ca8887927ee"
integrity sha512-9mBkXbG6tASAslWpTNCHXw3orW2X3oORT9cqNiJ2u0xk8QK7JUu2NEwtDq+05RQ1RHj09w59E3eJMcBYGtosQg==
symbol-observable@1.0.1: symbol-observable@1.0.1:
version "1.0.1" version "1.0.1"
resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.0.1.tgz#8340fc4702c3122df5d22288f88283f513d3fdd4" resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.0.1.tgz#8340fc4702c3122df5d22288f88283f513d3fdd4"
......
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