How to convert flutter_web_view to HtmlElementView on web mode
I'm currently on the same quest and found this handy, simple example:
https://codepen.io/riccio85/pen/wvMeaMe
import 'dart:html';
import 'dart:ui' as ui;
import 'package:flutter/material.dart';
void main() {
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory(
'hello-html',
(int viewId) => IFrameElement()
..width = '500'
..height = '360'
..src = 'https://www.youtube.com/embed/xg4S67ZvsRs'
..style.border = 'none');
runApp( Padding(
padding: EdgeInsets.all(25),
child: SizedBox(
width: 640,
height: 360,
child: HtmlElementView(viewType: 'hello-html'),
),
),
);
}
It's not perfect but it seems to do what I need to. Which is to say, I also end up checking for web in the same way as your example and use webview_flutter
otherwise.
Seems to be a bit of a shortcoming with the whole thing at the moment, let's hope the situation improves.
emmaakachukwu
Updated on December 17, 2022Comments
-
emmaakachukwu over 1 year
This may be a duplicate question as I have seen a lot of questions that has to do with iframes, webview and all that but each one gets me more confused as I study them. Currently I am making use of the
WebView
widget to display a webview in my mobile app. I wish to build for the web now butWebView
is not supported for web so I have been seeking for an alternative approach. I got to know aboutHtmlElementView
from the flutter documentation. Trying to research into it but I can not seem to find any clear way I am supposed to use it to solve my problem.Here is my code:
Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Container( margin: EdgeInsets.fromLTRB(0, 15, 0, 0), child: !kIsWeb ? WebView( initialUrl: this.widget._url, javascriptMode: JavascriptMode.unrestricted, onPageStarted: this._pageStarted, ) : HtmlElementView( viewType: '', ), ), ), ); }
From my code, I am building the
WebView
when not compiled for web and buildingHtmlElementView
when compiled for web. As much as I hate to say it, this is as far as my knowledge can go for now onHtmlElementView
. From the docs,viewType
is to take a String which I do not really know anything about.What I wish to do exactly? The contents loaded in
WebView
is kind of dynamic so I wish to load same in theHtmlElementView
. Any help or maybe materials that could help me in this would be so much appreciated as I am new to all these. Thanks.