From e40e046cc7f62db42d0b634870da4de020e9108a Mon Sep 17 00:00:00 2001 From: Andrew Date: Tue, 5 Mar 2019 09:33:54 -0500 Subject: Added location functionality to greeting page. Location data is now sent to the form page after the 'get location' button is pressed. --- mobile/App.js | 2 +- mobile/components/GreetingPage.js | 50 +++++++++++++++++++++++++++++++++++++-- 2 files changed, 49 insertions(+), 3 deletions(-) diff --git a/mobile/App.js b/mobile/App.js index 4348381..c1b9eba 100644 --- a/mobile/App.js +++ b/mobile/App.js @@ -4,7 +4,7 @@ import { Ionicons } from '@expo/vector-icons'; import { createStackNavigator, createAppContainer } from 'react-navigation'; import GreetingPage from './components/GreetingPage'; -import FormPage from './components/FormPage'; +import FormPage from './components/Form1'; const RootStack = createStackNavigator( {GreetingPage: GreetingPage, FormPage: FormPage,}, diff --git a/mobile/components/GreetingPage.js b/mobile/components/GreetingPage.js index 8b87474..5e6d502 100644 --- a/mobile/components/GreetingPage.js +++ b/mobile/components/GreetingPage.js @@ -1,10 +1,55 @@ import React, { Component } from 'react'; -import { Text, View, Alert, StyleSheet, Button, AppRegistry, Navigator, TouchableHighlight} from 'react-native'; +import { Text, View, Alert, StyleSheet, Button, AppRegistry, Navigator, TouchableHighlight, Platform} from 'react-native'; import { Ionicons } from '@expo/vector-icons'; import { createStackNavigator, createAppContainer } from 'react-navigation'; +import { Location, Permissions, Constants } from 'expo'; export default class GreetingPage extends Component { //Every component needs a render() function + state = { + location: null, + errorMessage: null, + }; + + componentWillMount() { + if (Platform.OS === 'android' && !Constants.isDevice) { + this.setState({ + errorMessage: 'Oops, this will not work on Sketch in an Android emulator. Try it on your device!', + }); + } else { + this._getLocationAsync(); + } + } + + _getLocationAsync = async () => { + let { status } = await Permissions.askAsync(Permissions.LOCATION); + if (status !== 'granted') { + this.setState({ + errorMessage: 'Permission to access location was denied', + }); + } + + let location = await Location.getCurrentPositionAsync({}); + this.setState({ location }); + }; + + getCurrentLocation = () => { + + navigator.geolocation.getCurrentPosition( + position => { + this.recorded_coordinates = JSON.stringify([position.coords.latitude, position.coords.longitude]); + }, + ); + } + + moveToFormPage = () => { + this._getLocationAsync; + const coordinates = [this.state.location.coords.longitude, this.state.location.coords.latitude] + // Alert.alert(JSON.stringify(coordinates)); + this.props.navigation.navigate('FormPage', {coordinates : coordinates}); + } + + render() { return ( // acts like the way
does in JavaScript @@ -22,7 +67,8 @@ export default class GreetingPage extends Component { this.props.navigation.navigate('FormPage')}> + onPress={() => { this.moveToFormPage() + }}> -- cgit v1.2.3