4

hi I wrapped my website inside a flutter webview but when i tab on a tel or mailto link then the app throws an error

the web page at tel: could not be loaded because net:: ERR_UNKNOWN_URL_SCHEME can someone please help me fix the problem the code below is my app with all the packages i am using i am very new to app development and i will really appreciate some help

Thank in advanced Kind Regards.

import 'package:flutter/material.dart';
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
import 'package:splashscreen/splashscreen.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';
import 'package:url_launcher/url_launcher.dart';

void main() {enter code here
  SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
  runApp(MaterialApp(
      home: MyApp(),
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        fontFamily: 'Bungee',
        primaryTextTheme: TextTheme(
          title: TextStyle(color: Colors.yellow, fontSize: 24),
        ),
      )));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return new SplashScreen(
      seconds: 20,
      navigateAfterSeconds: AfterSplash(),
      image: new Image.asset(
        'assets/images/icon.png',
        width: 100,
        height: 100,
      ),
      backgroundColor: Colors.blueGrey[800],
      photoSize: 100.0,
      loaderColor: Colors.yellow[300],
    );
  }
}

class AfterSplash extends StatefulWidget {
  @override
  _MyAppsState createState() => _MyAppsState();
}

class _MyAppsState extends State<AfterSplash> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: WebviewScaffold(
        // Enter your custom url
        url: "https://appdev.quintechx.tk/",
        withJavascript: true,
        withLocalStorage: true,
        enableAppScheme: true,
        primary: true,
        supportMultipleWindows: true,
        allowFileURLs: true,
        withLocalUrl: true,
        scrollBar: false,
        appCacheEnabled: true,
      ),
    );
  }
}
Quintin Frey
  • 49
  • 1
  • 4
  • Does this answer your question? [How to allow mailto and tel URL schemes in WebView Flutter?](https://stackoverflow.com/questions/56421218/how-to-allow-mailto-and-tel-url-schemes-in-webview-flutter) – santamanno Mar 03 '20 at 22:26

3 Answers3

2
launchUrl(
   Uri.parse(url),
   mode: LaunchMode.externalApplication,
);
irufano
  • 108
  • 1
  • 11
  • Please don't post only code as answer, but also provide an explanation what your code does and how it solves the problem of the question. Answers with an explanation are usually more helpful and of better quality, and are more likely to attract upvotes. – Mark Rotteveel Dec 03 '22 at 08:57
1

Solution from https://github.com/fluttercommunity/flutter_webview_plugin/issues/43: 

_subscription = webViewPlugin.onUrlChanged.listen((String url) async {
      print("navigating to...$url");
      if (url.startsWith("mailto") || url.startsWith("tel") || url.startsWith("http") || url.startsWith("https"))
      {
        await webViewPlugin.stopLoading();
        await webViewPlugin.goBack();
        if (await canLaunch(url))
        {
           await launch(url);
           return;
        }
        print("couldn't launch $url");
      }
    });
Alex Nazarov
  • 1,178
  • 8
  • 16
0

In pubspec.yaml file include this:

dependencies:
    url_launcher: ^6.1.7

And In the dart file use:

InkWell(
        child: Icon(FontAwesomeIcons.whatsapp,color: Colors.green),
        onTap: () async {
                   String whatsapp = "https://wa.me/91XXXXXXXXX";
                   await launchUrlString(whatsapp,
                   mode: LaunchMode.externalApplication);          
                   }),
Sumit
  • 143
  • 8