Flutter：如何在 webview 中显示本地 html 文件？

Question

I use this plugin in my fluttter app - webview_flutter . I need show local html file in webview. This is not from assets, but I have path to this file. I try it:

1. Read file as string

   var file = File(_path); var data = await file.readAsString();

2. prepare string

   String _getHtml() { var html = Uri.dataFromString(data, mimeType: 'text/html').toString(); return html; }

3. Show this string in my webview

   WebView( initialUrl: _getHtml(), )

But I have get error(on step Uri.dataFromString):

How fix it? Any tips?

Answer 1

From here

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) {
    return Scaffold(
      appBar: AppBar(title: Text('Help')),
      body: WebView(
        initialUrl: 'about:blank',
        onWebViewCreated: (WebViewController webViewController) {
          _controller = webViewController;
          _loadHtmlFromAssets();
        },
      ),
    );
  }

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