Flutter webview plugin to display web page in mobile app

 Author: Shengtao Zhou       Created: 11/29/2019 6:07:45 AM       Modified: 12/30/2019 2:26:18 AM   More...
Google Flutter web view allows you to display a web page in your mobile app. 

This is the URL current version of web view: https://pub.dev/packages/webview_flutter. You need to add it to your yaml file's dependencies sections.
  webview_flutter: ^0.3.18+1

When you save the yaml file, it will automatically run "flutter packages get" command to install webview plug into your project. Remember to restart Visual Studio Code after the package installation completed.

For iOS, you also need to add to plist in XCode:

Key: io.flutter.embedded_views_preview
Value: Yes

Next, import the package in you screen,
import 'package:webview_flutter/webview_flutter.dart';

Then, you can simply add a webview widget in you page:
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: WebView(initialUrl: 'https://google.com'),
    );
  }

If you need to run javascript, add the following attribute to WebView. 
javascriptMode: JavascriptMode.unrestricted,

You can also use WebViewController to change the URL:
onWebViewCreated: (WebViewController webViewController) { 
    controller = webViewController;} 

The font of the web page is too small on iOS, you can add the following header to html header to fix the issue:
<head><meta name="viewport" content="width=device-width, initial-scale=1.0"></head>


More...          Back to List          

(Please enter you comments between 100 to 2000 characters. Thanks for your contribution.) 

         Created:       Modified: 

Editing a comment

       (Please enter you comments between 100 to 2000 characters. Please login before edit comment.) 

div class="col-md-2">