diff --git a/App/app/Router.js b/App/app/Router.js index 6cae8a87..fc7db444 100755 --- a/App/app/Router.js +++ b/App/app/Router.js @@ -36,6 +36,7 @@ import Profile from "./screens/Profile"; import editCalendar from './screens/editCalendar'; import choosePath from './screens/choosePath'; import calendarDetail from './screens/calendarDetail'; +import FebradaDetail from './screens/FebradaDetail'; import resetPassword from './screens/resetPassword'; const navigationOptions = ({navigation}) => ({ @@ -202,6 +203,10 @@ const Stack = createStackNavigator({ calendarDetail: { screen: calendarDetail, }, + FebradaDetail: { + screen: FebradaDetail, + }, + resetPassword:{ screen:resetPassword diff --git a/App/app/screens/Eventos.js b/App/app/screens/Eventos.js index 11b7c73a..cfe0614a 100644 --- a/App/app/screens/Eventos.js +++ b/App/app/screens/Eventos.js @@ -1,5 +1,5 @@ import * as React from "react"; -import {View, StyleSheet, Dimensions, Text, Button, ScrollView, Image} from "react-native"; +import {View, StyleSheet, Dimensions, Text, Button, ScrollView, Image, TouchableOpacity} from "react-native"; import {TabView, TabBar, SceneMap} from "react-native-tab-view"; @@ -34,9 +34,10 @@ export default class Eventos extends React.Component { }; - renderFebrada = () => { + renderFebrada = (navigate) => { return ( + navigate('FebradaDetail')}> + ); @@ -98,10 +100,11 @@ export default class Eventos extends React.Component { }; render() { + const {navigate} = this.props.navigation; return ( - {this.renderFebrada()} + {this.renderFebrada(navigate)} {this.renderRally()} {this.renderCaching()} diff --git a/App/app/screens/FebradaDetail.js b/App/app/screens/FebradaDetail.js index a640e1c4..d2faf6cb 100644 --- a/App/app/screens/FebradaDetail.js +++ b/App/app/screens/FebradaDetail.js @@ -3,29 +3,23 @@ import { View, StyleSheet, Dimensions, - Image, ScrollView, Text, - Button, - TouchableOpacity, ImageBackground } from 'react-native'; -import {Divider, Icon, Avatar} from 'react-native-elements' -import {TabView, TabBar, SceneMap} from 'react-native-tab-view'; -import { - RkButton, RkCard, RkText, - RkTheme -} from 'react-native-ui-kitten'; -import Timeline from 'react-native-timeline-feed' - -import * as Progress from 'react-native-progress'; +import {Divider} from 'react-native-elements' +import AppIntroSlider from 'react-native-app-intro-slider'; import NavAbsolute from '../components/Nav'; import * as Actions from "../store/actions"; import {connect} from "react-redux"; import {bindActionCreators} from "redux"; + +const SCREEN_HEIGHT = Dimensions.get("window").height; +const SCREEN_WIDTH = Dimensions.get("window").width; + class FebradaDetail extends React.Component { @@ -57,68 +51,76 @@ class FebradaDetail extends React.Component { renderDescription = () => { return ( - - - - + + + + + Febrada + - {info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`} + + Sexta 12 - + + 14h00{/*{info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`}*/} - {info.name} - - - - - {info.Enrolled} / {info.MaxAttendees} - + + + Descrição - - Descrição - - + g - - Descrição - - - - {info.description} - - - ) }; - /* - renderMap = () => { - return ( - { + renderSlider = () => { + const slides = [ + { + key: 'somethun', + title: 'Title 1', + titleStyle: '', + text: 'blblbalbalba', + textStyle: '', + backgroundColor: '#59b2ab', + }, + { + key: 'somethun-dos', + title: 'Title 2', + titleStyle: '', + text: 'blblbalbalba', + textStyle: '', + backgroundColor: '#febe29', + }, + { + key: 'somethun1', + title: 'Rocket guy', + titleStyle: '', + text: 'blblbalbalba', + textStyle: '', + backgroundColor: '#22bcb5', + } + ]; + return ( + + ) + }; - console.log(region); - - }} - - /> - ) - }; - */ + _buyFinosOrBifanas = () => { + //Modal + }; render() { @@ -126,16 +128,17 @@ class FebradaDetail extends React.Component { return ( - - - - {this.renderHeader()} + + + + {this.renderHeader()} + + + {this.renderDescription()} + {this.renderSlider()} + - {this.renderDescription()} - - - - + ) @@ -145,80 +148,44 @@ class FebradaDetail extends React.Component { const styles = StyleSheet.create({ - block: { - marginTop: 15, - - backgroundColor: 'white', - padding: 20 - }, - AttendeeContainer: { - flexDirection: 'row', - height: 55, - justifyContent: 'center', - marginLeft: 10, - marginRight: 10, - }, - - centerRow: { + mainContent: { + flex: 1, alignItems: 'center', + justifyContent: 'space-around', + }, + text: { + //color: 'rgba(255, 255, 255, 0.8)', backgroundColor: 'transparent', - flex: 3, - flexDirection: 'column', - justifyContent: 'center', + textAlign: 'center', + color:'#000', + paddingHorizontal: 16, }, - - leftRow: { - backgroundColor: 'transparent', - flex: 1, - flexDirection: 'row', - justifyContent: 'flex-start', - alignSelf: 'center', - }, - rightRow: { - alignItems: 'flex-end', - backgroundColor: 'transparent', - flex: 2, - flexDirection: 'row', - justifyContent: 'flex-end', - marginRight: 4, - alignSelf: 'center' - }, - - icon: { - justifyContent: 'flex-start', - marginTop: 2.8, - }, - - nameAttendee: { - alignSelf: 'center', - fontSize: 20, - fontWeight: '400', - color: '#000', - marginBottom: 10, - }, - - details: { - marginTop: 20, - flex: 1, - alignSelf: 'center', - }, - - infoRow: { - margin: 25, - }, - - ramoText: { - alignSelf: 'flex-start', - marginBottom: 5, + title: { + fontSize: 22, color: 'white', - fontSize: 17, - fontWeight: '400', + backgroundColor: 'transparent', + textAlign: 'center', + marginBottom: 16, + }, + + + header: { + flex: 1, + flexDirection: 'row', + padding: 10, + backgroundColor: 'white', + //height: SCREEN_HEIGHT * (1 / 3), + }, + + nameText: { + alignSelf: 'flex-start', + flex: 1, + }, timeText: { alignItems: 'flex-end', - flex: 2, - lineHeight: 10, + flex: 1, marginRight: 4, }, @@ -234,19 +201,9 @@ const styles = StyleSheet.create({ //marginBottom: 55, }, - header: { - flex: 1, - padding: 10, - backgroundColor: 'white', - borderRadius: 0, - }, - cardContainer: { - flex: 1, + descContainer: { padding: 10, - // margin: 20, - backgroundColor: 'white', - borderRadius: 5, }, headerContainer: { @@ -264,10 +221,6 @@ const styles = StyleSheet.create({ height: Dimensions.get('window').width * (2 / 4), width: Dimensions.get('window').width, }, - /*headerContainer: { - alignItems: 'center', - backgroundColor: '#FFF', - },*/ });