How to open Page Route in New Tab in Flutter Web

Limited Time Offer!

For Less Than the Cost of a Starbucks Coffee, Access All DevOpsSchool Videos on YouTube Unlimitedly.
Master DevOps, SRE, DevSecOps Skills!

Enroll Now

To open a new tab or browser window in a Flutter application, you can make use of the url_launcher package. This package allows you to launch URLs and open them in the default browser on the device.

First, make sure you have added the url_launcher package to your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  url_launcher: ^6.0.0

Then, you can use the url_launcher package to open the URL in a new tab or browser window. Here’s an example of how you can achieve this:

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

class MyWidget extends StatelessWidget {
  final List<Map<String, dynamic>> list;
  final int i;

  MyWidget(this.list, this.i);

  void _openUrlInBrowser() async {
    var noOfBids = list[i]['no_of_bids'];
    var url = 'https://www.example.com/?no_of_bids=$noOfBids';

    if (await canLaunch(url)) {
      await launch(url, forceSafariVC: false, forceWebView: false);
    } else {
      throw 'Could not launch $url';
    }
  }

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: _openUrlInBrowser,
      child: Text('Open in New Tab'),
    );
  }
}

In this example, the _openUrlInBrowser method constructs the URL with the value of 'no_of_bids' and then uses launch from the url_launcher package to open the URL. The canLaunch method is used to check if the URL can be launched, and then launch is called with forceSafariVC and forceWebView set to false to open the URL in the default browser on the device.

You can use this MyWidget in your Flutter application by passing the list and i values as parameters, and it will display a button labeled “Open in New Tab” that, when pressed, will open the URL in a new tab or browser window.

Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x