Showing
7 changed files
with
60 additions
and
31 deletions
| ... | @@ -2,8 +2,8 @@ | ... | @@ -2,8 +2,8 @@ |
| 2 | "devToolsPort": 19002, | 2 | "devToolsPort": 19002, |
| 3 | "expoServerPort": 19000, | 3 | "expoServerPort": 19000, |
| 4 | "packagerPort": 19001, | 4 | "packagerPort": 19001, |
| 5 | - "packagerPid": 18388, | 5 | + "packagerPid": 18068, |
| 6 | - "expoServerNgrokUrl": "https://cx-ky7.anonymous.searchguide.exp.direct", | 6 | + "expoServerNgrokUrl": "https://ru-c66.anonymous.searchguide.exp.direct", |
| 7 | - "packagerNgrokUrl": "https://packager.cx-ky7.anonymous.searchguide.exp.direct", | 7 | + "packagerNgrokUrl": "https://packager.ru-c66.anonymous.searchguide.exp.direct", |
| 8 | - "ngrokPid": 32168 | 8 | + "ngrokPid": 11840 |
| 9 | } | 9 | } | ... | ... |
| ... | @@ -12,7 +12,7 @@ const Home = ({searchResults}) => { | ... | @@ -12,7 +12,7 @@ const Home = ({searchResults}) => { |
| 12 | <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> | 12 | <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> |
| 13 | <SearchBar /> | 13 | <SearchBar /> |
| 14 | <ScrollView style={{marginBottom:10}}> | 14 | <ScrollView style={{marginBottom:10}}> |
| 15 | - { searchResults.length ? ( searchResults.map((searchResult, index) => ( | 15 | + {searchResults.length ? ( searchResults.map((searchResult, index) => ( |
| 16 | <SearchCard | 16 | <SearchCard |
| 17 | key={index} | 17 | key={index} |
| 18 | title={searchResult.title} | 18 | title={searchResult.title} |
| ... | @@ -20,9 +20,7 @@ const Home = ({searchResults}) => { | ... | @@ -20,9 +20,7 @@ const Home = ({searchResults}) => { |
| 20 | url={searchResult.url} | 20 | url={searchResult.url} |
| 21 | metric={Math.round(searchResult.confidence * 100)} | 21 | metric={Math.round(searchResult.confidence * 100)} |
| 22 | site={searchResult.site} | 22 | site={searchResult.site} |
| 23 | - />))) | 23 | + />))) : <PromptSearch />} |
| 24 | - : <PromptSearch /> | ||
| 25 | - } | ||
| 26 | </ScrollView> | 24 | </ScrollView> |
| 27 | </View> | 25 | </View> |
| 28 | ) | 26 | ) | ... | ... |
| 1 | import React from 'react'; | 1 | import React from 'react'; |
| 2 | -import { View,Text, StyleSheet, Button } from 'react-native'; | 2 | +import { View,Text, StyleSheet, Button,Alert } from 'react-native'; |
| 3 | import Icon from 'react-native-vector-icons/FontAwesome'; | 3 | import Icon from 'react-native-vector-icons/FontAwesome'; |
| 4 | import Swiper from 'react-native-swiper'; | 4 | import Swiper from 'react-native-swiper'; |
| 5 | +import { DARK_MAIN,LIGHT_MAIN, WHITE_MAIN} from 'react-native-dotenv'; | ||
| 5 | 6 | ||
| 6 | const FirstSlide = () => ( | 7 | const FirstSlide = () => ( |
| 7 | <View style={styles.slide1} > | 8 | <View style={styles.slide1} > |
| ... | @@ -16,9 +17,9 @@ const SecondSlide = () => ( | ... | @@ -16,9 +17,9 @@ const SecondSlide = () => ( |
| 16 | <View style={styles.slide2} > | 17 | <View style={styles.slide2} > |
| 17 | <Icon name='search' style={styles.icon} size={50} /> | 18 | <Icon name='search' style={styles.icon} size={50} /> |
| 18 | <Text style={styles.text}>길잡이가 수정한</Text> | 19 | <Text style={styles.text}>길잡이가 수정한</Text> |
| 19 | - <Text style={styles.text}>검색 키워드를 확인하세요</Text> | 20 | + <Text style={styles.text}>검색 문장을 확인하세요</Text> |
| 20 | <Text style={styles.subtext}>길잡이는 항상 최적의</Text> | 21 | <Text style={styles.subtext}>길잡이는 항상 최적의</Text> |
| 21 | - <Text style={styles.subtext}>검색키위드를 제안합니다</Text> | 22 | + <Text style={styles.subtext}>검색키워드를 제안합니다</Text> |
| 22 | </View> | 23 | </View> |
| 23 | ) | 24 | ) |
| 24 | const ThirdSlide = () => ( | 25 | const ThirdSlide = () => ( |
| ... | @@ -36,18 +37,17 @@ const LastSlide = () => ( | ... | @@ -36,18 +37,17 @@ const LastSlide = () => ( |
| 36 | <Text style={styles.text}>내 손 안의 검색 도우미</Text> | 37 | <Text style={styles.text}>내 손 안의 검색 도우미</Text> |
| 37 | <Text style={styles.text}>길잡이에서</Text> | 38 | <Text style={styles.text}>길잡이에서</Text> |
| 38 | <Text style={styles.text}>검색을 시작하세요</Text> | 39 | <Text style={styles.text}>검색을 시작하세요</Text> |
| 39 | - <Button | ||
| 40 | - title="지금 바로 시작!" | ||
| 41 | - onPress={() => Alert.alert('Simple Button pressed')} | ||
| 42 | - /> | ||
| 43 | </View> | 40 | </View> |
| 44 | ) | 41 | ) |
| 45 | 42 | ||
| 46 | export default PromptSearch = () => { | 43 | export default PromptSearch = () => { |
| 47 | return( | 44 | return( |
| 48 | <> | 45 | <> |
| 49 | - <Text>ssdd</Text> | 46 | + <Swiper style={styles.wrapper} |
| 50 | - <Swiper style={styles.wrapper} showsButtons={true} loop={false}> | 47 | + showsButtons={true} |
| 48 | + loop={false} height={400} | ||
| 49 | + activeDotColor={LIGHT_MAIN} | ||
| 50 | + > | ||
| 51 | <FirstSlide /> | 51 | <FirstSlide /> |
| 52 | <SecondSlide /> | 52 | <SecondSlide /> |
| 53 | <ThirdSlide /> | 53 | <ThirdSlide /> |
| ... | @@ -59,9 +59,7 @@ export default PromptSearch = () => { | ... | @@ -59,9 +59,7 @@ export default PromptSearch = () => { |
| 59 | 59 | ||
| 60 | const styles = StyleSheet.create({ | 60 | const styles = StyleSheet.create({ |
| 61 | container: { | 61 | container: { |
| 62 | - height: 270, | ||
| 63 | width: '100%', | 62 | width: '100%', |
| 64 | - display: 'flex', | ||
| 65 | alignItems: 'center', | 63 | alignItems: 'center', |
| 66 | justifyContent:'center', | 64 | justifyContent:'center', |
| 67 | }, | 65 | }, |
| ... | @@ -82,29 +80,30 @@ const styles = StyleSheet.create({ | ... | @@ -82,29 +80,30 @@ const styles = StyleSheet.create({ |
| 82 | color:'#999999', | 80 | color:'#999999', |
| 83 | }, | 81 | }, |
| 84 | wrapper: { | 82 | wrapper: { |
| 83 | + flex:1, | ||
| 85 | }, | 84 | }, |
| 86 | slide1: { | 85 | slide1: { |
| 87 | flex: 1, | 86 | flex: 1, |
| 88 | justifyContent: 'center', | 87 | justifyContent: 'center', |
| 89 | alignItems: 'center', | 88 | alignItems: 'center', |
| 90 | - backgroundColor: '#9DD6EB', | 89 | + backgroundColor: '#eee', |
| 91 | }, | 90 | }, |
| 92 | slide2: { | 91 | slide2: { |
| 93 | flex: 1, | 92 | flex: 1, |
| 94 | justifyContent: 'center', | 93 | justifyContent: 'center', |
| 95 | alignItems: 'center', | 94 | alignItems: 'center', |
| 96 | - backgroundColor: '#97CAE5', | 95 | + backgroundColor: '#eee', |
| 97 | }, | 96 | }, |
| 98 | slide3: { | 97 | slide3: { |
| 99 | flex: 1, | 98 | flex: 1, |
| 100 | justifyContent: 'center', | 99 | justifyContent: 'center', |
| 101 | alignItems: 'center', | 100 | alignItems: 'center', |
| 102 | - backgroundColor: '#92BBD9', | 101 | + backgroundColor: '#eee', |
| 103 | }, | 102 | }, |
| 104 | slide4: { | 103 | slide4: { |
| 105 | flex: 1, | 104 | flex: 1, |
| 106 | justifyContent: 'center', | 105 | justifyContent: 'center', |
| 107 | alignItems: 'center', | 106 | alignItems: 'center', |
| 108 | - backgroundColor: '#FFF', | 107 | + backgroundColor: '#eee', |
| 109 | }, | 108 | }, |
| 110 | }); | 109 | }); |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
| ... | @@ -43,12 +43,12 @@ export default RateBar = (props) => { | ... | @@ -43,12 +43,12 @@ export default RateBar = (props) => { |
| 43 | value: (100-(props.score.key+props.score.fix)), | 43 | value: (100-(props.score.key+props.score.fix)), |
| 44 | } | 44 | } |
| 45 | }]} | 45 | }]} |
| 46 | - style={{height:60, width:'90%'}} | 46 | + style={{height:50, width:'90%'}} |
| 47 | keys={['keyword','korean','rest']} | 47 | keys={['keyword','korean','rest']} |
| 48 | colors={['#ffaa5a','#2cc3c2','#ffffff']} | 48 | colors={['#ffaa5a','#2cc3c2','#ffffff']} |
| 49 | showGrid={ false } | 49 | showGrid={ false } |
| 50 | horizontal={ true } | 50 | horizontal={ true } |
| 51 | - contentInset={ { top: 10, bottom: 10 } } | 51 | + contentInset={ { top: 10 } } |
| 52 | valueAccessor={({ item, key }) => item[key].value} | 52 | valueAccessor={({ item, key }) => item[key].value} |
| 53 | /> | 53 | /> |
| 54 | <View style={styles.infoContainer}> | 54 | <View style={styles.infoContainer}> | ... | ... |
| 1 | import React, {useEffect} from 'react'; | 1 | import React, {useEffect} from 'react'; |
| 2 | -import { Surface, Text } from 'react-native-paper'; | 2 | +import { Surface, Text,Divider} from 'react-native-paper'; |
| 3 | -import { StyleSheet } from 'react-native'; | 3 | +import { View,StyleSheet } from 'react-native'; |
| 4 | import {connect} from 'react-redux'; | 4 | import {connect} from 'react-redux'; |
| 5 | import {load } from '../../reducers/search'; | 5 | import {load } from '../../reducers/search'; |
| 6 | import PromptSearchRate from '../PromptSearch/PromptSearchRate'; | 6 | import PromptSearchRate from '../PromptSearch/PromptSearchRate'; |
| ... | @@ -17,9 +17,16 @@ const RateLine = ({load,pastScore }) => { | ... | @@ -17,9 +17,16 @@ const RateLine = ({load,pastScore }) => { |
| 17 | return ( | 17 | return ( |
| 18 | <Surface style={styles.surface}> | 18 | <Surface style={styles.surface}> |
| 19 | {pastScore.length ? | 19 | {pastScore.length ? |
| 20 | - pastScore.map((elem,index)=> ( | 20 | + <> |
| 21 | - <Text key={index}>{elem}</Text> | 21 | + <Text style={styles.info}>최근 점수</Text> |
| 22 | - )) : <PromptSearchRate /> | 22 | + <View style={styles.scoreContainer}> |
| 23 | + {pastScore.map((elem,index)=> ( | ||
| 24 | + <Text key={index} style={styles.score}>{elem}</Text> | ||
| 25 | + ))} | ||
| 26 | + </View> | ||
| 27 | + <View style={styles.detail}><Text style={styles.new}>최근</Text><Text></Text></View> | ||
| 28 | + </> | ||
| 29 | + : <PromptSearchRate /> | ||
| 23 | } | 30 | } |
| 24 | </Surface> | 31 | </Surface> |
| 25 | ); | 32 | ); |
| ... | @@ -38,6 +45,29 @@ const styles = StyleSheet.create({ | ... | @@ -38,6 +45,29 @@ const styles = StyleSheet.create({ |
| 38 | marginTop: 10, | 45 | marginTop: 10, |
| 39 | marginBottom: 10, | 46 | marginBottom: 10, |
| 40 | }, | 47 | }, |
| 48 | + info:{ | ||
| 49 | + fontSize:25, | ||
| 50 | + fontWeight:'bold', | ||
| 51 | + marginBottom: 15 | ||
| 52 | + }, | ||
| 53 | + score:{ | ||
| 54 | + fontSize:20 | ||
| 55 | + }, | ||
| 56 | + scoreContainer:{ | ||
| 57 | + flexDirection:'row', | ||
| 58 | + justifyContent: 'space-around', | ||
| 59 | + width:'100%' | ||
| 60 | + }, | ||
| 61 | + detail:{ | ||
| 62 | + width:'100%', | ||
| 63 | + justifyContent:'space-around', | ||
| 64 | + | ||
| 65 | + }, | ||
| 66 | + new:{ | ||
| 67 | + fontSize: 18, | ||
| 68 | + marginLeft: 20, | ||
| 69 | + color:'#995432' | ||
| 70 | + } | ||
| 41 | }); | 71 | }); |
| 42 | 72 | ||
| 43 | const RateLineContainer = ( {load,pastScore } ) => ( | 73 | const RateLineContainer = ( {load,pastScore } ) => ( | ... | ... |
| ... | @@ -52,9 +52,11 @@ const RateSentence = ({originalText, fixedText, keywordText }) => { | ... | @@ -52,9 +52,11 @@ const RateSentence = ({originalText, fixedText, keywordText }) => { |
| 52 | }, | 52 | }, |
| 53 | Text:{ | 53 | Text:{ |
| 54 | fontSize: 25, | 54 | fontSize: 25, |
| 55 | + textAlign:'center' | ||
| 55 | }, | 56 | }, |
| 56 | infoText:{ | 57 | infoText:{ |
| 57 | fontSize: 20, | 58 | fontSize: 20, |
| 59 | + textAlign:'center' | ||
| 58 | } | 60 | } |
| 59 | }); | 61 | }); |
| 60 | 62 | ... | ... |
-
Please register or login to post a comment