Flutter 加载HTML
使用第三方的库 flutter_html
写这篇文章的时候（2019-04-25），最新版为 0.9.6。
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
class NewsDetailPage extends StatelessWidget {
NewsDetailPage({
Key key,
this.title: '文章详情',
}) : super(key: key);
String title;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(this.title),
),
body: Container(
margin: EdgeInsets.all(8),
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
child: Text('老兵不死，兴龙建材3:0大正铭晖', style: TextStyle(fontSize: 20),),
margin: EdgeInsets.fromLTRB(0, 0, 0, 8),
),
Container(
child: Text('佛山足球通 2019-01-18 15:42:54'),
margin: EdgeInsets.fromLTRB(0, 0, 0, 8),
),
SafeArea(
child: Html(
data:
"""<div align="center"><article id="pin_container" data-type="context"><div><p style="text-align: start;">4月6日，泽银集团2019年第二届佛山市足球协会杯的第四轮小组赛事，继续在三水人民体育场进行，这场由佛山兴龙建材足球队对阵大正铭晖生命加足球队，本轮赛事采取11人制小组积分制，分AB两组积分前两名出线。</p><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/1c0ea271bc61472fbf23df4bf5408d14" img_width="15902" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">第四轮第一场小组赛【佛山兴龙建材足球队VS大正铭晖生命加足球队】</p><p style="text-align: start;">【时间】2019年4月6日14:00</p><p style="text-align: start;">【战绩】3:0</p><p style="text-align: start;">【地点】三水人民体育场</p><p style="text-align: start;">【天气】28度</p><p style="text-align: start;">【气温】晴朗</p><p style="text-align: start;">比赛前，全体人员进行默哀仪式，缅怀英烈，悼念在四川木里森林火灾中牺牲的30位救火烈士。</p><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/fd16cf33c9fe439f80ab770581b601c2" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/cf1f5f827d094423a806bf6375256709" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">比赛开始，双方都是摆出442的阵容进行一个前期的试探，节奏稍显得较慢，第3分钟开始，兴龙队的由于自身的优势，对大正铭晖队展开压迫的攻势，可惜连续两个的射门都没有建功。接下来继续由兴龙队领衔进攻，大正铭晖队防守为主，守门员叶伟强的发挥不错，化解了两次的进攻威胁。由于大正铭晖队的防守严密，兴龙队的进攻一直没有成功。</p><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/4d499127b5654b598222f8b2ba4bd4ba" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/3d0c92bc6cd648ba8a3130ba9ebc1bf4" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">20分钟，大正铭晖队35号马荣亨在禁区手球，获得黄牌一张，裁判加罚点球，兴龙队9号林磊毅操刀罚球，守门员反应不到右侧破网，1:0。</p><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/6ee4f13cdce546139d0af87f69955b2c" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">接下来大正铭晖队也开始有几波防守反击，可惜没有把握好机会，球权又回到兴龙队，兴龙队继续对大正铭晖队展开狂攻，第37分钟，大正铭晖队守门员受伤退场，换上临时守门员，大正铭晖少打一人继续迎战。</p><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/6a8f77c24fdb49eda9df6a19906b4276" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">第42分钟，兴龙队10号项思澄左侧突破，交出一个漂亮的传中，越过大正铭晖队的守门员，兴龙队18号霍文波及时跟进，用胸口将皮球撞进球门，比分2:0，比分维持到上半场结束。</p><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/b09618e550db4ad393a8cb19b38b2034" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/61b3a50438144660bedc4f31c4e5a057" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">下半场，双方都有队员的更换，大正铭晖队人齐继续与兴龙队交锋。兴龙队也是继续包揽进攻，大正铭晖队的老兵也是把握每一次的进攻机会进行反击。35号马荣亨也是全队防守端最亮眼的表现，多次的防守调度发挥的不错。</p><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/6082333319574e4eb2d5e3a56da3a758" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">接下来是一个胶着的过程，双方队员都表现出十分高昂的战意，都有交出数次威胁的攻门，大正铭晖队没有因为落后两球而有丝毫的气馁，尽显体育精神，27号的冯国权两次的单刀射门也是十分漂亮，可惜都被兴龙队守门员没收。</p><div class="pgc-img" style="text-align: start;"><img src="http://p3.pstatp.com/large/pgc-image/b1771acfc3ff450da067839d28046381" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">下半场的30分钟内双方都是互交白卷，双方继续你来我往的进行交锋，大正铭晖队的一班老兵的状态也是越来越好，化解了兴龙队的几波进攻。</p><div class="pgc-img" style="text-align: start;"><img src="http://p1.pstatp.com/large/pgc-image/9804ba8ef5eb456b9a25cda34d490dc6" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">第86分钟，兴龙队一波中路突破，大正铭晖队的后卫也是防守到位，混乱中兴龙队12号邓国庆接到皮球，近距离将皮球踢进空门，比分扩大到3:0，接下来兴龙队继续扩大进攻力度，希望取得更多的战果，可惜双方都是没有进球，就这样比分维持到裁判的哨声响起，大正铭晖队的老兵们也是完成了佛山足协杯的最后一次亮相，将佛山足球的风采维持到了最后，为老兵喝彩！</p><div class="pgc-img" style="text-align: start;"><img src="http://p9.pstatp.com/large/pgc-image/cd6c37539d3e4f25827139baacc62019" img_width="7952" img_height="5304" alt="老兵不死，兴龙建材3:0大正铭晖" inline="0"><p class="pgc-img-caption" style="text-align: center;"></p></div><p style="text-align: start;">此次足协杯全程由泽银体育进行独家直播，关注“佛山足协”，“佛山足球通”，“体坛先锋”公众号均有直播间入口，届时会有大量奖金奖品在直播间放送，敬请大家关注！</p><p align="center"><img src="http://p9.pstatp.com/large/pgc-image/071aa15e85e4488f988925207dbd376b"></p><p><strong>更多精彩赛事请</strong></p><p><strong>长按识别二维码关注我们</strong></p></div></article></div>""",
),
),
],
),
),
),
);
}
}