Блог

Это может быть повторяющийся вопрос, поскольку я видел много вопросов, связанных с фреймами, webview и всем этим, но каждый из них меня еще больше смущает, когда я их изучаю. В настоящее время я использую WebView виджет для отображения webview в своем мобильном приложении. Сейчас я хочу создавать для Интернета, но WebView он не поддерживается для Интернета, поэтому я искал альтернативный подход. Я узнал об HtmlElementView этом из документации flutter. Пытаюсь исследовать это, но, похоже, я не могу найти какой-либо четкий способ, которым я должен использовать его для решения моей проблемы.

Вот мой код:

     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: '',
                ),
        ),
      ),
    );
  }
 

Из моего кода я создаю WebView , когда не компилируется для web, и создаю HtmlElementView , когда компилируется для web. Как бы мне ни было неприятно это говорить, на данный момент это все, что я знаю HtmlElementView . Из документов viewType нужно взять строку, о которой я ничего не знаю.

Что именно я хочу сделать? Загружаемое содержимое WebView является динамическим, поэтому я хочу загрузить то же самое в HtmlElementView . Любая помощь или, возможно, материалы, которые могли бы помочь мне в этом, были бы очень признательны, поскольку я новичок во всем этом. Спасибо.

В настоящее время я нахожусь в том же квесте и нашел этот удобный, простой пример:

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'),
      ),
    ),
  );
}
 

Это не идеально, но, похоже, делает то, что мне нужно. То есть я также заканчиваю проверку web так же, как и в вашем примере, и использую webview_flutter в противном случае.

На данный момент, похоже, это небольшой недостаток во всем этом, будем надеяться, что ситуация улучшится.