flutter_webview_plugin 0.1.0+1

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 97

flutter_webview_plugin

Plugin that allow Flutter to communicate with a native WebView.

Getting Started

For help getting started with Flutter, view our online documentation.

How it works

Launch WebView Fullscreen with Flutter navigation

new MaterialApp(
      routes: {
        "/": (_) => new WebviewScaffold(
              url: "https://www.google.com",
              appBar: new AppBar(
                title: new Text("Widget webview"),
              ),
            )
      },
    );

FlutterWebviewPlugin provide a singleton instance linked to one unique webview, so you can take control of the webview from anywhere in the app

listen for events

final flutterWebviewPlugin = new FlutterWebviewPlugin();

flutterWebviewPlugin.onUrlChanged.listen((String url) {
  
});

Hidden WebView

final flutterWebviewPlugin = new FlutterWebviewPlugin();  

flutterWebviewPlugin.launch(url, hidden: true);

Close launched WebView

flutterWebviewPlugin.close();

Webview inside custom Rectangle

final flutterWebviewPlugin = new FlutterWebviewPlugin();  

flutterWebviewPlugin.launch(url,
                  fullScreen: false,
                  rect: new Rect.fromLTWH(
                      0.0, 
                      0.0, 
                      MediaQuery.of(context).size.width, 
                      300.0));

Webview Events

  • Stream<Null> onDestroy
  • Stream<String> onUrlChanged
  • Stream<WebViewStateChanged> onStateChanged
  • Stream<String> onError

Don't forget to dispose webview flutterWebviewPlugin.dispose()

Webview Functions

Future<Null> launch(String url,
         {bool withJavascript: true,
         bool clearCache: false,
         bool clearCookies: false,
         bool hidden: false,
         bool enableAppScheme: true,
         Rect rect: null,
         String userAgent: null});
Future<String> evalJavascript(String code);
Future<Map<String, dynamic>> getCookies();
Future<Null> resize(Rect rect);

0.1.0

  • fix Android close webview

0.1.0

  • iOS && Android:

    • get cookies
    • eval javascript
    • user agent setting
    • state change event
    • embed in rectangle or fullscreen if null
    • hidden webview
  • Android

    • adding Activity in manifest is not needed anymore
  • Add WebviewScaffold

0.0.9

  • Android: remove the need to use FlutterActivity as base activity

0.0.5

  • fix "onDestroy" event for iOS #4
  • fix fullscreen mode for iOS #5

0.0.4

  • IOS implementation
  • Update to last version of Flutter

0.0.3

  • Documentation

0.0.2

  • Initial version for Android

example/lib/main.dart

import 'dart:async';

import 'package:flutter/material.dart';

import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';

const kAndroidUserAgent =
    "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Mobile Safari/537.36";

String selectedUrl = "https://github.com/dart-flitter/flutter_webview_plugin";

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter WebView Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      routes: {
        "/": (_) => new MyHomePage(title: "Flutter WebView Demo"),
        "/widget": (_) => new WebviewScaffold(
              url: selectedUrl,
              appBar: new AppBar(
                title: new Text("Widget webview"),
              ),
            )
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  // Instance of WebView plugin
  final flutterWebviewPlugin = new FlutterWebviewPlugin();

  // On destroy stream
  StreamSubscription _onDestroy;

  // On urlChanged stream
  StreamSubscription<String> _onUrlChanged;

  // On urlChanged stream
  StreamSubscription<WebViewStateChanged> _onStateChanged;

  TextEditingController _urlCtrl = new TextEditingController(text: selectedUrl);

  TextEditingController _codeCtrl =
      new TextEditingController(text: "window.navigator.userAgent");

  GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey();

  final _history = [];

  @override
  initState() {
    super.initState();

    flutterWebviewPlugin.close();

    _urlCtrl.addListener(() {
      selectedUrl = _urlCtrl.text;
    });

    // Add a listener to on destroy WebView, so you can make came actions.
    _onDestroy = flutterWebviewPlugin.onDestroy.listen((_) {
      if (mounted) {
        // Actions like show a info toast.
        _scaffoldKey.currentState
            .showSnackBar(new SnackBar(content: new Text("Webview Destroyed")));
      }
    });

    // Add a listener to on url changed
    _onUrlChanged = flutterWebviewPlugin.onUrlChanged.listen((String url) {
      if (mounted) {
        setState(() {
          _history.add("onUrlChanged: $url");
        });
      }
    });

    _onStateChanged =
        flutterWebviewPlugin.onStateChanged.listen((WebViewStateChanged state) {
      if (mounted) {
        setState(() {
          _history.add("onStateChanged: ${state.type} ${state.url}");
        });
      }
    });
  }

  @override
  void dispose() {
    // Every listener should be canceled, the same should be done with this stream.
    _onDestroy.cancel();
    _onUrlChanged.cancel();
    _onStateChanged.cancel();

    flutterWebviewPlugin.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      key: _scaffoldKey,
      appBar: new AppBar(
        title: new Text('Plugin example app'),
      ),
      body: new Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          new Container(
            padding: const EdgeInsets.all(24.0),
            child: new TextField(controller: _urlCtrl),
          ),
          new RaisedButton(
            onPressed: () {
              flutterWebviewPlugin.launch(selectedUrl,
                  rect: new Rect.fromLTWH(
                      0.0, 0.0, MediaQuery.of(context).size.width, 300.0),
                  userAgent: kAndroidUserAgent);
            },
            child: new Text("Open Webview (rect)"),
          ),
          new RaisedButton(
            onPressed: () {
              flutterWebviewPlugin.launch(selectedUrl, hidden: true);
            },
            child: new Text("Open 'hidden' Webview"),
          ),
          new RaisedButton(
            onPressed: () {
              flutterWebviewPlugin.launch(selectedUrl);
            },
            child: new Text("Open Fullscreen Webview"),
          ),
          new RaisedButton(
            onPressed: () {
              Navigator.of(context).pushNamed("/widget");
            },
            child: new Text("Open widget webview"),
          ),
          new Container(
            padding: const EdgeInsets.all(24.0),
            child: new TextField(controller: _codeCtrl),
          ),
          new RaisedButton(
            onPressed: () {
              Future<String> future =
                  flutterWebviewPlugin.evalJavascript(_codeCtrl.text);
              future.then((String result) {
                setState(() {
                  _history.add("eval: $result");
                });
              });
            },
            child: new Text("Eval some javascript"),
          ),
          new RaisedButton(
            onPressed: () {
              setState(() {
                _history.clear();
              });
              flutterWebviewPlugin.close();
            },
            child: new Text("Close"),
          ),
          new RaisedButton(
            onPressed: () {
              flutterWebviewPlugin.getCookies().then((m) {
                setState(() {
                  _history.add("cookies: $m");
                });
              });
            },
            child: new Text("Cookies"),
          ),
          new Text(_history.join("\n"))
        ],
      ),
    );
  }
}

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_webview_plugin: "^0.1.0+1"

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

Alternatively, your editor might support packages get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
        
Version Uploaded Documentation Archive
0.1.0+1 Jan 28, 2018 Go to the documentation of flutter_webview_plugin 0.1.0+1 Download flutter_webview_plugin 0.1.0+1 archive
0.1.0 Jan 28, 2018 Go to the documentation of flutter_webview_plugin 0.1.0 Download flutter_webview_plugin 0.1.0 archive
0.0.9+1 Dec 7, 2017 Go to the documentation of flutter_webview_plugin 0.0.9+1 Download flutter_webview_plugin 0.0.9+1 archive
0.0.9 Nov 7, 2017 Go to the documentation of flutter_webview_plugin 0.0.9 Download flutter_webview_plugin 0.0.9 archive
0.0.8 Oct 24, 2017 Go to the documentation of flutter_webview_plugin 0.0.8 Download flutter_webview_plugin 0.0.8 archive
0.0.6 Aug 19, 2017 Go to the documentation of flutter_webview_plugin 0.0.6 Download flutter_webview_plugin 0.0.6 archive
0.0.5 Jun 24, 2017 Go to the documentation of flutter_webview_plugin 0.0.5 Download flutter_webview_plugin 0.0.5 archive
0.0.4 Jun 20, 2017 Go to the documentation of flutter_webview_plugin 0.0.4 Download flutter_webview_plugin 0.0.4 archive
0.0.3 May 27, 2017 Go to the documentation of flutter_webview_plugin 0.0.3 Download flutter_webview_plugin 0.0.3 archive
0.0.2 May 14, 2017 Go to the documentation of flutter_webview_plugin 0.0.2 Download flutter_webview_plugin 0.0.2 archive

All 11 versions...

Analysis

This feature is new.
We welcome feedback.
More details: scoring.

We analyzed this package, and provided a score, details, and suggestions below.

  • completed on Feb 3, 2018
  • Dart: 2.0.0-dev.20.0
  • pana: 0.10.1
  • Flutter: 0.0.22

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
95 / 100
Health:
Code health derived from static analysis. [more]
99 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100 / 100
Overall score:
Weighted score of the above. [more]
97

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Suggestions

  • Package is pre-v1 release.

    While there is nothing inherently wrong with versions of 0.*.*, it usually means that the author is still experimenting with the general direction API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
flutter 0.0.0
Transitive dependencies
async 2.0.3
charcode 1.1.1
collection 1.14.5
http 0.11.3+16
http_parser 3.1.1
meta 1.1.1 1.1.2
path 1.5.1
sky_engine 0.0.99
source_span 1.4.0
string_scanner 1.0.2
typed_data 1.1.4 1.1.5
vector_math 2.0.5