김서영 / searchGuide

Go to a project
Toggle navigation Toggle navigation pinning
김서영
ba8ec68b 1 parent 1b1853e2

start manual

Inline Side-by-side
Showing 1 changed file with 71 additions and 5 deletions
1 import React from 'react'; 1 import React from 'react';
2 -import { View,Text, StyleSheet } from 'react-native'; 2 +import { View,Text, StyleSheet, Button } 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 5
5 export default PromptSearch = () => { 6 export default PromptSearch = () => {
6 7
7 return( 8 return(
8 - <View style={styles.container} > 9 + <Swiper style={styles.wrapper} showsButtons={true} loop={false}>
10 + <FirstSlide />
11 + <SecondSlide />
12 + <ThirdSlide />
13 + <LastSlide />
14 + </Swiper>
15 +
16 + )
17 +}
18 +
19 +const FirstSlide = () => {
20 + <View style={styles.slide1} >
9 <Icon name='search' style={styles.icon} size={50} /> 21 <Icon name='search' style={styles.icon} size={50} />
10 <Text style={styles.text}>당신이 궁금해하는</Text> 22 <Text style={styles.text}>당신이 궁금해하는</Text>
11 <Text style={styles.text}>질문을 검색하세요</Text> 23 <Text style={styles.text}>질문을 검색하세요</Text>
12 <Text style={styles.subtext}>길잡이가 당신의</Text> 24 <Text style={styles.subtext}>길잡이가 당신의</Text>
13 <Text style={styles.subtext}>질문을 이해할거에요</Text> 25 <Text style={styles.subtext}>질문을 이해할거에요</Text>
14 </View> 26 </View>
15 - )
16 } 27 }
17 - 28 +const SecondSlide = () => {
29 + <View style={styles.slide2} >
30 + <Icon name='search' style={styles.icon} size={50} />
31 + <Text style={styles.text}>길잡이가 수정한</Text>
32 + <Text style={styles.text}>검색 키워드를 확인하세요</Text>
33 + <Text style={styles.subtext}>길잡이는 항상 최적의</Text>
34 + <Text style={styles.subtext}>검색키위드를 제안합니다</Text>
35 + </View>
36 +}
37 +const ThirdSlide = () => {
38 + <View style={styles.slide3} >
39 + <Icon name='search' style={styles.icon} size={50} />
40 + <Text style={styles.text}>검색 점수와 그래프로</Text>
41 + <Text style={styles.text}>검색능력을 체크하세요</Text>
42 + <Text style={styles.subtext}>길잡이는 당신의</Text>
43 + <Text style={styles.subtext}>검색능력 향상시킵니다</Text>
44 + </View>
45 +}
46 +const LastSlide = () => {
47 + <View style={styles.slide4} >
48 + <Icon name='search' style={styles.icon} size={50} />
49 + <Text style={styles.text}>내 손 안의 검색 도우미</Text>
50 + <Text style={styles.text}>길잡이에서</Text>
51 + <Text style={styles.text}>검색을 시작하세요</Text>
52 + <Button
53 + title="지금 바로 시작!"
54 + onPress={() => Alert.alert('Simple Button pressed')}
55 + />
56 + </View>
57 +}
18 58
19 const styles = StyleSheet.create({ 59 const styles = StyleSheet.create({
20 container: { 60 container: {
...@@ -39,5 +79,31 @@ const styles = StyleSheet.create({ ...@@ -39,5 +79,31 @@ const styles = StyleSheet.create({
39 fontSize: 20, 79 fontSize: 20,
40 fontWeight: 'bold', 80 fontWeight: 'bold',
41 color:'#999999', 81 color:'#999999',
42 - } 82 + },
83 + wrapper: {
84 + },
85 + slide1: {
86 + flex: 1,
87 + justifyContent: 'center',
88 + alignItems: 'center',
89 + backgroundColor: '#9DD6EB',
90 + },
91 + slide2: {
92 + flex: 1,
93 + justifyContent: 'center',
94 + alignItems: 'center',
95 + backgroundColor: '#97CAE5',
96 + },
97 + slide3: {
98 + flex: 1,
99 + justifyContent: 'center',
100 + alignItems: 'center',
101 + backgroundColor: '#92BBD9',
102 + },
103 + slide4: {
104 + flex: 1,
105 + justifyContent: 'center',
106 + alignItems: 'center',
107 + backgroundColor: '#FFF',
108 + },
43 }); 109 });
...\ No newline at end of file ...\ No newline at end of file
......