Calendário Detail Layout
This commit is contained in:
parent
c8389af216
commit
64813d3b17
|
@ -149,6 +149,7 @@ android {
|
|||
}
|
||||
|
||||
dependencies {
|
||||
compile project(':react-native-maps')
|
||||
compile project(':react-native-device-info')
|
||||
compile project(':react-native-material-shadows')
|
||||
compile project(':react-native-linear-gradient')
|
||||
|
|
|
@ -1,27 +1,30 @@
|
|||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
package="com.app">
|
||||
package="com.app">
|
||||
|
||||
<uses-permission android:name="android.permission.INTERNET" />
|
||||
<uses-permission android:name="android.permission.INTERNET"/>
|
||||
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
|
||||
<uses-permission android:name="android.permission.VIBRATE"/>
|
||||
|
||||
<application
|
||||
android:name=".MainApplication"
|
||||
android:label="@string/app_name"
|
||||
android:icon="@mipmap/ic_launcher"
|
||||
android:allowBackup="false"
|
||||
android:theme="@style/AppTheme">
|
||||
<activity
|
||||
android:name=".MainActivity"
|
||||
android:label="@string/app_name"
|
||||
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
|
||||
android:windowSoftInputMode="adjustResize">
|
||||
<intent-filter>
|
||||
<action android:name="android.intent.action.MAIN" />
|
||||
<category android:name="android.intent.category.LAUNCHER" />
|
||||
</intent-filter>
|
||||
</activity>
|
||||
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
|
||||
android:name=".MainApplication"
|
||||
android:label="@string/app_name"
|
||||
android:icon="@mipmap/ic_launcher"
|
||||
android:allowBackup="false"
|
||||
android:theme="@style/AppTheme">
|
||||
<activity
|
||||
android:name=".MainActivity"
|
||||
android:label="@string/app_name"
|
||||
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
|
||||
android:windowSoftInputMode="adjustResize">
|
||||
<intent-filter>
|
||||
<action android:name="android.intent.action.MAIN"/>
|
||||
<category android:name="android.intent.category.LAUNCHER"/>
|
||||
</intent-filter>
|
||||
</activity>
|
||||
<meta-data
|
||||
android:name="com.google.android.geo.API_KEY"
|
||||
android:value="AIzaSyAwM2Q3T62uh6BPDXcFPqdjXy8F7SI0WH4"/>
|
||||
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity"/>
|
||||
</application>
|
||||
|
||||
</manifest>
|
||||
|
|
|
@ -3,6 +3,7 @@ package com.app;
|
|||
import android.app.Application;
|
||||
|
||||
import com.facebook.react.ReactApplication;
|
||||
import com.airbnb.android.react.maps.MapsPackage;
|
||||
import com.learnium.RNDeviceInfo.RNDeviceInfo;
|
||||
import ui.materialshadows.RNMaterialShadowsPackage;
|
||||
import com.BV.LinearGradient.LinearGradientPackage;
|
||||
|
@ -29,6 +30,7 @@ public class MainApplication extends Application implements ReactApplication {
|
|||
protected List<ReactPackage> getPackages() {
|
||||
return Arrays.<ReactPackage>asList(
|
||||
new MainReactPackage(),
|
||||
new MapsPackage(),
|
||||
new RNDeviceInfo(),
|
||||
new RNMaterialShadowsPackage(),
|
||||
new LinearGradientPackage(),
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
rootProject.name = 'app'
|
||||
include ':react-native-maps'
|
||||
project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
|
||||
include ':react-native-device-info'
|
||||
project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')
|
||||
include ':react-native-material-shadows'
|
||||
|
@ -11,5 +13,7 @@ include ':react-native-vector-icons'
|
|||
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
|
||||
include ':react-native-gesture-handler'
|
||||
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
|
||||
include ':react-native-maps'
|
||||
project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
|
||||
|
||||
include ':app'
|
||||
|
|
564
App/app/App.js
564
App/app/App.js
|
@ -1,14 +1,14 @@
|
|||
import React, {Component} from 'react';
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
StatusBar,
|
||||
Dimensions,
|
||||
Image,
|
||||
ActivityIndicator,
|
||||
Button,
|
||||
Platform,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
StatusBar,
|
||||
Dimensions,
|
||||
Image,
|
||||
ActivityIndicator,
|
||||
Button,
|
||||
TouchableHighlight,
|
||||
Keyboard,
|
||||
ImageBackground,
|
||||
|
@ -26,7 +26,7 @@ import {connect} from 'react-redux';
|
|||
import QRCodeScanner from 'react-native-qrcode-scanner';
|
||||
import {UtilStyles} from './assets/styles'
|
||||
|
||||
import * as Actions from './store/actions';
|
||||
import * as Actions from './store/actions';
|
||||
|
||||
import {RkButton, RkTheme, RkText, RkTextInput} from 'react-native-ui-kitten';
|
||||
|
||||
|
@ -40,43 +40,43 @@ const SCREEN_HEIGHT = Dimensions.get("window").height;
|
|||
const SCREEN_WIDTH = Dimensions.get("window").width;
|
||||
|
||||
import Swiper from 'react-native-swiper';
|
||||
|
||||
var TimerMixin = require('react-timer-mixin');
|
||||
|
||||
function handleConnectivityChange() {
|
||||
console.log("asdasd");
|
||||
}
|
||||
|
||||
class App extends Component {
|
||||
handleConnectivityChange = isConnected => {
|
||||
this.setState({ isConnected });
|
||||
}
|
||||
_activate=()=>{
|
||||
console.log("asdasd");
|
||||
}
|
||||
|
||||
this.setState({ isModalVisible: !this.state.isModalVisible});
|
||||
class App extends Component {
|
||||
handleConnectivityChange = isConnected => {
|
||||
this.setState({isConnected});
|
||||
}
|
||||
_activate = () => {
|
||||
|
||||
this.setState({isModalVisible: !this.state.isModalVisible});
|
||||
this.scanner.reactivate();
|
||||
|
||||
}
|
||||
_scanQr=()=>{
|
||||
_scanQr = () => {
|
||||
this.props.openScannerLogin()
|
||||
console.log(this.props.UI_loginScannerActive)
|
||||
}
|
||||
_tryLogin=()=>{
|
||||
|
||||
_tryLogin = () => {
|
||||
|
||||
//console.log(this.state.text)
|
||||
//this.scanner.reactivate();
|
||||
this.props.login(this.state.username, this.state.text);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
_toggleModal = () =>
|
||||
this.setState({ isModalVisible: !this.state.isModalVisible });
|
||||
this.setState({isModalVisible: !this.state.isModalVisible});
|
||||
|
||||
constructor(props) {
|
||||
|
||||
super(props);
|
||||
|
||||
|
||||
this.state = {
|
||||
|
||||
token: {valid: false},
|
||||
|
@ -84,95 +84,98 @@ class App extends Component {
|
|||
onHold: true,
|
||||
logged: false,
|
||||
isModalVisible: false,
|
||||
state : {text: ''},
|
||||
username:'QR code',
|
||||
state: {text: ''},
|
||||
username: 'QR code',
|
||||
failedAttempt: false,
|
||||
push:4,
|
||||
UI_loginScannerActive:false,
|
||||
userDetails:{username:'', password:''},
|
||||
isConnected: true
|
||||
push: 4,
|
||||
UI_loginScannerActive: false,
|
||||
userDetails: {username: '', password: ''},
|
||||
isConnected: true
|
||||
};
|
||||
|
||||
}
|
||||
_print=()=>{
|
||||
console.log("hello")
|
||||
this.setState({push:0})
|
||||
}
|
||||
checkValue=(e)=>{
|
||||
console.log("check"+e)
|
||||
}
|
||||
_handleConnectionChange = (isConnected) => {
|
||||
this.props.connectionState(true);
|
||||
};
|
||||
|
||||
|
||||
_print = () => {
|
||||
console.log("hello")
|
||||
this.setState({push: 0})
|
||||
};
|
||||
|
||||
checkValue = (e) => {
|
||||
console.log("check" + e)
|
||||
};
|
||||
|
||||
_handleConnectionChange = (isConnected) => {
|
||||
this.props.connectionState(true);
|
||||
};
|
||||
|
||||
|
||||
componentDidMount() {
|
||||
this.props.hold();
|
||||
NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectivityChange);
|
||||
this.props.hold();
|
||||
NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectivityChange);
|
||||
|
||||
this.setState({isModalVisible: false})
|
||||
//verifica se o utilizador tem token guardado
|
||||
this.props.checkUser(this.props.userDetails);
|
||||
this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', this._keyboardDidShow);
|
||||
this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
|
||||
|
||||
|
||||
|
||||
}
|
||||
componentWillUnmount() {
|
||||
NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectivityChange);
|
||||
}
|
||||
|
||||
_keyboardDidShow () {
|
||||
//alert('Keyboard Shown');
|
||||
// this.setState({push:0})
|
||||
|
||||
}
|
||||
|
||||
_keyboardDidHide () {
|
||||
componentWillUnmount() {
|
||||
NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectivityChange);
|
||||
}
|
||||
|
||||
_keyboardDidShow() {
|
||||
//alert('Keyboard Shown');
|
||||
// this.setState({push:0})
|
||||
|
||||
}
|
||||
|
||||
_keyboardDidHide() {
|
||||
|
||||
//this.setState({push:4})
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
onSuccess = (e) => {
|
||||
|
||||
// this.setState({ isModalVisible: !this.state.isModalVisible });
|
||||
// this.props.login(e.data, 'f8908cc0');
|
||||
this.props.closeLoginQRScan();
|
||||
this.setState({username:e.data})
|
||||
this.setState({username: e.data})
|
||||
|
||||
console.log("QR code lido");
|
||||
|
||||
|
||||
|
||||
};
|
||||
|
||||
render() {
|
||||
if (!this.state.isConnected) {
|
||||
return (
|
||||
<View>
|
||||
<Text>cenas da vida</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
if (!this.props.logged && this.props.onHold) {
|
||||
if (!this.state.isConnected) {
|
||||
return (
|
||||
<View>
|
||||
<Text>cenas da vida</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
if (!this.props.logged && this.props.onHold) {
|
||||
|
||||
|
||||
return (
|
||||
<View style={UtilStyles.containerLoading}>
|
||||
|
||||
|
||||
<ActivityIndicator size="large" color="red"/>
|
||||
</View>
|
||||
)
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
else {
|
||||
|
||||
// console.log('token... '+ this.props.logged)
|
||||
// console.log('token... '+ this.props.logged)
|
||||
|
||||
//se existir token
|
||||
|
||||
if (this.props.logged ) {
|
||||
if (this.props.logged) {
|
||||
|
||||
return (
|
||||
|
||||
|
@ -180,116 +183,111 @@ class App extends Component {
|
|||
)
|
||||
}
|
||||
return (
|
||||
|
||||
|
||||
|
||||
<View style={styles.slide2}>
|
||||
<Modal isVisible={this.props.UI_loginScannerActive}>
|
||||
<View style={{ flex: 1 , backgroundColor:'white'}}>
|
||||
<Button onPress={this.props.closeLoginQRScan} title={"Fechar scanner"}> </Button>
|
||||
|
||||
<QRCodeScanner
|
||||
onRead={this.onSuccess}
|
||||
cameraStyle={ styles.cameraContainer}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/>
|
||||
</View>
|
||||
|
||||
</Modal>
|
||||
<View style={{ width:'100%',
|
||||
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',}}>
|
||||
<Image style={styles.logo2} source={require('./assets/img/logo2.png')}/>
|
||||
|
||||
</View>
|
||||
<View styles={styles.loginContainer}>
|
||||
|
||||
|
||||
<View style={styles.slide2}>
|
||||
<Modal isVisible={this.props.UI_loginScannerActive}>
|
||||
<View style={{flex: 1, backgroundColor: 'white'}}>
|
||||
<Button onPress={this.props.closeLoginQRScan} title={"Fechar scanner"}> </Button>
|
||||
|
||||
|
||||
<View style={styles.inputSection}>
|
||||
|
||||
<TextInput
|
||||
style={styles.input}
|
||||
placeholder={this.state.username}
|
||||
onChangeText={(searchString) => {this.setState({searchString})}}
|
||||
maxLength={15}
|
||||
underlineColorAndroid="transparent"
|
||||
/>
|
||||
<TouchableOpacity onPress={this._scanQr}>
|
||||
|
||||
<View style={styles.scanQR}>
|
||||
|
||||
<Icon style={styles.searchIcon} name="ios-qr-scanner" size={30} color="#000"/>
|
||||
<Text>Scan QR</Text>
|
||||
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
|
||||
</View>
|
||||
|
||||
<TextInput style={styles.passwordInput}
|
||||
onFocus={this._print}
|
||||
maxLength={10}
|
||||
blurOnSubmit ={true}
|
||||
secureTextEntry={true}
|
||||
|
||||
onChangeText={(text) => this.setState({text})}
|
||||
clearButtonMode='always'
|
||||
value={this.state.text}
|
||||
clearTextOnFocus={true}
|
||||
onSubmitEditing={Keyboard.dismiss}
|
||||
placeholder='Password' />
|
||||
|
||||
<RkButton rkType='dark' style={styles.loginBtn} onPress={this._tryLogin}>Entrar</RkButton>
|
||||
<QRCodeScanner
|
||||
cameraProps={{captureAudio: false}}
|
||||
onRead={this.onSuccess}
|
||||
cameraStyle={styles.cameraContainer}
|
||||
/>
|
||||
</View>
|
||||
|
||||
</Modal>
|
||||
<View style={{
|
||||
width: '100%',
|
||||
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}>
|
||||
<Image style={styles.logo2} source={require('./assets/img/logo2.png')}/>
|
||||
|
||||
</View>
|
||||
|
||||
<View style={ styles.buttons }>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="logo-facebook" size={40}/>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="logo-instagram" size={40}/>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="md-heart" size={40}/>
|
||||
|
||||
</TouchableOpacity>
|
||||
|
||||
</View>
|
||||
<View style={styles.footer}>
|
||||
<View style={styles.textRow}>
|
||||
|
||||
<RkText rkType='primary3'>Não sabes a password?</RkText>
|
||||
<RkButton rkType='clear' onPress={this.onSignUpButtonPressed}>
|
||||
|
||||
<TouchableOpacity>
|
||||
<RkText style={{color:'red'}} kType='header6'>Recuperar Password</RkText>
|
||||
</TouchableOpacity>
|
||||
|
||||
</RkButton>
|
||||
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
|
||||
);
|
||||
|
||||
<View styles={styles.loginContainer}>
|
||||
|
||||
|
||||
<View style={styles.inputSection}>
|
||||
|
||||
<TextInput
|
||||
style={styles.input}
|
||||
placeholder={this.state.username}
|
||||
onChangeText={(searchString) => {
|
||||
this.setState({searchString})
|
||||
}}
|
||||
maxLength={15}
|
||||
underlineColorAndroid="transparent"
|
||||
/>
|
||||
<TouchableOpacity onPress={this._scanQr}>
|
||||
|
||||
<View style={styles.scanQR}>
|
||||
|
||||
<Icon style={styles.searchIcon} name="ios-qr-scanner" size={30} color="#000"/>
|
||||
<Text>Scan QR</Text>
|
||||
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
|
||||
</View>
|
||||
|
||||
<TextInput style={styles.passwordInput}
|
||||
onFocus={this._print}
|
||||
maxLength={10}
|
||||
blurOnSubmit={true}
|
||||
secureTextEntry={true}
|
||||
|
||||
onChangeText={(text) => this.setState({text})}
|
||||
clearButtonMode='always'
|
||||
value={this.state.text}
|
||||
clearTextOnFocus={true}
|
||||
onSubmitEditing={Keyboard.dismiss}
|
||||
placeholder='Password'/>
|
||||
|
||||
<RkButton rkType='dark' style={styles.loginBtn} onPress={this._tryLogin}>Entrar</RkButton>
|
||||
|
||||
</View>
|
||||
|
||||
<View style={styles.buttons}>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="logo-facebook" size={40}/>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="logo-instagram" size={40}/>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={styles.button}>
|
||||
|
||||
<Icon name="md-heart" size={40}/>
|
||||
|
||||
</TouchableOpacity>
|
||||
|
||||
</View>
|
||||
<View style={styles.footer}>
|
||||
<View style={styles.textRow}>
|
||||
|
||||
<RkText rkType='primary3'>Não sabes a password?</RkText>
|
||||
<RkButton rkType='clear' onPress={this.onSignUpButtonPressed}>
|
||||
|
||||
<TouchableOpacity>
|
||||
<RkText style={{color: 'red'}} kType='header6'>Recuperar Password</RkText>
|
||||
</TouchableOpacity>
|
||||
|
||||
</RkButton>
|
||||
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
|
||||
);
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -310,161 +308,159 @@ const rectDimensions = SCREEN_WIDTH * 0.85; // this is equivalent to 255 from a
|
|||
const overlayColor = 'rgba(0,0,0,0.30)';
|
||||
|
||||
const styles = {
|
||||
cameraContainer:{
|
||||
// height: Dimensions.get('window').height ,
|
||||
cameraContainer: {
|
||||
// height: Dimensions.get('window').height ,
|
||||
},
|
||||
passwordInput:{
|
||||
passwordInput: {
|
||||
borderRadius: 90,
|
||||
|
||||
borderColor:'#bfbdbd',
|
||||
|
||||
borderColor: '#bfbdbd',
|
||||
borderWidth: 1,
|
||||
marginTop:20,
|
||||
marginBottom:20,
|
||||
width:SCREEN_WIDTH*0.8,
|
||||
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
width: SCREEN_WIDTH * 0.8,
|
||||
|
||||
backgroundColor: 'white',
|
||||
|
||||
borderRadius: 90,
|
||||
height: SCREEN_HEIGHT*0.08,
|
||||
borderColor:'#bfbdbd',
|
||||
height: SCREEN_HEIGHT * 0.08,
|
||||
borderColor: '#bfbdbd',
|
||||
borderWidth: 1,
|
||||
paddingLeft:SCREEN_WIDTH*0.05,
|
||||
|
||||
},
|
||||
scanQRText:{
|
||||
|
||||
paddingTop:50
|
||||
// paddingTop:20,
|
||||
|
||||
paddingLeft: SCREEN_WIDTH * 0.05,
|
||||
|
||||
},
|
||||
scanQR:{
|
||||
|
||||
scanQRText: {
|
||||
|
||||
paddingTop: 50
|
||||
// paddingTop:20,
|
||||
|
||||
|
||||
},
|
||||
scanQR: {
|
||||
|
||||
//flexDirection: 'row',
|
||||
paddingTop:5,
|
||||
backgroundColor:10,
|
||||
|
||||
width:80,
|
||||
paddingLeft:10,
|
||||
backgroundColor:'#f24b4b',
|
||||
borderBottomRightRadius:90,
|
||||
borderTopRightRadius:90,
|
||||
height:'100%',
|
||||
|
||||
paddingTop: 5,
|
||||
backgroundColor: 10,
|
||||
|
||||
width: 80,
|
||||
paddingLeft: 10,
|
||||
backgroundColor: '#f24b4b',
|
||||
borderBottomRightRadius: 90,
|
||||
borderTopRightRadius: 90,
|
||||
height: '100%',
|
||||
|
||||
},
|
||||
inputSection: {
|
||||
|
||||
|
||||
flexDirection: 'row',
|
||||
backgroundColor: '#fff',
|
||||
|
||||
|
||||
backgroundColor: 'white',
|
||||
|
||||
borderRadius: 90,
|
||||
height: SCREEN_HEIGHT*0.08,
|
||||
borderColor:'#bfbdbd',
|
||||
height: SCREEN_HEIGHT * 0.08,
|
||||
borderColor: '#bfbdbd',
|
||||
borderWidth: 1,
|
||||
|
||||
|
||||
|
||||
},
|
||||
searchIcon: {
|
||||
paddingLeft:10
|
||||
paddingLeft: 10
|
||||
},
|
||||
|
||||
input: {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
flex: 1,
|
||||
paddingRight: 10,
|
||||
|
||||
|
||||
|
||||
|
||||
paddingLeft: 0,
|
||||
paddingLeft:SCREEN_WIDTH*0.05,
|
||||
paddingLeft: SCREEN_WIDTH * 0.05,
|
||||
color: '#424242',
|
||||
|
||||
|
||||
},
|
||||
textRow:{
|
||||
marginBottom:40
|
||||
textRow: {
|
||||
marginBottom: 40
|
||||
},
|
||||
loginContainer:{
|
||||
loginContainer: {
|
||||
width: '100%',
|
||||
height: '30%',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center'
|
||||
},
|
||||
loginBtn:{
|
||||
marginTop:10,
|
||||
marginBottom:20,
|
||||
marginLeft: '25%',
|
||||
|
||||
loginBtn: {
|
||||
marginTop: 10,
|
||||
marginBottom: 20,
|
||||
marginLeft: '25%',
|
||||
|
||||
},
|
||||
|
||||
|
||||
button: {
|
||||
borderWidth:1,
|
||||
borderColor:'rgba(0,0,0,0.2)',
|
||||
alignItems:'center',
|
||||
justifyContent:'center',
|
||||
width:60,
|
||||
height:60,
|
||||
backgroundColor:'#fff',
|
||||
borderRadius:100,
|
||||
marginRight: 10,
|
||||
marginLeft:10
|
||||
},
|
||||
borderWidth: 1,
|
||||
borderColor: 'rgba(0,0,0,0.2)',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
width: 60,
|
||||
height: 60,
|
||||
backgroundColor: '#fff',
|
||||
borderRadius: 100,
|
||||
marginRight: 10,
|
||||
marginLeft: 10
|
||||
},
|
||||
footer: {},
|
||||
|
||||
buttons: {
|
||||
flexDirection: 'row',
|
||||
marginBottom: 24,
|
||||
marginHorizontal: 24,
|
||||
marginTop:24,
|
||||
marginTop: 24,
|
||||
justifyContent: 'space-around',
|
||||
|
||||
|
||||
},
|
||||
|
||||
logoContainer:{
|
||||
|
||||
width:'100%',
|
||||
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
marginTop:200
|
||||
|
||||
},
|
||||
|
||||
logo2:{
|
||||
|
||||
// flex: 1,
|
||||
// resizeMode: 'contain',
|
||||
logoContainer: {
|
||||
|
||||
width: '100%',
|
||||
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
marginTop: 200
|
||||
|
||||
},
|
||||
|
||||
logo2: {
|
||||
|
||||
// flex: 1,
|
||||
// resizeMode: 'contain',
|
||||
width: 200, height: 200,
|
||||
|
||||
},
|
||||
wrapper: {
|
||||
},
|
||||
wrapper: {},
|
||||
slide1: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'white',
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
slide2: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'white',
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
slide3: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
color:'black',
|
||||
backgroundColor: 'white',
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
color: 'black',
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
text: {
|
||||
color: '#fff',
|
||||
fontSize: 30,
|
||||
fontWeight: 'bold',
|
||||
color: '#fff',
|
||||
fontSize: 30,
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
recover: {
|
||||
paddingTop: 10,
|
||||
|
@ -520,19 +516,19 @@ const styles = {
|
|||
};
|
||||
RkTheme.setType('RkTextInput', 'frame', {
|
||||
input: {
|
||||
backgroundColor: 'white',
|
||||
marginLeft: 0,
|
||||
marginHorizontal: 0,
|
||||
borderRadius: 5
|
||||
backgroundColor: 'white',
|
||||
marginLeft: 0,
|
||||
marginHorizontal: 0,
|
||||
borderRadius: 5
|
||||
},
|
||||
color: 'gray',
|
||||
backgroundColor: 'gray',
|
||||
borderRadius: 10,
|
||||
container: {
|
||||
paddingHorizontal: 20
|
||||
paddingHorizontal: 20
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
mapStateToProps = (state, props) => {
|
||||
|
||||
return {
|
||||
|
@ -540,7 +536,7 @@ mapStateToProps = (state, props) => {
|
|||
loggedIn: state.apiReducer.loggedIn,
|
||||
onHold: state.apiReducer.onHold,
|
||||
logged: state.apiReducer.logged,
|
||||
failedAttempt:state.apiReducer.failedAttempt,
|
||||
failedAttempt: state.apiReducer.failedAttempt,
|
||||
UI_loginScannerActive: state.uiReducer.UI_loginScannerActive,
|
||||
userDetails: state.apiReducer.userDetails,
|
||||
}
|
||||
|
|
|
@ -3,16 +3,23 @@ import {
|
|||
TouchableOpacity,
|
||||
Text,
|
||||
View,
|
||||
Image
|
||||
Image,
|
||||
|
||||
} from 'react-native';
|
||||
import {
|
||||
createStackNavigator,
|
||||
createAppContainer,
|
||||
createSwitchNavigator,
|
||||
createBottomTabNavigator
|
||||
createBottomTabNavigator,
|
||||
HeaderBackButton
|
||||
} from 'react-navigation';
|
||||
import * as Screens from './screens';
|
||||
|
||||
/*Icons*/
|
||||
import Icon from "react-native-vector-icons/Ionicons"
|
||||
import IconF from "react-native-vector-icons/Foundation"
|
||||
import IconFA from "react-native-vector-icons/FontAwesome5"
|
||||
|
||||
|
||||
import AuthLoadingScreen from './screens/AuthLoading'
|
||||
|
||||
|
@ -25,17 +32,18 @@ import Calendar from './screens/Calendar'
|
|||
import Home from './screens/Home'
|
||||
|
||||
|
||||
|
||||
/*Icons*/
|
||||
import Icon from "react-native-vector-icons/Ionicons"
|
||||
import IconF from "react-native-vector-icons/Foundation"
|
||||
import IconFA from "react-native-vector-icons/FontAwesome5"
|
||||
import Profile from "./screens/Profile";
|
||||
import editCalendar from './screens/editCalendar';
|
||||
import choosePath from './screens/choosePath';
|
||||
import calendarDetail from './screens/calendarDetail';
|
||||
|
||||
|
||||
const navigationOptions = ({navigation}) => ({
|
||||
headerLeft: <HeaderBackButton onPress={() => navigation.goBack(null)}/>,
|
||||
headerStyle: {backgroundColor: 'transparent', zIndex: 100 },
|
||||
|
||||
});
|
||||
|
||||
const AppStack = createBottomTabNavigator(
|
||||
{
|
||||
Calendário: {
|
||||
|
@ -48,15 +56,15 @@ const AppStack = createBottomTabNavigator(
|
|||
)
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
'Jogo do...': {
|
||||
screen: Jogo,
|
||||
|
||||
navigationOptions: {
|
||||
|
||||
tabBarIcon: ({tintColor}) => (
|
||||
|
||||
<Image style={{width:30, height:30}}source={require('./assets/img/logo2.png')}></Image>
|
||||
|
||||
<Image style={{width: 30, height: 30}} source={require('./assets/img/logo2.png')}></Image>
|
||||
)
|
||||
},
|
||||
},
|
||||
|
@ -71,8 +79,8 @@ const AppStack = createBottomTabNavigator(
|
|||
},
|
||||
},
|
||||
|
||||
|
||||
Eventos: {
|
||||
|
||||
Eventos: {
|
||||
screen: Eventos,
|
||||
|
||||
navigationOptions: {
|
||||
|
@ -82,7 +90,7 @@ const AppStack = createBottomTabNavigator(
|
|||
)
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
Home: {
|
||||
screen: Home,
|
||||
navigationOptions: {
|
||||
|
@ -94,7 +102,6 @@ const AppStack = createBottomTabNavigator(
|
|||
},
|
||||
|
||||
|
||||
|
||||
},
|
||||
{
|
||||
initialRouteName: 'Home',
|
||||
|
@ -120,51 +127,56 @@ const Stack = createStackNavigator({
|
|||
return {
|
||||
headerTitle: `${navigation.state.routes[index].routeName}`,
|
||||
headerRight: (
|
||||
<TouchableOpacity style={{marginRight: 20, flex:1, flexDirection:'row'}} onPress={() => navigation.navigate('Profile')}>
|
||||
|
||||
<TouchableOpacity style={{marginRight: 20, flex: 1, flexDirection: 'row'}}
|
||||
onPress={() => navigation.navigate('Profile')}>
|
||||
|
||||
<Text>editar</Text>
|
||||
<IconFA name="user-edit" size={22}/>
|
||||
|
||||
|
||||
</TouchableOpacity>
|
||||
)
|
||||
}
|
||||
}
|
||||
else if(navigation.state.routes[index].routeName == 'Calendário'){
|
||||
else if (navigation.state.routes[index].routeName == 'Calendário') {
|
||||
return {
|
||||
headerTitle: 'Calendário',
|
||||
headerRight: (
|
||||
<View style={{flex:1, flexDirection:'row'}}>
|
||||
<TouchableOpacity style={{marginRight: 20, flex:1, flexDirection:'row'}} onPress={() => navigation.navigate('Edit')}>
|
||||
<Text>FAQ</Text>
|
||||
|
||||
</TouchableOpacity>
|
||||
<View style={{flex: 1, flexDirection: 'row'}}>
|
||||
<TouchableOpacity style={{marginRight: 20, flex: 1, flexDirection: 'row'}}
|
||||
onPress={() => navigation.navigate('Edit')}>
|
||||
<Text>FAQ</Text>
|
||||
|
||||
</TouchableOpacity>
|
||||
|
||||
<TouchableOpacity style={{marginRight: 20, flex: 1, flexDirection: 'row'}}
|
||||
onPress={() => navigation.navigate('choosePath')}>
|
||||
<Text>Escolher</Text>
|
||||
<IconFA name="user-edit" size={22}/>
|
||||
</TouchableOpacity></View>
|
||||
|
||||
<TouchableOpacity style={{marginRight: 20, flex:1, flexDirection:'row'}} onPress={() => navigation.navigate('choosePath')}>
|
||||
<Text>Escolher</Text>
|
||||
<IconFA name="user-edit" size={22}/>
|
||||
</TouchableOpacity></View>
|
||||
|
||||
)
|
||||
}
|
||||
}
|
||||
else if(navigation.state.routes[index].routeName == 'choosePath'){
|
||||
}
|
||||
else if (navigation.state.routes[index].routeName == 'choosePath') {
|
||||
return {
|
||||
headerTitle: 'Calendário',
|
||||
headerRight: (
|
||||
<View style={{flex:1, flexDirection:'row'}}>
|
||||
<TouchableOpacity style={{marginRight: 20, flex:1, flexDirection:'row'}} onPress={() => navigation.navigate('Edit')}>
|
||||
<Text>FAQ</Text>
|
||||
|
||||
</TouchableOpacity>
|
||||
<View style={{flex: 1, flexDirection: 'row'}}>
|
||||
<TouchableOpacity style={{marginRight: 20, flex: 1, flexDirection: 'row'}}
|
||||
onPress={() => navigation.navigate('Edit')}>
|
||||
<Text>FAQ</Text>
|
||||
|
||||
</TouchableOpacity>
|
||||
|
||||
<TouchableOpacity style={{marginRight: 20, flex: 1, flexDirection: 'row'}}
|
||||
onPress={() => navigation.navigate('choosePath')}>
|
||||
<Text>Escolher</Text>
|
||||
<IconFA name="user-edit" size={22}/>
|
||||
</TouchableOpacity></View>
|
||||
|
||||
<TouchableOpacity style={{marginRight: 20, flex:1, flexDirection:'row'}} onPress={() => navigation.navigate('choosePath')}>
|
||||
<Text>Escolher</Text>
|
||||
<IconFA name="user-edit" size={22}/>
|
||||
</TouchableOpacity></View>
|
||||
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
return {
|
||||
header: null
|
||||
|
@ -175,17 +187,15 @@ const Stack = createStackNavigator({
|
|||
Profile: {
|
||||
screen: Profile
|
||||
},
|
||||
Edit:{
|
||||
Edit: {
|
||||
screen: editCalendar
|
||||
},
|
||||
choosePath:{
|
||||
choosePath: {
|
||||
screen: choosePath
|
||||
},
|
||||
calendarDetail:{
|
||||
screen:calendarDetail
|
||||
}
|
||||
|
||||
|
||||
calendarDetail: {
|
||||
screen: calendarDetail,
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
|
@ -194,7 +204,7 @@ export default createAppContainer(createSwitchNavigator(
|
|||
{
|
||||
AuthLoading: AuthLoadingScreen,
|
||||
App: Stack,
|
||||
|
||||
|
||||
|
||||
},
|
||||
{
|
||||
|
|
|
@ -0,0 +1,99 @@
|
|||
import React, { Component } from 'react'
|
||||
import { StyleSheet, Text, View } from 'react-native'
|
||||
import { Icon } from 'react-native-elements'
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
centerRow: {
|
||||
alignItems: 'flex-start',
|
||||
backgroundColor: 'transparent',
|
||||
flex: 3,
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
|
||||
container: {
|
||||
backgroundColor: 'transparent',
|
||||
borderBottomWidth: 0,
|
||||
elevation: 0,
|
||||
flexDirection: 'row',
|
||||
height: 55,
|
||||
justifyContent: 'center',
|
||||
left: 0,
|
||||
marginLeft: 10,
|
||||
marginRight: 10,
|
||||
//marginTop: 22,
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
zIndex: 100,
|
||||
},
|
||||
icon: {
|
||||
justifyContent: 'flex-start',
|
||||
marginTop: 2.8,
|
||||
},
|
||||
iconContainer: {
|
||||
alignSelf: 'center',
|
||||
},
|
||||
leftRow: {
|
||||
backgroundColor: 'transparent',
|
||||
flex: 1,
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'flex-start',
|
||||
},
|
||||
rightRow: {
|
||||
alignItems: 'flex-end',
|
||||
backgroundColor: 'transparent',
|
||||
flex: 2,
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'flex-end',
|
||||
marginRight: 4,
|
||||
},
|
||||
titleText: {
|
||||
color: '#000',
|
||||
fontSize: 24,
|
||||
fontWeight: '600',
|
||||
},
|
||||
subTitleText: {
|
||||
color: '#000',
|
||||
fontSize: 14,
|
||||
fontWeight: '400',
|
||||
},
|
||||
});
|
||||
|
||||
class Nav extends Component {
|
||||
|
||||
|
||||
render() {
|
||||
const { navigation, title} = this.props;
|
||||
|
||||
return (
|
||||
<View>
|
||||
<View style={styles.container}>
|
||||
<View style={styles.leftRow}>
|
||||
<Icon
|
||||
size={24}
|
||||
name="arrow-back"
|
||||
type="material-icon"
|
||||
onPress={() => navigation.goBack(null)}
|
||||
color= '#000'
|
||||
iconStyle={styles.icon}
|
||||
underlayColor="transparent"
|
||||
underlineColorAndroid="transparent"
|
||||
containerStyle={styles.iconContainer}
|
||||
hitSlop={{ top: 15, bottom: 15, left: 15, right: 15 }}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.centerRow}>
|
||||
<Text style={styles.titleText} numberOfLines={1}>
|
||||
{title}
|
||||
</Text>
|
||||
</View>
|
||||
<View style={styles.rightRow}>
|
||||
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Nav
|
|
@ -21,7 +21,7 @@ const formatObj = (obj) => {
|
|||
|
||||
let a = {};
|
||||
|
||||
a.push({})
|
||||
a.push({});
|
||||
|
||||
return a
|
||||
|
||||
|
@ -44,7 +44,7 @@ class Calendar extends React.Component {
|
|||
index: 0,
|
||||
routes: [
|
||||
{key: 'first', weekDay: 'sex', day:12},
|
||||
{key: 'second', weekDay: 'sab',day:13},
|
||||
{key: 'second', weekDay: 'sab', day:13},
|
||||
{key: 'third', weekDay: 'dom', day:14},
|
||||
{key: 'fourth', weekDay: 'seg', day:15},
|
||||
|
||||
|
@ -137,7 +137,7 @@ class Calendar extends React.Component {
|
|||
|
||||
constructor() {
|
||||
|
||||
super()
|
||||
super();
|
||||
|
||||
const archeryImgSource = require('../assets/img/archery.png');
|
||||
const badmintonImgSource = require('../assets/img/badminton.png');
|
||||
|
@ -209,7 +209,7 @@ class Calendar extends React.Component {
|
|||
|
||||
</ScrollView>
|
||||
|
||||
)
|
||||
);
|
||||
const SecondRoute = () => (
|
||||
|
||||
<ScrollView contentContainerStyle={styles.contentContainer}>
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -1,121 +1,174 @@
|
|||
import React from 'react';
|
||||
import { View, Image, Vibration, Dimensions,Text ,Button ,TouchableOpacity } from 'react-native';
|
||||
import {View, Image, Vibration, Dimensions, Text, Button, TouchableOpacity, ActivityIndicator} from 'react-native';
|
||||
import QRCodeScanner from 'react-native-qrcode-scanner';
|
||||
import {UtilStyles} from '../assets/styles'
|
||||
import CodeInput from 'react-native-confirmation-code-input';
|
||||
|
||||
import Modal from "react-native-modal";
|
||||
import {TabView, TabBar, SceneMap} from 'react-native-tab-view';
|
||||
|
||||
import {
|
||||
RkButton,
|
||||
RkTheme, RkText
|
||||
} from 'react-native-ui-kitten';
|
||||
|
||||
|
||||
import {RkButton,
|
||||
RkTheme , RkText} from 'react-native-ui-kitten';
|
||||
import IconMI from "react-native-vector-icons/MaterialIcons"
|
||||
|
||||
const SCREEN_HEIGHT = Dimensions.get("window").height;
|
||||
const SCREEN_WIDTH = Dimensions.get("window").width;
|
||||
|
||||
const SCREEN_HEIGHT = Dimensions.get("window").height;
|
||||
const SCREEN_WIDTH = Dimensions.get("window").width;
|
||||
|
||||
|
||||
export default class Scan extends React.Component {
|
||||
|
||||
_toggleModal = () =>
|
||||
this.setState({ isModalVisible: !this.state.isModalVisible });
|
||||
this.setState({isModalVisible: !this.state.isModalVisible});
|
||||
|
||||
_activate=()=>{
|
||||
_activate = () => {
|
||||
|
||||
this.setState({ isModalVisible: !this.state.isModalVisible ,reactivate:true});
|
||||
this.setState({isModalVisible: !this.state.isModalVisible, reactivate: true});
|
||||
this.scanner.reactivate();
|
||||
}
|
||||
|
||||
onSuccess = (e) => {
|
||||
|
||||
this.setState({ isModalVisible: !this.state.isModalVisible ,isActive:false});
|
||||
this.setState({code:e.data});
|
||||
};
|
||||
this.setState({isModalVisible: !this.state.isModalVisible, isActive: false});
|
||||
this.setState({code: e.data});
|
||||
};
|
||||
|
||||
state = {
|
||||
isActive:true,
|
||||
isRender: true,
|
||||
reactivate:false,
|
||||
isModalVisible: false,
|
||||
code:''
|
||||
|
||||
}
|
||||
componentDidMount() {
|
||||
|
||||
state = {
|
||||
isActive: true,
|
||||
isRender: true,
|
||||
reactivate: false,
|
||||
isModalVisible: false,
|
||||
code: '',
|
||||
|
||||
index: 0,
|
||||
routes: [
|
||||
{key: 'scan', title: 'Scan', icon: ''},
|
||||
{key: 'history', title: 'Histórico', icon: 'history'},
|
||||
{key: 'fav', title: 'Favoritos', icon: 'favorite'},
|
||||
],
|
||||
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.props.navigation.addListener('willFocus', (route) => {
|
||||
this.setState({ isRender: true })
|
||||
this.setState({isRender: true})
|
||||
});
|
||||
this.props.navigation.addListener('willBlur', (route) => {
|
||||
this.setState({ isRender: false })
|
||||
this.setState({isRender: false})
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
{
|
||||
}
|
||||
|
||||
return (
|
||||
render() {
|
||||
|
||||
<View style={{flex: 1}}>
|
||||
|
||||
{ this.state.isRender &&
|
||||
|
||||
<QRCodeScanner
|
||||
/*Screen SCAN*/
|
||||
const scanScreen = () => (
|
||||
<QRCodeScanner
|
||||
showMarker
|
||||
ref={(node) => { this.scanner = node }}
|
||||
ref={(node) => {
|
||||
this.scanner = node
|
||||
}}
|
||||
reactivate={false}
|
||||
|
||||
cameraProps={{captureAudio: false}}
|
||||
onRead={this.onSuccess.bind(this)}
|
||||
|
||||
showMarker={true}
|
||||
|
||||
cameraStyle={{ height: SCREEN_HEIGHT }}
|
||||
|
||||
cameraStyle={{height: SCREEN_HEIGHT}}
|
||||
fadeIn={true}
|
||||
|
||||
customMarker={
|
||||
|
||||
<View style={{ flex: 1 }}>
|
||||
|
||||
<Modal isVisible={this.state.isModalVisible} style={{backgroundColor:'#E8E8E8', borderRadius:30, height:100}}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text></Text>
|
||||
<Text> Qr code data: {this.state.code}</Text>
|
||||
<Button onPress={this._activate} title="Close" color="#841584" accessibilityLabel="Learn more about this purple button"/>
|
||||
|
||||
</View>
|
||||
</Modal>
|
||||
</View>
|
||||
<View style={{flex: 1}}>
|
||||
<Modal isVisible={this.state.isModalVisible}
|
||||
style={{backgroundColor: '#E8E8E8', borderRadius: 30, height: 100}}>
|
||||
<View style={{flex: 1}}>
|
||||
<Text></Text>
|
||||
<Text> Qr code data: {this.state.code}</Text>
|
||||
<Button onPress={this._activate} title="Close" color="#841584"
|
||||
accessibilityLabel="Learn more about this purple button"/>
|
||||
</View>
|
||||
</Modal>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
}
|
||||
</View>
|
||||
)}
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1 }}>
|
||||
<TouchableOpacity onPress={this._toggleModal}>
|
||||
<Text>Show Modal</Text>
|
||||
</TouchableOpacity>
|
||||
<Modal isVisible={this.state.isModalVisible}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text>Hello!</Text>
|
||||
<TouchableOpacity onPress={this._toggleModal}>
|
||||
<Text>Hide me!</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</Modal>
|
||||
/>
|
||||
);
|
||||
|
||||
const historyScreen = () => (
|
||||
<View style={{backgroundColor: '#ff4081'}}>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
const favScreen = () => (
|
||||
<View style={{backgroundColor: '#a95'}}>
|
||||
</View>
|
||||
|
||||
);
|
||||
|
||||
|
||||
_renderLazyPlaceholder = () => {
|
||||
return (
|
||||
<ActivityIndicator size="large" color="red" />
|
||||
);
|
||||
};
|
||||
|
||||
{
|
||||
|
||||
return (
|
||||
|
||||
<View style={{flex: 1}}>
|
||||
|
||||
{this.state.isRender &&
|
||||
<TabView
|
||||
lazy
|
||||
navigationState={this.state}
|
||||
renderScene={SceneMap({
|
||||
scan: scanScreen,
|
||||
history: historyScreen,
|
||||
fav: favScreen,
|
||||
})}
|
||||
renderLazyPlaceholder={this._renderLazyPlaceholder}
|
||||
onIndexChange={(index) => this.setState({index})}
|
||||
initialLayout={{width: SCREEN_WIDTH, height: SCREEN_HEIGHT}}
|
||||
renderIcon={({route}) => (
|
||||
<IconMI
|
||||
name={route.icon}
|
||||
size={15}
|
||||
color={'white'}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={{flex: 1}}>
|
||||
<TouchableOpacity onPress={this._toggleModal}>
|
||||
<Text>Show Modal</Text>
|
||||
</TouchableOpacity>
|
||||
<Modal isVisible={this.state.isModalVisible}>
|
||||
<View style={{flex: 1}}>
|
||||
<Text>Hello!</Text>
|
||||
<TouchableOpacity onPress={this._toggleModal}>
|
||||
<Text>Hide me!</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</Modal>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
RkTheme.setType('RkButton', 'dark', {
|
||||
container: {
|
||||
paddingTop:10,
|
||||
backgroundColor: 'gray',
|
||||
|
||||
borderRadius: 90,
|
||||
paddingTop: 10,
|
||||
backgroundColor: 'gray',
|
||||
|
||||