谷歌地图中的模式选项使用反应原生链接

时间:2016-11-03 06:32:04

标签: google-maps react-native

以下功能在驱动程序模式下打开地图。是否有任何选项可用于设置地图模式,如驱动程序,传输等。

startNavigation(url) {
    Linking.canOpenURL(url).then(supported => {
      if (supported) {
        Linking.openURL(url);
      } else {
        console.log('Don\'t know how to open URI: ' + url);
      }
    });
  }

1 个答案:

答案 0 :(得分:0)

检查此示例代码

import React, {
    Component
} from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Linking,
    TouchableHighlight,
} from 'react-native';

class StackOverflow extends Component {
    startNavigation(url) {
        Linking.canOpenURL(url).then(supported => {
            if (supported) {
                Linking.openURL(url);
            } else {
                console.log('Don\'t know how to open URI: ' + url);
            }
        });
    }

    _onPressButton(mode) {
        //driving d 
        //walking walking
        //bicycling bicycle
        //transit transit
        this.startNavigation("google.navigation:q=American Century Investments&mode="+mode);
    }

    render() {
        return (
            <View style={styles.container}>
                <TouchableHighlight onPress={this._onPressButton.bind(this,'d')}>
                    <Text>Driving</Text>
                </TouchableHighlight>
                <TouchableHighlight onPress={this._onPressButton.bind(this,'walking')}>
                    <Text>Walking</Text>
                </TouchableHighlight>
                <TouchableHighlight onPress={this._onPressButton.bind(this,'bicycle')}>
                    <Text>Bicycle</Text>
                </TouchableHighlight>
                <TouchableHighlight onPress={this._onPressButton.bind(this,'transit')}>
                    <Text>Transit</Text>
                </TouchableHighlight>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    }
});

AppRegistry.registerComponent('StackOverflow', () => StackOverflow);

在Android设备中验证