Flutter-Html

Flutter-Html

一个Flutter小部件，用于将HTML和CSS呈现为Flutter小部件。
使用时参考链接：https://pub.dev/packages/flutter_html

data内是html，在Html()还可以配置style等属性

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

class HtmlPage extends StatefulWidget {
    
    
  HtmlPage({
    
    Key? key}) : super(key: key);

  @override
  State<HtmlPage> createState() => _HtmlPageState();
}

class _HtmlPageState extends State<HtmlPage> {
    
    
  @override
  Widget build(BuildContext context) {
    
    
    return Html(
      data: """<div>
        <h1>Demo Page</h1>
        <p>This is a fantastic product that you should buy!</p>
        <h3>Features</h3>
        <ul>
          <li>It actually works</li>
          <li>It exists</li>
          <li>It doesn't cost much!</li>
        </ul>
        <!--You can pretty much put any html in here!-->
      </div>""",
      style: {
    
    
        "h1":Style(
          fontSize: FontSize.em(5)
        ),
        "html": Style(
          backgroundColor: Colors.white,
        ),
        "p": Style(fontSize: FontSize.large),
        "table": Style(
          backgroundColor: Color.fromARGB(0x50, 0xee, 0xee, 0xee),
        ),
        "tr": Style(
          border: Border(bottom: BorderSide(color: Colors.grey)),
        ),
        "th": Style(
          padding: EdgeInsets.all(6),
          backgroundColor: Colors.grey,
        ),
        "td": Style(
          padding: EdgeInsets.all(6),
          alignment: Alignment.topLeft,
        ),
      },
    );
  }
}