Inline Android and iOS WebView

[eseidelGoogle]

Presumably this requires some compositor work, similar to maps or video?

[jxson]

Adding an example use case for this:

I have a hybrid Android application where some rendering is handled by a WebView but controls for things like navigation are handled by native UI widgets. I would like to port a version to Flutter, off the top of my head the requirements for getting this to work are:

• A way to add a WebView into the rendered tree so that it can live along side native widgets for things like navigation buttons.
• A way to allow interaction with JS in the WebView (something like [this](http://developer.android.com/reference/android/webkit/WebView.html#addJavascriptInterface%28java.lang.Object, java.lang.String%29)).
• A way to intercept HTTP requests from the WebView.

The last item here allows us to stream the contents of PDF files to the WebView. The current Android implementation intercepts HTTP requests from the WebView and streams back the contents of the requested PDF file. The implementation can be seen here.

I'm new to Flutter so I may have gotten some of the terminology wrong, let me know if you need clarification on anything.

[eseidelGoogle]

We're currently moving towards an approach of making it easier to use native views in conjunction with FlutterView:
https://docs.google.com/document/d/1DOfwpL6VojCAG_zjjcA_z5ekF7rTIohV8dWn2o7_IME/edit

[Hixie]

This is more about having a way to put a WebView within a Flutter widget tree, I think. As you say in your original comment, we need something similar for embedding videos or maps provided by a third-party non-Flutter library.

[owenthereal]

Any updates on integrating a webview with flutter?

[eseidelGoogle]

Looks like someone has started a plugin to do full screen webviews: https://github.com/dart-flitter/flutter_webview_plugin

[xster]

I think doing the activity subset is a great start. It would unlock a whole set of app types that would need getting an oauth token from a web login.

[sethladd]

FWIW: here's the PR for the iOS version of the webview plugin: fluttercommunity/flutter_webview_plugin#3

[lejard-h]

We now have the webview plugin on IOS thanks to @toufikzitouni 👍 https://pub.dartlang.org/packages/flutter_webview_plugin

[Hixie]

This is not on our short-term priority list. Moving to next milestone.

[csbenjamin]

It would be great to have a webview and a way to interacting with it. I want to show embedded YouTube video and to control the player. Right now I am using https://github.com/dart-flitter/flutter_webview_plugin, but I am using some hack for some situations. For example, I change the webview URL in JavaScript after the video ends in order to the flutter app to receive an event onUrlChange and then to close the webview.

[eseidelGoogle]

@csbenjamin Are you specifically looking for YouTube you prefer https://developers.google.com/youtube/android/player/ over a WebView to control? Or did you also need a WebView? If you're looking for a YouTube specific player, please file a new bug, that's definitely a reasonable request. :)

[csbenjamin]

Yes, I am looking for YouTube player. I don't need anything from webview, just a YouTube player. I will open a new issue. Thanks

[megatolya]

We have to open payment web form and this feature is blocker for us 😢

[lejard-h]

@megatolya the webview plugin cannot do the job for you ?

[megatolya]

@lejard-h
Unfortunately no. We need to have oppurtunity to render web forms in any place on the page. Not only on top of other content or on the separate page. Manually control scroll (to reposition webview) seems too complicated for us.

I understand that this issue is by-design problem but IMHO this feature is quite fundamental to ignore.

[zoechi]

@flddr Just because it is an important feature doesn't mean it is easy and quick to add. Rather the opposite.
You seem to assume that Google has unlimited resources and that adding enough additional developers to a team is enough to get instant results. Sadly that's not how the world works.

You can rest assured that the Flutter team is aware of this features importance and you can follow progress in https://github.com/flutter/plugins/tree/master/packages/webview_flutter

[ghost]

@zoechi ups, thanks, i did never want to say this 😕

My guess was, it was dropped morely in development to hold a gap between hybrids and natives, because the flutter UI itself is enormous powerful and clean, whereas the possibility to do things in a webview can end in lower quality (like, miss of material design or those points). Because webview is often miss-used for all things (quick n dirty)

Thanks for the link

[zoechi]

@flddr I think it's mostly that they don't want to rewrite a browser in Dart (for good reasons) and instead make native functionality available which required to implement additional capabilities for Flutter.
This capability became available recently and since then implementing webview is in progress.

https://pub.dartlang.org/packages/flutter_webview_plugin (community effort) is available since quite some time, but it had the disadvantage that it was always shown on top of Flutter widgets. For example opening a drawer menu opens it behind the webview if there is overlap.
The new plugin will work well with other Flutter widgets.

[ghost]

@zoechi you are right - i have overseen a rewrite in dart completely. I just know flutter is the future of app development in my opinion, the tooling is great, dart is great - but i couldn't dive deep in because i am developing my backend actually. I am just looking flutter.io daily and waiting for 1.0 - and sometimes, this hopeful waiting causes a talk about whatever, the main thing is something is happening.

Sorry for miss-talk about the webview

Btw: sorry, i know about all you guys how are beeing google, and all your hard work, but, yes, you are google. Nothing else. My first contact with google was the last day i used altavista.

So, if i could bet on a company who would win a race, i ever would bet on google.

Thanks for infos :) I have nothing more to say for this issue :)

[Rockvole]

Flutter uses Skia to render, and Chrome uses Skia to render so it seems like it should be an easy conversion. But you cannot add a browser into Flutter this way because any flutter apps would be banned from running on the apple store. Without cross platform ability Flutter would be abandoned. Google are right to take time with this issue.

https://www.howtogeek.com/184283/why-third-party-browsers-will-always-be-inferior-to-safari-on-iphone-and-ipad/

[ghost]

@Rockvole very interesting 👍

[pichillilorenzo]

Finally, I released a new version (v0.5.1) of flutter_inappbrowser where there is initial support of inline WebViews (InAppWebView class)! Obviously, this Widget is available only for Android at this moment and there are some limitations because AndroidView is not stable enough.

However, you can already play with it a little bit. There are a lot of functions and events that you can test and use! An example of an inline WebView can be found in the README.md file of the plugin repository.

EDIT 1: released new version (1.0.1) with support for both Android and iOS inline webview widget! 🎉

EDIT 2: it has been renamed to flutter_inappwebview. Current version is 2.0.1! There are a lot of new events, options and methods.

[imWildCat]

I am just curious: it is mentioned in Google Developer Days China (last month) that the official WebView plugin should be release with developer preview 2. However, this plugin webview_flutter is still in development: https://github.com/flutter/plugins/tree/master/packages/webview_flutter

[InMatrix]

@imWildCat Thank you for joining us at GDD China. To clarify, we demoed a preview of the WebView widget at GDD. I checked the video recording (55:12) of the GDD keynote to make sure we didn't say it's released. Nonetheless, we apologize that you were under the impression that this plugin had been released.

[imWildCat]

@InMatrix Sorry for my misunderstanding. Many thanks your explanation and I really appreciate it. I look forward to the release of the official WebView plugin.

[amirh]

flutter/plugins#890 added iOS support to the webview_flutter plugin.
The platform views embedding support, which the inline webview is based on, is still in early preview (see #19030 (comment) ).

Open issues are tagged with the platform-views and/or webview labels, please upvote the issues you care about to help us prioritize.

[amirh]

Note that if you want to try it out on iOS you will need to enable the preview flag, see more details on:
#19030 (comment)

[ZhennanWu]

The absence of a usable WebView is really a deal-breaker to me personally.
flutter_inappbrowser is a great package that comes very close to full usability but still lacks keyboard support yet. Unfortunately, I was just going to build a code editor app........

[ghost]

Congratulations to 1.0 for best mobile framework ever 🎉

Now waiting for webview ☺️

[amirh]

Just to clarify: The webview_flutter plugin provides an embedded WebView on Android and iOS and is currently in developers preview.

We are tracking issues and missing features with the webview tag, if you care about specific issues you can help by filing an issue if there's isn't one yet, or upvoting an existing issue. PRs are of course also welcomed 😄

[danielRi]

@amirh Sorry to hassle you with questions. We are heavily considering moving over to Flutter for a upcoming project, but we rely on a WebView to work (inline, flutter_webview_plugin is not an option). Do you have any information about upcoming updates or a roadmap for us? Thank you very much for any reply, keep up the great work and may the Flutter love spread around the world.

[zoechi]

@danielRi https://pub.dartlang.org/packages/webview_flutter

[kyawsithu]

Very interesting topic for my problem, I have come across to this topic after struggling a lot to find a right web view for flutter. Unfortunately, this new plugin (still developer preview) has a big issue with Android when I tried to open keyboard. Would that be fixed when it comes to release?

[droplet-js]

i think foreign function interface + webkit is best way. inline android webview or ios wkwebview is not good idea

[amirh]

i think foreign function interface + webkit is best way. inline android webview or ios wkwebview is not good idea

There are pros and cons (the obvious one is binary size).
I definitely see how for certain use case bundling a web engine would be the preferred choice.
It may be possible to add this as an alternative webview_flutter implementation by implementing the platform interface. If anyone gives it a shot I'm curious to lean about it!

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.