Flutter: How show local html file in webview?

Question

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

1. Read the file as a string

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

2. prepare the 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());
  }
}