Как сделать локальный файл HTML с веб-представлением - PullRequest
Новая
       13

Как сделать локальный файл HTML с веб-представлением

0 голосов
/ 18 декабря 2018

Я хочу отобразить локальный файл HTML, хранящийся в памяти моего телефона, в веб-просмотре, используя флаттер и дротик.

Ответы [ 4 ]

0 голосов
/ 09 августа 2019

распакуйте пакет apk, я нашел причину: неверный путь;

Для Android:

"assets/test.html" == "file:///android_asset/flutter_assets/assets/test.html"

так, вот так: 

WebView(
    initialUrl: "file:///android_asset/flutter_assets/assets/test.html",
    javascriptMode: JavascriptMode.unrestricted,
  )

вы можете загрузить «assets / test.html».

0 голосов
/ 13 марта 2019

Вот ответ немного подробнее.Я использую плагин webview_flutter от команды Flutter.

Шаги

  1. Добавить зависимость к pubspec.yaml :

    dependencies:
  webview_flutter: ^0.3.4

  2. Поместить HTML-файл в папку assets (см. this ).Я назову это help.html.

  3. Получить HTML-строку в коде и добавить ее в веб-просмотр. 

    import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:webview_flutter/webview_flutter.dart';


class HelpScreen extends StatefulWidget {
  @override
  HelpScreenState createState() {
    return HelpScreenState();
  }
}

class HelpScreenState extends State<HelpScreen> {
  WebViewController _controller;

  @override
  Widget build(BuildContext context) {
    _loadHtmlFromAssets();
    return Scaffold(
      appBar: AppBar(title: Text('Help')),
      body: WebView(
        initialUrl: '',
        onWebViewCreated: (WebViewController webViewController) {
          _controller = webViewController;
        },
      ),
    );
  }

  _loadHtmlFromAssets() async {
    String fileText = await rootBundle.loadString('assets/help.html');
    _controller.loadUrl( Uri.dataFromString(
        fileText,
        mimeType: 'text/html',
        encoding: Encoding.getByName('utf-8')
    ).toString());
  }
}

Примечания:

  • Поскольку мы загружаем html-файл асинхронно, я установил initialUrl в пустую строку (null вызывает исключение).Я не знаю, является ли это стандартной практикой, но, похоже, это работает.
  • Мне нужно было установить кодировку на UTF-8, потому что я получал сбой для символов не-ASCII.В любом случае, я считаю, что UTF-8 является стандартом для Интернета.
  • В iOS вам необходимо добавить ключ io.flutter.embedded_views_preview как true в файл Info.plist .Проверьте документы на наличие обновлений этого требования.

См. Также

0 голосов
/ 03 июня 2019

@ Suragch, ваш код не работает, когда вы его опубликовали, он говорит, что localUrl был вызван на нуль._loadHtmlFromAssets должен быть вызван после назначения контроллера: 

onWebViewCreated: (WebViewController webViewController) {
          _controller = webViewController;
          _loadHtmlFromAssets();
        }

Тогда все работает нормально :)

0 голосов
/ 18 декабря 2018

Вы можете передать URI данных 

Uri.dataFromString('<html><body>hello world</body></html>', mimeType: 'text/html').toString()

или запустить веб-сервер внутри Flutter и передать URL-адрес, указывающий на IP-адрес / порт, с которого сервер обслуживает файл.

См. Также обсуждение в https://github.com/fluttercommunity/flutter_webview_plugin/issues/23

См. https://flutter.io/docs/development/ui/assets-and-images#loading-text-assets о том, как загрузить строку из ресурсов.

См. https://flutter.io/docs/cookbook/persistence/reading-writing-files о том, как читать другие файлы..

...