Skip to content

P
pianoApp
Commit 87a83bd7 authored by norhalimah's avatar norhalimah
Browse files
Options

UI

parent 0bdc5be3
Show whitespace changes
Inline Side-by-side
Showing with 122 additions and 101 deletions
App.js
View file @ 87a83bd7
...@@ -64,7 +64,7 @@ function Settings() { ...@@ -64,7 +64,7 @@ function Settings() {
<TabTop.Navigator <TabTop.Navigator
tabBarOptions={{ tabBarOptions={{
indicatorStyle: { indicatorStyle: {
backgroundColor: '#3D9090', backgroundColor: 'transparent',
}, },
labelStyle: { labelStyle: {
fontSize: 14, fontSize: 14,
...@@ -167,6 +167,7 @@ class App extends React.PureComponent { ...@@ -167,6 +167,7 @@ class App extends React.PureComponent {
fontFamily: 'Gilroy-Bold', fontFamily: 'Gilroy-Bold',
fontSize: 20, fontSize: 20,
lineHeight: 25, lineHeight: 25,
marginLeft: '5%',
}, },
headerBackImage: () => ( headerBackImage: () => (
<Image <Image
...@@ -213,7 +214,7 @@ class App extends React.PureComponent { ...@@ -213,7 +214,7 @@ class App extends React.PureComponent {
fontFamily: 'Gilroy-Bold', fontFamily: 'Gilroy-Bold',
fontSize: 20, fontSize: 20,
lineHeight: 25, lineHeight: 25,
marginHorizontal: Dimensions.get('window').width * 0.2, marginHorizontal: Dimensions.get('window').width * 0.22,
}, },
headerBackImage: () => ( headerBackImage: () => (
<Image style={{height: 50, width: 50}} source={closeIcon} /> <Image style={{height: 50, width: 50}} source={closeIcon} />
......
screens/listening.js
View file @ 87a83bd7
...@@ -72,6 +72,7 @@ const rightIcon = require('../media/img/btn_right.png'); ...@@ -72,6 +72,7 @@ const rightIcon = require('../media/img/btn_right.png');
const leftIcon = require('../media/img/btn_left.png'); const leftIcon = require('../media/img/btn_left.png');
const playIcon = require('../media/img/btn_play.png'); const playIcon = require('../media/img/btn_play.png');
const closeIcon = require('../media/img/btn_close.png'); const closeIcon = require('../media/img/btn_close.png');
const playingIcon = require('../media/img/icon_ac8th_white.png');
const keySound = Listennotes; const keySound = Listennotes;
var soundN = ''; var soundN = '';
...@@ -526,7 +527,7 @@ class Listen extends React.Component { ...@@ -526,7 +527,7 @@ class Listen extends React.Component {
<TouchableOpacity style={styles.buttonPlayingP} <TouchableOpacity style={styles.buttonPlayingP}
onPress={() => this.playButton()}> onPress={() => this.playButton()}>
<View style={{flexDirection:'row'}}> <View style={{flexDirection:'row'}}>
<Image style={styles.playIconP} source={playIcon}/> <Image style={styles.playIconP} source={playingIcon}/>
<Text style={styles.textPlayingP}>Playing...</Text> <Text style={styles.textPlayingP}>Playing...</Text>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
...@@ -542,8 +543,10 @@ class Listen extends React.Component { ...@@ -542,8 +543,10 @@ class Listen extends React.Component {
<ScrollView style={styles.container} horizontal={true} scrollEnabled={true} showsHorizontalScrollIndicator={false} ref={(scroller) => {this.scroller = scroller;}}> <ScrollView style={styles.container} horizontal={true} scrollEnabled={true} showsHorizontalScrollIndicator={false} ref={(scroller) => {this.scroller = scroller;}}>
<View style={styles.screen}> <View style={styles.screen}>
<View style={styles.viewPages}> <View style={styles.viewPages}>
<Text style={[styles.textPages, {paddingHorizontal:width * 0.9}]}>1/4</Text> <View style={{marginLeft:width * 0.83, width: width * 0.2}}>
<TouchableOpacity onPress={this.scrollToB} style={{width: '25%', marginRight: width * 1}}> <Text style={[styles.textPages, {paddingHorizontal:width * 0.06}]}>1/4</Text>
</View>
<TouchableOpacity onPress={this.scrollToB}>
<Image style={styles.rightIcon} source={rightIcon}/> <Image style={styles.rightIcon} source={rightIcon}/>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
...@@ -661,10 +664,10 @@ class Listen extends React.Component { ...@@ -661,10 +664,10 @@ class Listen extends React.Component {
<ScrollView style={styles.container} horizontal={true} scrollEnabled={true} showsHorizontalScrollIndicator={false} ref={(scroller) => {this.scroller = scroller;}}> <ScrollView style={styles.container} horizontal={true} scrollEnabled={true} showsHorizontalScrollIndicator={false} ref={(scroller) => {this.scroller = scroller;}}>
<View style={styles.screen}> <View style={styles.screen}>
<View style={styles.viewPages}> <View style={styles.viewPages}>
<View style={{marginLeft:width * 0.85, width: width * 0.2, backgroundColor:'gray'}}> <View style={{marginLeft:width * 0.83, width: width * 0.2}}>
<Text style={[styles.textPages, {paddingHorizontal:width * 0.06}]}>1/4</Text> <Text style={[styles.textPages, {paddingHorizontal:width * 0.06}]}>1/4</Text>
</View> </View>
<TouchableOpacity onPress={this.scrollToB} style={{width: width * 0.2, marginLeft: width * 0.25, backgroundColor:'gray'}}> <TouchableOpacity onPress={this.scrollToB} style={{width: width * 0.2, marginLeft: width * 0.25}}>
<Image style={styles.rightIcon} source={rightIcon}/> <Image style={styles.rightIcon} source={rightIcon}/>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
......
screens/logbookListen.js
View file @ 87a83bd7
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
/* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */
import React from 'react'; import React from 'react';
import { import {
SafeAreaView, SafeAreaView,
Image, Image,
Text, Text,
View, View,
// eslint-disable-next-line no-unused-vars
ScrollView, ScrollView,
BackHandler, BackHandler,
FlatList,
Dimensions,
} from 'react-native'; } from 'react-native';
import styles from '../style/styleLogbook'; import styles from '../style/styleLogbook';
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
import Orientation from 'react-native-orientation'; import Orientation from 'react-native-orientation';
const pianoIcon = require('../media/img/icon_scalerecord.png'); const listenIcon = require('../media/img/icon_listenskillrecord.png');
class LogBookListen extends React.PureComponent { class LogBookListen extends React.PureComponent {
...@@ -48,38 +53,31 @@ class LogBookListen extends React.PureComponent { ...@@ -48,38 +53,31 @@ class LogBookListen extends React.PureComponent {
//Orientation.lockToPortrait(); //Orientation.lockToPortrait();
}; };
render() { render() {
return ( return (
<View style={[styles.container, {backgroundColor:'#81C9C9'}]}> <View style={[styles.container, {backgroundColor:'#F7F7F7'}]}>
<SafeAreaView> <SafeAreaView>
<ScrollView <FlatList
style={styles.scroll}> data={this.state.logbook}
{this.state.logbook && this.state.logbook.map((item, id) => ( keyExtractor={(item) => item.id}
<View renderItem={({ item }) => (
key ={id} <View key ={item.id} style={styles.view1}>
style={styles.view1}> <Image style={{height:50, width:50, marginVertical:20}} source={listenIcon}/>
<View style={styles.icon}>
<Image style={{height:50, width:50, marginVertical:20}} source={pianoIcon}/>
</View>
<View style={[styles.details, {marginTop:20}]}> <View style={[styles.details, {marginTop:20}]}>
<Text style={styles.textcorrect}>{item.correct} of {item.correct + item.wrong} correct answers</Text> <Text style={styles.textcorrect}>{item.correct} of {item.correct + item.wrong} correct answers</Text>
<Text style={styles.texttimer}>Completed in {item.timer}</Text> <Text style={styles.texttimer}>Completed in {item.timer}</Text>
</View> </View>
<View style={[styles.datedays, {marginTop:20}]}> <View style={{flexDirection: 'column',width:Dimensions.get('window').width * 0.22, marginVertical:Dimensions.get('window').height * 0.033}}>
<View>
<Text style={styles.textdate1}>{item.date}</Text> <Text style={styles.textdate1}>{item.date}</Text>
</View>
<View>
<Text style={styles.texttime}>{item.time}</Text> <Text style={styles.texttime}>{item.time}</Text>
</View> </View>
</View> </View>
</View> )}
)).reverse()} />
</ScrollView>
</SafeAreaView> </SafeAreaView>
</View> </View>
); );
} }
} }
export default LogBookListen; export default LogBookListen;
......
screens/logbookScale.js
View file @ 87a83bd7
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
/* eslint-disable no-unused-vars */
/* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */
import React from 'react'; import React from 'react';
import { import {
SafeAreaView, SafeAreaView,
...@@ -8,6 +11,7 @@ import { ...@@ -8,6 +11,7 @@ import {
ScrollView, ScrollView,
BackHandler, BackHandler,
Image, Image,
FlatList,
} from 'react-native'; } from 'react-native';
import styles from '../style/styleLogbook'; import styles from '../style/styleLogbook';
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
...@@ -53,30 +57,23 @@ class LogBookScale extends React.PureComponent { ...@@ -53,30 +57,23 @@ class LogBookScale extends React.PureComponent {
return ( return (
<View style={[styles.container, {backgroundColor:'#F7F7F7'}]}> <View style={[styles.container, {backgroundColor:'#F7F7F7'}]}>
<SafeAreaView> <SafeAreaView>
<ScrollView <FlatList
style={styles.scroll}> data={this.state.logbook}
{this.state.logbook && this.state.logbook.map((item, id) => ( keyExtractor={(item) => item.id}
<View renderItem={({ item }) => (
key ={id} <View key ={item.id} style={styles.view1}>
style={styles.view1}>
<View style={styles.icon}>
<Image style={{height:50, width:50, marginVertical:20}} source={pianoIcon}/> <Image style={{height:50, width:50, marginVertical:20}} source={pianoIcon}/>
</View>
<View style={[styles.details, {marginTop:20}]}> <View style={[styles.details, {marginTop:20}]}>
<Text style={styles.textcorrect}>{item.correct} of {item.correct + item.wrong} correct answers</Text> <Text style={styles.textcorrect}>{item.correct} of {item.correct + item.wrong} correct answers</Text>
<Text style={styles.texttimer}>Completed in {item.timer}</Text> <Text style={styles.texttimer}>Completed in {item.timer}</Text>
</View> </View>
<View style={[styles.datedays, {marginTop:20}]}> <View style={styles.datedays}>
<View>
<Text style={styles.textdate1}>{item.date}</Text> <Text style={styles.textdate1}>{item.date}</Text>
</View>
<View>
<Text style={styles.texttime}>{item.time}</Text> <Text style={styles.texttime}>{item.time}</Text>
</View> </View>
</View> </View>
</View> )}
)).reverse()} />
</ScrollView>
</SafeAreaView> </SafeAreaView>
</View> </View>
); );
......
screens/quiz.js
View file @ 87a83bd7
...@@ -124,7 +124,7 @@ class Quiz extends React.Component { ...@@ -124,7 +124,7 @@ class Quiz extends React.Component {
} }
}); });
}); });
this.setState({click: false});
let list = keywordsList; let list = keywordsList;
let index = -1; let index = -1;
if ((index = keywordsList.indexOf(keyword.name)) !== -1) { if ((index = keywordsList.indexOf(keyword.name)) !== -1) {
...@@ -1050,7 +1050,7 @@ class Quiz extends React.Component { ...@@ -1050,7 +1050,7 @@ class Quiz extends React.Component {
</View> </View>
</View> </View>
<View style={{flexDirection: 'row', height: Dimensions.get('window').height * 0.4}}> <View style={{flexDirection: 'row', height: Dimensions.get('window').height * 0.45}}>
{NOTESWHITE.map((item, id) => ( {NOTESWHITE.map((item, id) => (
<TouchableHighlight style={keywordsList.find((element) => element === item.name) ? styles.whiteNotesButtonPress : styles.whiteNotesButton } <TouchableHighlight style={keywordsList.find((element) => element === item.name) ? styles.whiteNotesButtonPress : styles.whiteNotesButton }
onPress={() => this.toggleKeyword(item)} onPress={() => this.toggleKeyword(item)}
......
screens/settingListen.js
View file @ 87a83bd7
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
/* eslint-disable no-unused-vars */
/* eslint-disable prettier/prettier */
/* eslint-disable react-native/no-inline-styles */ /* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
import React from 'react'; import React from 'react';
import { import {
SafeAreaView, SafeAreaView,
ImageBackground,
Text, Text,
View, View,
Image,
ScrollView, ScrollView,
BackHandler, BackHandler,
Pressable, Pressable,
...@@ -15,11 +15,11 @@ import { ...@@ -15,11 +15,11 @@ import {
} from 'react-native'; } from 'react-native';
import styles from '../style/styleSettings'; import styles from '../style/styleSettings';
import Orientation from 'react-native-orientation'; import Orientation from 'react-native-orientation';
import Notes from './data'; //import Notes from './data';
import * as RNFS from 'react-native-fs'; import * as RNFS from 'react-native-fs';
import NumericInput from 'react-native-numeric-input'; import NumericInput from 'react-native-numeric-input';
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
import notesData from './dataNotes'; //import notesData from './dataNotes';
const octave = [ const octave = [
'Octave 1','Octave 2','Octave 3','Octave 4','Octave 5','Octave 6','Octave 7', 'Octave 1','Octave 2','Octave 3','Octave 4','Octave 5','Octave 6','Octave 7',
...@@ -151,13 +151,14 @@ export default class SettingsListen extends React.Component { ...@@ -151,13 +151,14 @@ export default class SettingsListen extends React.Component {
//Orientation.lockToPortrait(); //Orientation.lockToPortrait();
}; };
render() { render() {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<SafeAreaView> <SafeAreaView>
<View style={styles.view1}> <View style={styles.view1}>
<View> <View>
<Text style={styles.textques}>No. of Questions : </Text> <Text style={styles.textquesL}>No. of Questions : </Text>
</View> </View>
<View style={{marginHorizontal: Dimensions.get('window').width * 0.15}}> <View style={{marginHorizontal: Dimensions.get('window').width * 0.15}}>
<NumericInput <NumericInput
...@@ -180,13 +181,13 @@ export default class SettingsListen extends React.Component { ...@@ -180,13 +181,13 @@ export default class SettingsListen extends React.Component {
<View> <View>
<Text style={styles.textques2}>Major Lists</Text> <Text style={styles.textques2}>Major Lists</Text>
</View> </View>
<View> <View style={{flexDirection: 'row', marginLeft: Dimensions.get('window').width * 0.27, marginTop:'4%'}}>
<Text style={styles.textques3}> {this.state.listN.length}/7 octave are selected</Text> <Text style={styles.textques4}>{this.state.listN.length} </Text>
<Text style={styles.textques3}>/ 7 octave are selected</Text>
</View> </View>
</View> </View>
<ScrollView style={styles.scroll}>
<View <View
style={styles.view2}> style={styles.view3}>
{octave.map((item, id) => ( {octave.map((item, id) => (
<View key={id}> <View key={id}>
<Pressable <Pressable
...@@ -204,7 +205,6 @@ export default class SettingsListen extends React.Component { ...@@ -204,7 +205,6 @@ export default class SettingsListen extends React.Component {
</View> </View>
))} ))}
</View> </View>
</ScrollView>
</SafeAreaView> </SafeAreaView>
</View> </View>
); );
......
screens/settingScale.js
View file @ 87a83bd7
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
/* eslint-disable no-unused-vars */
/* eslint-disable prettier/prettier */
/* eslint-disable react-native/no-inline-styles */ /* eslint-disable react-native/no-inline-styles */
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
import React from 'react'; import React from 'react';
...@@ -173,8 +175,9 @@ export default class SettingsScale extends React.Component { ...@@ -173,8 +175,9 @@ export default class SettingsScale extends React.Component {
<View> <View>
<Text style={styles.textques2}>Major Lists</Text> <Text style={styles.textques2}>Major Lists</Text>
</View> </View>
<View> <View style={{flexDirection: 'row', marginLeft: Dimensions.get('window').width * 0.25, marginTop:'3.5%'}}>
<Text style={styles.textques3}>{this.state.listN.length}/28 major are selected</Text> <Text style={styles.textques4}>{this.state.listN.length} </Text>
<Text style={styles.textques3}>/ 28 major are selected</Text>
</View> </View>
</View> </View>
<ScrollView style={styles.scroll}> <ScrollView style={styles.scroll}>
......
style/styleListen.js
View file @ 87a83bd7
...@@ -418,7 +418,7 @@ playIconP: { ...@@ -418,7 +418,7 @@ playIconP: {
viewStopWatch:{ viewStopWatch:{
alignItems:'center', alignItems:'center',
width:height * 0.25, width:height * 0.25,
marginHorizontal:height * 0.064, marginLeft:height * 0.074,
marginTop:'3.5%', marginTop:'3.5%',
}, },
//stopwatch //stopwatch
...@@ -456,19 +456,19 @@ screen: { ...@@ -456,19 +456,19 @@ screen: {
}, },
screenA: { screenA: {
width: height, width: height,
height:width * 0.4, height:width * 0.42,
backgroundColor: '#F7CAC9', backgroundColor: '#F7CAC9',
flexDirection: 'row', flexDirection: 'row',
}, },
screenB: { screenB: {
width: height, width: height,
height:width * 0.4, height:width * 0.42,
backgroundColor: '#92A8D1', backgroundColor: '#92A8D1',
flexDirection: 'row', flexDirection: 'row',
}, },
screenC: { screenC: {
width:height, width:height,
height:width * 0.4, height:width * 0.42,
backgroundColor: '#88B04B', backgroundColor: '#88B04B',
flexDirection: 'row', flexDirection: 'row',
}, },
...@@ -487,7 +487,7 @@ textStyle:{ ...@@ -487,7 +487,7 @@ textStyle:{
fontFamily: 'Gilroy-Light', fontFamily: 'Gilroy-Light',
textAlign: 'left', textAlign: 'left',
lineHeight:14, lineHeight:14,
marginTop: height * 0.13, marginTop: height * 0.15,
}, },
textStyleB:{ textStyleB:{
color:'#FFFBF0', color:'#FFFBF0',
...@@ -517,7 +517,7 @@ buttonB1: { ...@@ -517,7 +517,7 @@ buttonB1: {
alignItems: 'center', alignItems: 'center',
backgroundColor: 'black', backgroundColor: 'black',
height: '55%', height: '55%',
width: '5%', width: '6%',
position: 'absolute', position: 'absolute',
}, },
SbuttonB1: { SbuttonB1: {
...@@ -525,7 +525,7 @@ SbuttonB1: { ...@@ -525,7 +525,7 @@ SbuttonB1: {
backgroundColor: '#FCE1FF', backgroundColor: '#FCE1FF',
height: '55%', height: '55%',
marginLeft: height * 0.048, marginLeft: height * 0.048,
width: '5%', width: '6%',
position: 'absolute', position: 'absolute',
}, },
...@@ -533,7 +533,7 @@ viewPages: { ...@@ -533,7 +533,7 @@ viewPages: {
backgroundColor:'#3B3A39', backgroundColor:'#3B3A39',
flexDirection:'row', flexDirection:'row',
width:height, width:height,
height:width * 0.12, height:width * 0.1,
}, },
textPages:{ textPages:{
color:'#FFFFFF', color:'#FFFFFF',
...@@ -544,16 +544,13 @@ textPages:{ ...@@ -544,16 +544,13 @@ textPages:{
fontSize:16, fontSize:16,
}, },
leftIcon:{ leftIcon:{
height:width * 0.03, height:'10%',
width:height * 0.03, width:'10%',
paddingHorizontal: height * 0.045,
paddingVertical: width * 0.052,
}, },
rightIcon:{ rightIcon:{
height:width * 0.03, height:'10%',
width:height * 0.03, width:'10%',
paddingHorizontal: height * 0.055,
paddingVertical: width * 0.052,
}, },
......
style/styleLogbook.js
View file @ 87a83bd7
/* eslint-disable prettier/prettier */ /* eslint-disable prettier/prettier */
import {Dimensions,StyleSheet} from 'react-native'; import {Dimensions,StyleSheet} from 'react-native';
//import config from './config'; const width = Dimensions.get('window').width;
export default StyleSheet.create({ export default StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
...@@ -20,30 +20,25 @@ export default StyleSheet.create({ ...@@ -20,30 +20,25 @@ export default StyleSheet.create({
borderWidth: 2, borderWidth: 2,
borderColor: 'white', borderColor: 'white',
}, },
imagebackground: {
width: '100%',
height: '100%',
},
scroll: {
marginTop: 0,
},
view1: { view1: {
flexDirection: 'row', flexDirection: 'row',
paddingLeft: 15, paddingHorizontal: width * 0.02,
paddingRight: 15, paddingBottom:5,
paddingBottom:10,
paddingTop:5, paddingTop:5,
marginTop:10, marginTop:10,
//backgroundColor: 'gray',
backgroundColor: '#FFFFFF', backgroundColor: '#FFFFFF',
width: Dimensions.get('window').width * 0.92, width: Dimensions.get('window').width * 0.93,
borderRadius:8, borderRadius:8,
}, },
icon: { icon: {
alignItems: 'center', alignItems: 'center',
}, },
datedays: { datedays: {
alignItems: 'center', flexDirection: 'column',
marginLeft:12, width:Dimensions.get('window').width * 0.22,
marginVertical:Dimensions.get('window').height * 0.033,
}, },
border: { border: {
borderWidth:1, borderWidth:1,
...@@ -51,13 +46,14 @@ export default StyleSheet.create({ ...@@ -51,13 +46,14 @@ export default StyleSheet.create({
}, },
details: { details: {
flexDirection: 'column', flexDirection: 'column',
marginLeft:5, marginLeft: width * 0.015,
marginRight: width * 0.015,
marginTop:10, marginTop:10,
}, },
textdate1 : { textdate1 : {
color:'#3B3A39', color:'#3B3A39',
fontFamily: 'Gilroy-Light', fontFamily: 'Gilroy-Light',
fontSize: 14, fontSize: 13,
textAlign: 'right', textAlign: 'right',
lineHeight: 16, lineHeight: 16,
}, },
...@@ -76,21 +72,21 @@ export default StyleSheet.create({ ...@@ -76,21 +72,21 @@ export default StyleSheet.create({
textcorrect: { textcorrect: {
color:'#14A76C', color:'#14A76C',
fontFamily: 'Gilroy-Bold', fontFamily: 'Gilroy-Bold',
fontSize: 16, fontSize: 15,
textAlign: 'left', textAlign: 'left',
lineHeight: 20, lineHeight: 20,
}, },
texttimer: { texttimer: {
color:'#3B3A39', color:'#3B3A39',
fontFamily: 'Gilroy-Bold', fontFamily: 'Gilroy-Bold',
fontSize: 14, fontSize: 13,
lineHeight: 18, lineHeight: 18,
textAlign: 'left', textAlign: 'left',
}, },
texttime: { texttime: {
color:'#3B3A39', color:'#3B3A39',
fontFamily: 'Gilroy-Light', fontFamily: 'Gilroy-Light',
fontSize: 14, fontSize: 13,
lineHeight: 16, lineHeight: 16,
textAlign: 'right', textAlign: 'right',
}, },
......
style/styleQuiz.js
View file @ 87a83bd7
...@@ -16,7 +16,7 @@ textTitle: { ...@@ -16,7 +16,7 @@ textTitle: {
fontSize: 20, fontSize: 20,
lineHeight: 25, lineHeight: 25,
marginLeft: height * 0.36, marginLeft: height * 0.36,
marginTop:width * 0.04, marginTop:width * 0.03,
}, },
closeIcon: { closeIcon: {
height: 50, height: 50,
...@@ -27,9 +27,9 @@ closeIcon: { ...@@ -27,9 +27,9 @@ closeIcon: {
viewSubmitButton:{ viewSubmitButton:{
flexDirection: 'row', flexDirection: 'row',
width:height * 0.2, width:height * 0.2,
marginBottom:width * 0.05, marginBottom:width * 0.07,
height:width * 0.15, height:width * 0.132,
marginLeft:height * 0.08, marginLeft:height * 0.17,
}, },
// clickSubmitButton () if true // clickSubmitButton () if true
buttonSubmitButtonT:{ buttonSubmitButtonT:{
...@@ -379,7 +379,7 @@ view1:{ ...@@ -379,7 +379,7 @@ view1:{
backgroundColor:'#FFFBF0', backgroundColor:'#FFFBF0',
flexDirection: 'row', flexDirection: 'row',
width:height, width:height,
height:width * 0.4, height:width * 0.45,
borderTopLeftRadius:8, borderTopLeftRadius:8,
borderTopRightRadius:8, borderTopRightRadius:8,
}, },
......
style/styleSettings.js
View file @ 87a83bd7
...@@ -78,6 +78,13 @@ export default StyleSheet.create({ ...@@ -78,6 +78,13 @@ export default StyleSheet.create({
marginHorizontal: config.deviceWidth * 0.292, marginHorizontal: config.deviceWidth * 0.292,
marginVertical: config.deviceHeight * 0.02, marginVertical: config.deviceHeight * 0.02,
}, },
textquesL: {
fontSize: 16,
fontFamily: 'Gilroy-Bold',
lineHeight: 20,
marginHorizontal: config.deviceWidth * 0.292,
marginVertical: config.deviceHeight * 0.03,
},
textques2: { textques2: {
fontSize: 16, fontSize: 16,
...@@ -91,9 +98,16 @@ export default StyleSheet.create({ ...@@ -91,9 +98,16 @@ export default StyleSheet.create({
fontSize: 14, fontSize: 14,
fontFamily: 'Gilroy', fontFamily: 'Gilroy',
lineHeight: 20, lineHeight: 20,
marginHorizontal: config.deviceWidth * 0.28, marginLeft:'0.3%',
marginVertical: config.deviceHeight * 0.02, },
textques4: {
fontSize: 14,
fontFamily: 'Gilroy',
lineHeight: 20,
color:'#3D9090',
}, },
scroll: { scroll: {
marginTop: '4%', marginTop: '4%',
backgroundColor: '#F7F7F7', backgroundColor: '#F7F7F7',
...@@ -102,7 +116,18 @@ export default StyleSheet.create({ ...@@ -102,7 +116,18 @@ export default StyleSheet.create({
flexDirection: 'row', flexDirection: 'row',
flexWrap: 'wrap', flexWrap: 'wrap',
justifyContent: 'space-between', justifyContent: 'space-between',
marginTop: config.deviceHeight * 0.03, marginTop: config.deviceHeight * 0.05,
marginLeft: config.deviceWidth * 0.027,
marginRight: config.deviceWidth * 0.027,
marginBottom: config.deviceHeight * 0.1,
},
view3: {
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'space-between',
marginTop: '7%',
backgroundColor: '#F7F7F7',
marginLeft: config.deviceWidth * 0.027, marginLeft: config.deviceWidth * 0.027,
marginRight: config.deviceWidth * 0.027, marginRight: config.deviceWidth * 0.027,
marginBottom: config.deviceHeight * 0.1, marginBottom: config.deviceHeight * 0.1,
...@@ -112,6 +137,7 @@ textname: { ...@@ -112,6 +137,7 @@ textname: {
fontFamily: 'Gilroy-Bold', fontFamily: 'Gilroy-Bold',
fontSize:16, fontSize:16,
lineHeight:20, lineHeight:20,
marginTop:'3%',
}, },
textnameOct: { textnameOct: {
textAlign: 'center', textAlign: 'center',
...@@ -122,7 +148,7 @@ textnameOct: { ...@@ -122,7 +148,7 @@ textnameOct: {
paddingVertical: config.deviceHeight * 0.02, paddingVertical: config.deviceHeight * 0.02,
}, },
image: { image: {
width: 115, width: config.deviceWidth * 0.275,
height: 115, height: config.deviceHeight * 0.13,
}, },
}); });
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