Flutter URL启动器Google Maps

时间:2018-08-28 07:22:17

标签: dart flutter

List.dart

import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';

class List extends StatefulWidget {

  @override
  ListState createState() {
    return new ListState();
  }
}

class ListState extends State<List> {

  static const double lat = 2.813812,  long = 101.503413;
  static const String map_api= "API_KEY";

  @override
  Widget build(BuildContext context) {

    //method to launch maps
    void launchMap() async{
      const url = "https://maps.google.com/maps/search/?api=$map_api&query=$lat,$long";
      if (await canLaunch(url)) {
        print("Can launch");
        void initState(){
          super.initState();

          canLaunch( "https://maps.google.com/maps/search/?api=$map_api&query=$lat,$long");
        }

        await launch(url);
      } else {
        print("Could not launch");
        throw 'Could not launch Maps';
      }
    }

    //method to bring out dialog
    void makeDialog(){
      showDialog(
          context: context,
          builder: (_) => new SimpleDialog(
            contentPadding: EdgeInsets.only(left: 30.0, top: 30.0),
            children: <Widget>[
              new Text("Address: ",
                style: TextStyle(
                  fontWeight: FontWeight.bold
                ),
              ),
              new ButtonBar(
                children: <Widget>[
                  new IconButton(
                      icon: Icon(Icons.close),
                      onPressed: (){
                        Navigator.pop(context);
                      }
                      )
                ],
              )
            ],
          )
      );
    }

    return new Scaffold(
      body: new ListView.builder(
          itemBuilder: (context, index) => ExpansionTile(
              title: new Text("State ${index+1}"),
              children: <Widget>[
                new ListTile(
                  title: new Text("Place 1"),
                  trailing: new Row(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      new IconButton(
                          icon: Icon(Icons.info),
                          onPressed: makeDialog
                      ),
                      new IconButton(
                          icon: Icon(Icons.directions),
                          onPressed: launchMap
                      )
                    ],
                  ),
                ),
                new Divider(height: 10.0),
                new ListTile(
                  title: new Text("Place 2"),
                  trailing: new Row(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      new IconButton(
                          icon: Icon(Icons.info),
                          onPressed: makeDialog
                      ),
                      new IconButton(
                          icon: Icon(Icons.directions),
                          onPressed: launchMap
                      )
                    ],
                  ),
                )
              ],
          ),
        itemCount: 5,
      ),
    );
  }
}

我的项目当前涉及从URL启动器库启动Google Maps。但是我目前遇到的问题是Google Maps将打开,但不会打开我已设置为变量的纬度和经度。

如何设置要根据坐标启动的URL?还是有更好的选择?

请协助。

4 个答案:

答案 0 :(得分:2)

您需要传递api=1作为url_launcher,您必须传递编码后的URL str.first?.asciiValue

在此sample project中找到更多详细信息。

Uri.encodeFull()

答案 1 :(得分:1)

试试这个方法

  ///
  /// for launching map with specific [latitude] and [longitude]
  static Future<void> openMap({
     required double latitude,
     required double longitude,
     required String label,
  }) async {
     final query = '$latitude,$longitude($label)';
     final uri = Uri(scheme: 'geo', host: '0,0', queryParameters: {'q': query});

     await launch(uri.toString());
   }

答案 2 :(得分:0)

对于启动Google Maps,简单搜索的格式[1]应如下:

https://www.google.com/maps/search/?api=1&query=ADDRESS_OR_LATLNG_HERE

在这种情况下,您将插入“ API_KEY”,而不是api参数的值不为1。该值应始终为1,以便可以对其进行硬编码。

[1] https://developers.google.com/maps/documentation/urls/guide#forming-the-url

答案 3 :(得分:0)

您可以使用Map Launcher插件

if (await MapLauncher.isMapAvailable(MapType.google)) {
  await MapLauncher.launchMap(
    mapType: MapType.google,
    coords: Coords(31.233568, 121.505504),
    title: "Shanghai Tower",
    description: "Asia's tallest building",
  );
}