flutter 打开外部地图应用插件

素颜马尾好姑娘i 2023-02-19 14:22 10阅读 0赞

## 效果图如下： ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjE0OTI4_size_16_color_FFFFFF_t_70]

**1. 配置 pubspec.yaml文件：**

dependencies:
      map_launcher: ^0.6.0

**2. 调用外部地图软件：**

IconButton(icon: Icon(Icons.map), onPressed: _showMap) //或 _gotoMap
    
    //直接进入地图组件
    _gotoMap() async { 
      final availableMaps = await MapLauncher.installedMaps;
      print(availableMaps);
    
      await availableMaps.first.showMarker(
        coords: Coords(31.233568, 121.505504),
        title: "Shanghai Tower",
        description: "Asia's tallest building",
      );
    }
    
    
    //显示手机里所有的地图软件
    _showMap() async { 
      try { 
        final title = "Shanghai Tower";
        final description = "Asia's tallest building";
        final coords = Coords(31.233568, 121.505504);
        final availableMaps = await MapLauncher.installedMaps;
    
        print(availableMaps);
    
        showModalBottomSheet(
          context: context,
          builder: (BuildContext context) { 
            return SafeArea(
              child: SingleChildScrollView(
                child: Container(
                  child: Wrap(
                    children: <Widget>[
                      for (var map in availableMaps)
                        ListTile(
                          onTap: () => map.showMarker(
                            coords: coords,
                            title: title,
                            description: description,
                          ),
                          title: Text(map.mapName),
                          leading: Image(
                            image: map.icon,
                            height: 30.0,
                            width: 30.0,
                          ),
                        ),
                    ],
                  ),
                ),
              ),
            );
          },
        );
      } catch (e) { 
        print(e);
      }
    }

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjE0OTI4_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200620234654495.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjE0OTI4,size_16,color_FFFFFF,t_70