Using url_launcher in Your Flutter App

The “url_launcher” package is a popular package in Flutter that allows you to launch URLs, make phone calls, send SMS messages, and send emails from within your Flutter app. In this tutorial, we’ll walk through the steps to install and use this package in your app.

Step 1: Add the package to your dependencies

First, you’ll need to add the “url_launcher” package to your pubspec.yaml file. You can do this by opening your pubspec.yaml file and adding the following line under the “dependencies” section:

dependencies:
 url_launcher:

Make sure to save your changes, and then run flutter pub get in your terminal to install the package.

Step 2: Import the package

Once you’ve installed the package, you can import it into your Dart file by adding the following line at the top of your file:

import 'package:url_launcher/url_launcher.dart';

Step 3: Launch a URL

Now that you have the package imported, you can use it to launch a URL in your app. To launch a URL, you can use the launch() function, which takes a String argument representing the URL you want to launch. Here’s an example:

launch('https://www.google.com');

This code will open the user’s default browser and navigate to the Google homepage.

Step 4: Launch Other Apps

In addition to launching URLs, you can also use the “url_launcher” package to launch other apps on the user’s device. Here are a few examples:

Phone calls

launch('tel:+15555555555');

This code will open the user’s default phone app and initiate a call to the specified phone number.

SMS messages

launch('sms:+15555555555');

This code will open the user’s default messaging app and create a new SMS message to the specified phone number.

Emails

launch('mailto:[email protected]?subject=Hello%20World&body=Hello%20from%20Flutter!');

This code will open the user’s default email app and create a new email with the specified recipient, subject, and body.

Step 5: Error Handling

Finally, it’s important to handle errors that may occur when launching URLs or other apps. To do this, you can use a try-catch block, like this:

try {
  launch('https://www.google.com');
} catch (e) {
// Handle any errors here
}

If an error occurs, it will be caught by the catch block and you can handle it appropriately.

And that’s it! With the “url_launcher” package, you can easily launch URLs, phone calls, SMS messages, and emails from within your Flutter app. I hope this tutorial was helpful, and happy coding!

And here are some additional tips and tricks for using the “url_launcher” package in Flutter:

Customizing the behavior of launched apps

You can customize the behavior of the launched app by using the forceSafariVC and universalLinksOnly parameters. For example, you can force URLs to open in Safari or Chrome instead of the default browser by using the forceSafariVC parameter. Here’s an example:

launch('https://www.google.com', forceSafariVC: true);

You can also specify that the launched app should only handle universal links by using the universalLinksOnly parameter. Here’s an example:

launch('https://www.google.com', universalLinksOnly: true);

Checking if an app is installed

You can check if a specific app is installed on the user’s device by using the canLaunch() function. Here’s an example:

bool isInstalled = await canLaunch('tel:+15555555555');
if (isInstalled) {
  // Launch the app
} else {
  // Display an error message
}

This code will check if the user’s device has a phone app installed, and if so, it will launch the app. If not, it will display an error message.

Launching URLs in a WebView

If you want to display a webpage inside your Flutter app, you can use a WebView. The “url_launcher” package can be used in conjunction with the “webview_flutter” package to launch URLs inside a WebView. Here’s an example:

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

class WebViewPage extends StatelessWidget {
  final String url;

  WebViewPage({required this.url});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: WebView(
        initialUrl: url,
        javascriptMode: JavascriptMode.unrestricted,
        navigationDelegate: (NavigationRequest request) async {
          if (await canLaunch(request.url)) {
            launch(request.url);
            return NavigationDecision.prevent;
          }
          return NavigationDecision.navigate;
        },
      ),
    );
  }
}

This code defines a WebViewPage widget that takes a url argument and displays the webpage inside a WebView. It also checks if the URL being loaded can be launched by the “url_launcher” package, and if so, it launches the URL instead of navigating to it in the WebView.

Full example

here is a full example of using the “url_launcher” package in a Flutter app:

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'URL Launcher Demo',
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('URL Launcher Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () {
                launch('https://www.google.com');
              },
              child: Text('Launch Google'),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                launch('tel:+15555555555');
              },
              child: Text('Call +1 555-555-5555'),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                launch('sms:+15555555555');
              },
              child: Text('Send SMS to +1 555-555-5555'),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                launch('mailto:[email protected]?subject=Test&body=Hello');
              },
              child: Text('Send email to [email protected]'),
            ),
          ],
        ),
      ),
    );
  }
}

This code defines a simple Flutter app that has a home page with four buttons. Each button uses the launch() function to launch a different type of URL: a website, a phone call, an SMS message, or an email.

When you run this app, you should see a home screen with four buttons. When you tap each button, it should launch the corresponding app or service on your device.

Note that the phone call and SMS message buttons will only work on a physical device that has a phone and messaging app installed. On an emulator or simulator, these buttons will not do anything.

Conclusion

The “url_launcher” package is a powerful tool for launching URLs, phone calls, SMS messages, and emails from within your Flutter app. With the tips and tricks outlined in this tutorial, you should be able to use this package to create a wide range of functionality in your app. If you have any questions or issues, don’t hesitate to reach out to the Flutter community for help!