I am developing a Flutter app, in which I need to show navigation to the user for a place. So, how can I open a map application from my Flutter app like we do using external
I suggest you to use url_launcher dart package.
In this way you can use all url schemas to open (phone
, sms
, and even maps
as in your case).
In order to open Google Maps either in Android and iOS you could use the general Android Maps URI schema as suggested by Hemanth Raj.
_openMap() async {
const url = 'https://www.google.com/maps/search/?api=1&query=52.32,4.917';
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
If you want to give a choice on Android you could use the general geo: URI schema.
If you want specifically open iOS Maps API you can use Cupertino Maps URI schema.
If you choose to distinguish between Android and iOS (not using Google Maps Api schema for all platform) you have to do it also in your open map call in a way like this:
_openMap() async {
// Android
const url = 'geo:52.32,4.917';
if (await canLaunch(url)) {
await launch(url);
} else {
// iOS
const url = 'http://maps.apple.com/?ll=52.32,4.917';
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
}
Or you can check the OS at runtime with dart.io library Platform class:
import 'dart:io';
_openMap() async {
// Android
var url = 'geo:52.32,4.917';
if (Platform.isIOS) {
// iOS
url = 'http://maps.apple.com/?ll=52.32,4.917';
}
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
Now that I finished hosekeeping (the real one... not some code refactoring... ^^') I can finish my answer.
As I tell you at the beginning with url_launcher you can use all URI Schemas in order to call, send sms, send e-mail etc.
Here some code to do that:
_sendMail() async {
// Android and iOS
const uri = 'mailto:test@example.org?subject=Greetings&body=Hello%20World';
if (await canLaunch(uri)) {
await launch(uri);
} else {
throw 'Could not launch $uri';
}
}
_callMe() async {
// Android
const uri = 'tel:+1 222 060 888';
if (await canLaunch(uri)) {
await launch(uri);
} else {
// iOS
const uri = 'tel:001-22-060-888';
if (await canLaunch(uri)) {
await launch(uri);
} else {
throw 'Could not launch $uri';
}
}
}
_textMe() async {
// Android
const uri = 'sms:+39 349 060 888';
if (await canLaunch(uri)) {
await launch(uri);
} else {
// iOS
const uri = 'sms:0039-222-060-888';
if (await canLaunch(uri)) {
await launch(uri);
} else {
throw 'Could not launch $uri';
}
}
}
Even if URI schema should be standards (RFC) sometimes the authority
and path
parts of them could differ between frameworks (Android or iOS).
So here I manage the different OSes with exception but, you could do it better with dart.io library Platform class:
import 'dart:io'
and then in code:
if (Platform.isAndroid) {
} else if (Platform.isIOS) {
}
I suggest you always test them in both environments.
You can check the Android and iOS schema documenation here:
If you wanna something similar to startActivity in Android (but that works only for Android platform) you can use the dart package android_intent.
I think you are looking for a scenario where you want to open device installed app from Flutter?
If so , you can use a package called device_apps.
This FLutter package also shows you icon of app to display and you can open app by package name as well.
Just browse all methods it offers. I am using it for my Flutter FItness app to launch installed music player.
https://pub.dev/packages/device_apps
In that case you just need to use url_launcher plugin which opens your app.
yourMap() async {
const url = "https://www.google.com/maps/search/?
api=1&query=LATITUDE,LONGITUDE,17&query_place_id=PLACE_ID";
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch Maps';
}
}
and then call this yourMap() method on your button onPress.
You can just use the url_launcher plugin to open maps. It launches map if installed or falls back to open the map on a browser.
Example:
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
void main() {
runApp(new Scaffold(
body: new Center(
child: new RaisedButton(
onPressed: _launchURL,
child: new Text('Launch Maps'),
),
),
));
}
_launchMaps() async {
const url = "https://www.google.com/maps/search/?api=1&query=LATITUDE,LONGITUDE,17&query_place_id=PLACE_ID";
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch Maps';
}
}
Hope that helps!
For iOS use, no browser involved, directly to apps:
//waze
canLaunch("waze://")
launch("waze://?ll=${latitude},${longitude}&navigate=yes");
//gmaps
canLaunch("comgooglemaps://")
launch("comgooglemaps://?saddr=${latitude},${longitude}&directionsmode=driving")
What you need to do is to add to Info.plist:
<key>LSApplicationQueriesSchemes</key>
<array>
<string>comgooglemaps</string>
<string>waze</string>
</array>