flutter 打開外部地圖應用插件

效果圖如下:

在這裏插入圖片描述

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);
  }
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章