Does Flutter use WebView ?

November 10, 2022 · View on GitHub

Flutter is different than most other options for building mobile apps because Flutter uses neither WebView nor the OEM widgets that shipped with the device.
Instead, Flutter uses its own high-performance rendering engine to draw widgets.

Flutter

Using WebViews In Flutter

First of all you need to add the webView package to your pubspec.

flutter_webview_plugin: ^0.3.10+1

Now in your 'main.dart' add a 'WebviewScaffold' widget.
Inside the Scaffold add a 'appBar' which supports a title with the text 'Browser'.

return WebviewScaffold(
     appBar: AppBar(
       title: Text("Browser"),
     ),

Then use the 'url' to specify which site will appear.

url: "https://github.com/dwyl",

Use 'textInputAction' and 'onSubmitted' to go to any site the user wants.

textInputAction: TextInputAction.go,
         onSubmitted: (url)=> launchUrl(),

Create the 'launchUrl' method.

launchUrl(){
setState(() {
 urlString= controller.text;
 flutterWebviewPlugin.reloadUrl(urlString);
});
 }

And the variable urlString.

 var urlString="https://google.com";

Create a button so that when the user enters a site they can go directly there.

   IconButton(
               icon: Icon(Icons.navigate_next),
               onPressed: () => launchUrl(),

This will be the end result.

Flutter

Webview Inside Listview

It works the same way as using full screen Webview.
First we create the Scaffold method and an appBar then inside the body you create the Container and then pass the child with the ListView.

    return Scaffold(
      appBar: AppBar(title: Text("WebView"),
      ),
      body: Container(
        child: ListView(
       scrollDirection: Axis.vertical,
          children: <Widget>[
            Text("Flutter"),
            Padding(padding: EdgeInsets.all(4.0)),
            Text("Flutter’s widgets incorporate all critical platform differences such as scrolling, navigation, icons and fonts to provide full native performance on both iOS and Android."),
            Padding(padding: EdgeInsets.all(4.0)),
            Container(
              height: MediaQuery.of(context).size.height,
             child: WebView(
               initialUrl:"https://flutter.dev/",
               javascriptMode: JavascriptMode.unrestricted.
                 gestureRecognizers: Set() ..add(Factory)<VerticalDragGestureRecognizer>(()=>VerticalDragGestureRecognizer())),