如何在flutter里显示html页面

（一）效果图

（二）代码，复制即运行

import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_html/style.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.deepPurple,
      ),
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}
//html代码
const htmlData="""

    
    
        
            
            
                
前言
                你好
                

                    Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。
                
                

                    它也是构建未来的Google Fuchsia应用的主要方式。
                
                

                    Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。
                
                

                    它也是构建未来的Google Fuchsia应用的主要方式。
                
                
 
                
目录
                
1本内容将帮助您了解以下内容：
                
一、我们如何收集和使用您的个人信息
                
二、我们如何使用 Cookies 和同类技术
                
三、我们如何共享、转让、公开披露您的个人信息
                
四、我们如何存储和保护您的个人信息
                
五、您如何访问和管理自己的个人信息
                
六、我们如何处理未成年人的个人信息
                
七、本政策如何更新
                
八、如何联系我们
                
 
                
2本内容将帮助您了解以下内容：
                
一、我们如何收集和使用您的个人信息
                
二、我们如何使用 Cookies 和同类技术
                
三、我们如何共享、转让、公开披露您的个人信息
                
四、我们如何存储和保护您的个人信息
                
五、您如何访问和管理自己的个人信息
                
六、我们如何处理未成年人的个人信息
                
七、本政策如何更新
                
八、如何联系我们
                
                
3本内容将帮助您了解以下内容：
                
一、我们如何收集和使用您的个人信息
                
二、我们如何使用 Cookies 和同类技术
                
三、我们如何共享、转让、公开披露您的个人信息
                
四、我们如何存储和保护您的个人信息
                
五、您如何访问和管理自己的个人信息
                
六、我们如何处理未成年人的个人信息
                
七、本政策如何更新
                
八、如何联系我们
                
 
                
结束
            
            
        
    
    
""";

class _MyHomePageState extends State {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text('flutter_html 示例'),
        centerTitle: true,
      ),
      body:
      SingleChildScrollView(
        child: Html(
          data: htmlData,//调用
///页面样式
          style: {
            "html": Style(
              backgroundColor: Colors.white,
            ),
            "h4":Style(
              width: 50,
              backgroundColor: Colors.lightBlueAccent,
            )
          },
        ),
      ),
    );
  }
}

（三）屏幕内容滚动组件补充
（1） ListView 可滚动的列表
（2） NestedScrollView 可以嵌套其它可滚动widget的widget
GridView 可滚动的二维空间数组
（3）SingleChildScrollView 有一个子widget的可滚动的widget，子内容超过父容器时可以滚动。
相当于没有延迟加载的ListView,适用于不超过屏幕太多内容的滚动效果
（4）Scrollable 实现了可滚动widget的交互模型，但不包含UI显示相关的逻辑
Scrollbar 一个Material Design 滚动条，表示当前滚动到了什么位置
（5）CustomScrollView 一个使用slivers创建自定义的滚动效的ScrollView
（6）NotificationListener 一个用来监听树上冒泡通知的widget。
（7）ScrollConfiguration 控制可滚动组件在子树中的表现行为。（8）RefreshIndicator Material Design下拉刷新指示器，包装一个可滚动widget