公司的一个需求:
地图上一个地点Marker,点击它需要弹个框,点击框中的导航需要跳转三方APP开始导航:先高德,没高德跳百度地图,没百度跳转腾讯地图、没腾讯地图弹框提示用户去下载。大致实现了下,大致思路如下:
通过 自绘弹框实现点击Marker弹框,url_launcher 调起三方库,iOS需要配置下plist文件以添加白名单
弹框通过点击Marker的onTap实现:
自定义弹框可以参考
自定义弹框
调起逻辑:
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:power/app/utils/export_library.dart';
class MapUtil {
/// 高德地图
static Future<bool> gotoAMap(longitude, latitude) async {
// https://lbs.amap.com/api/amap-mobile/guide/ios/navi
var url = '${Platform.isAndroid ? 'android' : 'ios'}amap://navi?sourceApplication=applicationName&poiname=fangheng&poiid=BGVIS&lat=$latitude&lon=$longitude&dev=1&style=2';
bool canLaunchUrl = await canLaunch(url);
if (!canLaunchUrl) {
// showToast('您未安装高德地图', position: ToastPosition.center);
gotoBaiduMap(longitude, latitude);
return false;
}
await launch(url);
return true;
}
/// 腾讯地图
static Future<bool> gotoTencentMap(longitude, latitude) async {
var url = 'qqmap://map/routeplan?type=drive&fromcoord=CurrentLocation&tocoord=$latitude,$longitude&referer=IXHBZ-QIZE4-ZQ6UP-DJYEO-HC2K2-EZBXJ';
bool canLaunchUrl = await canLaunch(url);
if (!canLaunchUrl) {
showToast('您需要安装 高德地图|百度地图|腾讯地图 中的任一一款地图', position: ToastPosition.center);
return false;
}
await launch(url);
return canLaunchUrl;
}
/// 百度地图
static Future<bool> gotoBaiduMap(longitude, latitude) async {
var url = 'baidumap://map/direction?destination=$latitude,$longitude&coord_type=bd09ll&mode=driving';
bool canLaunchUrl = await canLaunch(url);
if (!canLaunchUrl) {
// showToast('您未安装百度地图', position: ToastPosition.center);
gotoTencentMap(longitude, latitude);
return false;
}
await launch(url);
return canLaunchUrl;
}
}