Flutter Webview - Opening External Links in Browser or Window

I have an Android app made using Flutter Webview. When the user click on an external link, I want the link to open in the browser. How can I do it?

In fact, it would be nice to open external links in a window like Instagram does. Is there a way to do this?

Edit:

website.com is my app's homepage. That is not a external link. What I want is when trying to open a link other than website.com, it opens in a browser or a window.

Home Page:

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class Forum extends StatefulWidget {
  @override
  _ForumState createState() => _ForumState();

}

class _ForumState extends State<Forum> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        title: 'Forum',
        home: Scaffold(
          body: WebView(initialUrl: "https://website.com",
            javascriptMode: JavascriptMode.unrestricted,
          ),
        )
    );
  }
}

Solution

I had exactly the same problem and it cost me to solve it. Akif, even 5 months after your question, I will post the solution, because I believe it will still help a lot of people.

The solution below is using the STANDART FLUTTER WEBVIEW and also using the URL LAUNCHER.

Add the url_launcher and webview_flutter to your file pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  
  webview_flutter: ^1.0.5
  url_launcher: ^5.7.10

Now in your webview it needs to contain the navigationDelegate

See below...

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Title Your App',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: Scaffold(
            body: Container(
          child: WebView(
            initialUrl: 'https://website.com',
            javascriptMode: JavascriptMode.unrestricted,
            onWebViewCreated: (WebViewController webViewController) {
              _controller.complete(webViewController);
            },
            navigationDelegate: (NavigationRequest request) {
              if (request.url.startsWith("https://website.com")) {
                return NavigationDecision.navigate;
              } else {
                _launchURL(request.url);
                return NavigationDecision.prevent;
              }
            },
          ),
        )));
  }

  _launchURL(String url) async {
    if (await canLaunch(url)) {
      await launch(url);
    } else {
      throw 'Could not launch $url';
    }
  }
}

Don´t forget that you need to add URL LAUNCHER dependence.

import 'package:url_launcher/url_launcher.dart';

Explanation:

This code causes every request that is made within the webview to pass the following test:

If the request address starts with your webview's start address, it normally does it within the webview.
If the request address is different from the initial address of your webview, it launches that request to the phone's default browser.

I hope that maybe it will still help you or that it will help someone who needs it from now on.

Hugs.