From 6ac89f37dbf27c96bb80e1a43da413219fc22d93 Mon Sep 17 00:00:00 2001 From: MedihaZukic Date: Sun, 24 Sep 2017 22:17:21 +0200 Subject: [PATCH] Navigation to swipe cards screen --- src/Router.js | 9 +++++++++ src/components/Lesson.js | 21 ++++++++++++++++++++- src/components/Question.js | 6 +++--- 3 files changed, 32 insertions(+), 4 deletions(-) diff --git a/src/Router.js b/src/Router.js index f9428c5..1047f8d 100644 --- a/src/Router.js +++ b/src/Router.js @@ -4,6 +4,7 @@ import Categories from './components/Categories'; import LessonCategories from './components/LessonCategories'; import AnatomyCard from './components/AnatomyCard'; import Lesson from './components/Lesson'; +import LessonItem from './components/LessonItem'; const RouterComponent = () => { const { headerTextStyle } = styles; @@ -38,6 +39,14 @@ const RouterComponent = () => { headerStyle={headerStyle('#7270a8')} headerTitleStyle={headerTextStyle} /> + + ); diff --git a/src/components/Lesson.js b/src/components/Lesson.js index d543818..8605580 100644 --- a/src/components/Lesson.js +++ b/src/components/Lesson.js @@ -1,13 +1,32 @@ import React from 'react'; import { View } from 'react-native'; +import { Actions } from 'react-native-router-flux'; import Question from './Question'; const Lesson = (props) => { const { categoriesContainerStyle, categoriesListStyle } = styles; + const onQuestionSelected = (questionText) => { + console.log(questionText); + Actions.lessonItem({ + cards: [ + { text: 'Nakon 3. ili 4. dana života dijete bi trebalo imati barem 6 mokrih pelena. Nakon što je sav mekonij izašao i stolica postala senfasta, sjemenasta i žuta, treba očekivati barem 3-4 pokakane pelene dnevno (veličine najmanje 2,5 cm). Nakon 6. tjedna života neka djeca kakaju znatno rjeđe, pa i pauziraju po nekoliko dana. To je također sasvim normalno. U slučaju da dijete nakon 5. dana starosti nema dovoljno mokrih i zaprljanih pelena, trebalo bi pogledati signale koji upućuju na probleme i odvesti dijete liječniku.', image: require('../../images/lesson-item-1.png') }, + { text: 'Card2', image: require('../../images/lesson-item-1.png') }, + { text: 'Card3', image: require('../../images/lesson-item-1.png') }, + { text: 'Card4', image: require('../../images/lesson-item-1.png') }, + { text: 'Card5', image: require('../../images/lesson-item-1.png') }, + { text: 'Card6', image: require('../../images/lesson-item-1.png') }, + ] } + ); + }; + // Render questions const renderQuestions = () => props.questions.map((question) => - ()); + ( (onQuestionSelected(questionText))} + />)); return ( diff --git a/src/components/Question.js b/src/components/Question.js index cda3dc5..67c955e 100644 --- a/src/components/Question.js +++ b/src/components/Question.js @@ -1,15 +1,15 @@ import React from 'react'; import { Text, TouchableOpacity } from 'react-native'; -const Question = (props) => { +const Question = ({ questionText, onQuestionSelected }) => { const { containerStyle, questionTextStyle } = styles; return ( console.log(props.questionText)} +onPress={() => onQuestionSelected(questionText)} style={containerStyle} > - {props.questionText} + {questionText} );