[web] use HtmlElement inside a Widget like HtmlElementView in Flutter Web #49634
Description
The official Flutter Web example not longer working on Flutter Channel Dev.
Example:
import 'dart:html';
import 'package:flutter_web_ui/ui.dart' as ui;
import 'package:flutter_web/material.dart';
void main() {
ui.platformViewRegistry.registerViewFactory(
'hello-world-html',
(int viewId) => IFrameElement()
..width = '640'
..height = '360'
..src = 'https://www.youtube.com/embed/IyFZznAk69U'
..style.border = 'none');
runApp(Directionality(
textDirection: TextDirection.ltr,
child: SizedBox(
width: 640,
height: 360,
child: HtmlElementView(viewType: 'hello-world-html'),
),
));
}
Current PlatformViewsRegistry only has the method "getNextPlatformViewId" and not longer "registerViewFactory"
PlatformViewsRegistry - platform_views.dart:
/// The [PlatformViewsRegistry] responsible for generating unique identifiers for platform views.
final PlatformViewsRegistry platformViewsRegistry = PlatformViewsRegistry._instance();
/// A registry responsible for generating unique identifier for platform views.
///
/// A Flutter application has a single [PlatformViewsRegistry] which can be accesses
/// through the [platformViewsRegistry] getter.
class PlatformViewsRegistry {
PlatformViewsRegistry._instance();
// Always non-negative. The id value -1 is used in the accessibility bridge
// to indicate the absence of a platform view.
int _nextPlatformViewId = 0;
/// Allocates a unique identifier for a platform view.
///
/// A platform view identifier can refer to a platform view that was never created,
/// a platform view that was disposed, or a platform view that is alive.
///
/// Typically a platform view identifier is passed to a [PlatformView] widget
/// which creates the platform view and manages its lifecycle.
int getNextPlatformViewId() => _nextPlatformViewId++;
}
Flutter Doctor:
[✓] Flutter (Channel dev, v1.14.5, on Mac OS X 10.14.5 18F132, locale en-US)
• Flutter version 1.14.5 at /Users/username/Documents/flutter
• Framework revision 92cbaa3efe (5 days ago), 2020-01-24 05:43:01 +0100
• Engine revision 439a21816e
• Dart version 2.8.0 (build 2.8.0-dev.5.0 e84bea25df)
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/username/Library/Android/sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-29, build-tools 29.0.2
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 11.3.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 11.3.1, Build version 11C504
• CocoaPods version 1.6.1
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 3.5)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 42.1.1
• Dart plugin version 191.8593
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
[✓] IntelliJ IDEA Community Edition (version 2019.1.3)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin version 36.1.4
• Dart plugin version 191.7830
[✓] VS Code (version 1.38.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.4.1
[✓] Connected device (2 available)
• Chrome • chrome • web-javascript • Google Chrome 79.0.3945.130
• Web Server • web-server • web-javascript • Flutter Tools
• No issues found!
Notes:
There no current example/method to add HtmlElement into Widgets like HtmlElementView used to do thank to "registerViewFactory":
HtmlElementView(viewType:"string-key");