flutter_widget_from_html 0.2.4+2

  • Readme
  • Changelog
  • Example
  • Installing
  • 95

Flutter Widget from HTML #

CirrusCI codecov Pub

A Flutter plugin for building Flutter-widget tree from html.

This package extends the flutter_widget_from_html_core package with extra functionalities by using external depedencies like cached_network_image or url_launcher. It should be good enough as a quick starting point but you can always use the core directly if you dislike the dependencies.

Usage #

To use this plugin, add flutter_widget_from_html as a dependency in your pubspec.yaml file.

See the Example app for inspiration.

Example #

Note: HtmlWidget.config is optional, see dartdoc for all available configuration keys and their default values.

const kHtml = """
<h1>Heading</h1>
<p>A paragraph with <strong>strong</strong> <em>emphasized</em> text.</p>
<ol>
  <li>List item number one</li>
  <li>
    Two
    <ul>
      <li>2.1 (nested)</li>
      <li>2.2</li>
    </ul>
  </li>
  <li>Three</li>
</ol>
<p>And YouTube video!</p>
<iframe src="https://www.youtube.com/embed/jNQXAC9IVRw" width="560" height="315"></iframe>
""";

class HelloWorldScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: Text('HelloWorldScreen'),
        ),
        body: HtmlWidget(
          kHtml,
          webView: true,
        ),
      );
}

Features #

HTML tags #

Below tags are the ones that have special meaning / styling, all other tags will be parsed as text.

  • A: underline, theme accent color, launch url via url_launcher, support base url resolver.
  • H1/H2/H3/H4/H5/H6
  • IFRAME via WebView. Available configurations:
    • .webView, default=false
    • .webViewJs, default=true
    • .webViewPadding
    • To render IFRAME as web view: set webView=true in config and setup iOS project manually.
    • If the IFRAME has no width and height attributes, the web view will be rendered initially in a 16:9 box and automatically resize itself afterwards.
  • IMG with support for asset (asset://), data uri and network image via CachedNetworkImage
  • LI/OL/UL with support for:
    • Attributes: type, start, reversed
    • Inline style list-style-type values: lower-alpha, upper-alpha, lower-latin, upper-latin, circle, decimal, disc, lower-roman, upper-roman, square
  • TABLE/CAPTION/THEAD/TBODY/TFOOT/TR/TD/TH with support for:
    • Attribute: <table border="1">
    • Inline style: <table style="border: 1px solid #f00">
  • VIDEO via chewie
  • ABBR, ACRONYM, ADDRESS, ARTICLE, ASIDE, B, BIG, BLOCKQUOTE, BR, CENTER, CITE, CODE, DD, DEL, DFN, DIV, DL, DT, EM, FIGCAPTION, FIGURE, FONT, FOOTER, HEADER, HR, I, INS, KBD, MAIN, NAV, P, PRE, Q, S, SAMP, SECTION, STRIKE, STRONG, TT, U, VAR

These tags and their contents will be ignored:

  • SCRIPT
  • STYLE

Inline stylings #

  • border-top, border-bottom: overline/underline with support for dashed/dotted/double/solid style
  • color: hex values only (#F00, #0F08, #00FF00 or #00FF0080)
  • font-family
  • font-size: absolute (e.g. xx-large), relative (larger, smaller) and value in em/px
  • font-style: italic/normal
  • font-weight: bold/normal/100..900
  • margin, margin-top, margin-right, margin-bottom, margin-left (values in px only)
  • text-align: center/justify/left/right
  • text-decoration: line-through/none/overline/underline

Extensibility #

See flutter_widget_from_html_core for details.

0.2.4+2 #

  • Add basic detection and support for Directionality widget during LI/OL/UL rendering (#115)
  • Fix bug LI has empty A (#112)

0.2.4+1 #

  • Improve caching logic (#112)
  • Fix extra space after BR tag (#111)
  • Fix cached image not being rendered on first build (#113)

0.2.4 #

  • Add support for type/start/reversed (LI/OL/UL) (#91)
  • Add support for tag FONT (#109)

0.2.3+4 #

  • Improve IMG error handling (#96)
  • Fix bug rendering nested list (OL/UL) with single child (#88)
  • Fix bug related to null widget (#94, #95)

0.2.3+3 #

  • Improve BR rendering to be consistent with browsers (#83, #84)
  • Improve TABLE rendering to support multiple tables (#85, #86)

0.2.3+2 #

  • Fix bug rendering empty TD tag (#81)
  • Improve white space rendering
  • Improve IMG rendering

0.2.3+1 #

  • Build RichText with proper textScaleFactor (#75, #78)

0.2.3 #

  • Re-implement text-align support to avoid conflicts (#66, #74)
  • Fix WebView bug triggering browser for http 301/302 urls
  • Improve performance when being put in list views (#62)

0.2.2+1 #

  • Update coding convention

0.2.2 #

  • Intercept all navigation requests within IFRAME (#48)
  • Add support for InlineSpan / inline image (PR #53, issue #7)
  • Add support for asset:// image (PR #52, issue #51)
  • Add support for new tag: VIDEO (PR #47, issue #46)

0.2.1+1 #

  • Merge textStyle with default for easy usage (#45)
  • Fix bug in whitespace handling (#44)

0.2.1 #

  • Add unsupportedWebViewWorkaroundForIssue37 to address WebView issue temporary (#37)
  • Render IMG inline whenever possible
  • Use accent color for tag A
  • Other bug fixes and improvements

0.2.0 #

  • Add support for new tags: ABBR ACRONYM ADDRESS ARTICLE ASIDE BIG BLOCKQUOTE CITE CENTER DD/DL/DT DEL DFN FIGURE FIGCAPTION FOOTER HEADER HR INS KBD MAIN MARK NAV Q S SAMP STRIKE SECTION SMALL TT VAR
  • Add support for table tags: TABLE CAPTION THEAD TBODY TFOOT TR TD TH
  • Add support for background-color
  • Add support for em CSS unit
  • Improve support for existing tags: BR H1 H2 H3 H4 H5 H6 IMG P PRE
  • Improve support for IFRAME: WebView can now resize itself to fit its contents
  • Simplify config for easy usage and customization
  • Fix bug using int.parse (#34)

0.1.5 #

  • Fix margin with partial invalid values (#21)

0.1.4 #

  • Update dependencies (#12)
  • Add support for web view (#19)

0.1.3 #

  • Update flutter_widget_from_html_core 0.1.3

0.1.2 #

  • Update flutter_widget_from_html_core 0.1.2

0.1.1 #

  • Update flutter_widget_from_html_core 0.1.1

0.0.1 #

  • First release

example/README.md

example #

See the full Example app for inspiration.

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_widget_from_html: ^0.2.4+2

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
93
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
90
Overall:
Weighted score of the above. [more]
95
Learn more about scoring.

We analyzed this package on Nov 15, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.0
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.6

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Maintenance issues and suggestions

Support latest dependencies. (-10 points)

The version constraint in pubspec.yaml does not support the latest published versions for 1 dependency (cached_network_image).

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.68.0 <3.0.0
cached_network_image ^1.1.2+1 1.1.3 2.0.0-rc.1
chewie ^0.9.8+1 0.9.8+1
flutter 0.0.0
flutter_widget_from_html_core ^0.2.4+2 0.2.4+2
html ^0.14.0+3 0.14.0+3
url_launcher ^5.2.5 5.2.5
video_player ^0.10.2+5 0.10.2+5
webview_flutter ^0.3.15+1 0.3.15+1
Transitive dependencies
async 2.4.0
charcode 1.1.2
collection 1.14.11 1.14.12
convert 2.1.1
crypto 2.1.3
csslib 0.16.1
flutter_cache_manager 1.1.3
http 0.12.0+2
http_parser 3.1.3
meta 1.1.7 1.1.8
open_iconic_flutter 0.3.0
path 1.6.4
path_provider 1.4.2
pedantic 1.8.0+1
platform 2.2.1
screen 0.0.5
sky_engine 0.0.99
source_span 1.5.5
sqflite 1.1.7+2
string_scanner 1.0.5
synchronized 2.1.0+1
term_glyph 1.1.0
typed_data 1.1.6
url_launcher_platform_interface 1.0.1
uuid 2.0.4
vector_math 2.0.8
Dev dependencies
flutter_test