WebView example

This Article is posted by seven.srikanth at 22-08-2018 09:02:19

Below example will help you to create a Webview in Flutter, which will load on a Button click.
The final App output is going to look as below,
Once the New Project is created you need to add the below flutter_webview_plugin package into the pubspec.yaml file.
flutter_webview_plugin: ^0.3.0+2
And then Save to get the Packages.
One the Packages are updated, add the below code to your main.dart code file in lib folder and run the program.
import 'package:flutter/material.dart';
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
var title = 'Webview Demo';
return new MaterialApp(
title: title,
routes: {
'/widget': (_) => new WebviewScaffold(
url: "https:\\FlutterCentral.com",
appBar: new AppBar(
title: const Text('Widget Webview'),
),
withZoom: false,
withLocalStorage: true,
)
},
home: new MyAppHomePage(),
);
}
}
class MyAppHomePage extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyAppHomePage> {
void _opennewpage() {
Navigator.of(context).pushNamed('/widget');
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: Text("Sample App"),
),
body: new Center(
child: new RaisedButton(
child: Text('Open Link'),
onPressed: () {
_opennewpage();
}
) ,
)
);
}
}
Hope this is helpful.
Thanks,
Srikanth
Related Articles:
-> Move to next Tab on Button Click in Flutter https://fluttercentral.com/Articles/Post/1054 ;
-> List of Cards from a JSON source in Flutter https://fluttercentral.com/Articles/Post/55 -> SliverAppBar Widget in Flutter https://fluttercentral.com/Articles/Post/51
-> Flutter Stepper Widget - Change State in Response to Input https://fluttercentral.com/Articles/Post/44

Tags: WebView example in Flutter; Webviw in flutter; web view in flutter; web view example; web view in mobile development; load website in mobile app;



2 Comments
Login to comment.
Recent Comments

obozhdi at 28-01-2019

This shit wont work.

Login to Reply.

seven.s at 05-03-2019

Hi Obozhdi, I've rechecked the program and its running fine. However, I have observed there will be a slight confusion in the way it is written and it is corrected now.




Recent Articles


How to deploy flutter web site on GitHub using peanut

Posted by nikhilchaudhary12155 on 13 Oct 2019 Article


AnimatedPositioned Widget Example in Flutter

Posted by seven.srikanth on 10 Oct 2019 Article


Flutter Open-Source and directory lists

Posted by nishantkotatech on 09 Oct 2019 Article


Flutter Travelling Couple Leading Page - Flutter Web Series 3

Posted by nikhilchaudhary12155 on 05 Oct 2019 Article



© 2018 - Fluttercentral | Email to me - Seven.srikanth@gmail.com