In this guide, you are going to learn to open an external or any link in a new tab, same tab, and in the new window in Flutter Web. There are plenty of packages out there to perform this, but we are going to show to open links without any package.
If you are looking for opening the app page route in a new tab then look into this: How to open Page Route in New Tab in Flutter Web
in your script.
import 'dart:html' as html;
html.window.open('https://www.fluttercampus.com',"_self");
//html is from import
html.window.open('https://www.fluttercampus.com',"_blank");
html.window.open('https://www.fluttercampus.com',"_blank", 'location=yes');
// add more paramerter to options like 'location=yes,height=570,width=520,scrollbars=yes,status=yes'
import 'package:flutter/material.dart';
import 'dart:html' as html;
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget{
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "Hello World",
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget{
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Open External Link"),
backgroundColor: Colors.redAccent,
),
body: Container(
child:Center(
child: ElevatedButton(
onPressed: (){
html.window.open('https://www.fluttercampus.com',"_blank");
},
child: Text("Open Flutter Campus"),
),
)
)
);
}
}
In this way, you can open link in a new tab and new window using Flutter Web
Please Wait...
2 Comments on this Article
Fariza
How can we do the same but for navigating to new screen in flutter web?
Hari Prasad Chaudhary
We have posed a new example regarding opening a new page route to a new tab, look here: How to open Page Route in New Tab in Flutter Web
1 year ago