SelectableHtml constructor

SelectableHtml({
  1. Key? key,
  2. GlobalKey<State<StatefulWidget>>? anchorKey,
  3. required String? data,
  4. OnTap? onLinkTap,
  5. OnTap? onAnchorTap,
  6. OnCssParseError? onCssParseError,
  7. bool shrinkWrap = false,
  8. Map<String, Style> style = const {},
  9. Map<CustomRenderMatcher, SelectableCustomRender> customRenders = const {},
  10. List<String> tagsList = const [],
  11. TextSelectionControls? selectionControls,
  12. ScrollPhysics? scrollPhysics,
})

The SelectableHtml widget takes HTML as input and displays a RichText tree of the parsed HTML content (which is selectable)

Attributes data required takes in a String of HTML data (required only for Html constructor). documentElement required takes in a Element of HTML data (required only for Html.fromDom and Html.fromElement constructor).

onLinkTap This function is called whenever a link (<a href>) is tapped.

onAnchorTap This function is called whenever an anchor (#anchor-id) is tapped.

tagsList Tag names in this array will be the only tags rendered. By default, all tags that support selectable content are rendered.

style Pass in the style information for the Html here. See its wiki page for more info.

PLEASE NOTE

There are a few caveats due to Flutter #38474:

  1. The list of tags that can be rendered is significantly reduced. Key omissions include no support for images/video/audio, table, and ul/ol because they all require widgets and WidgetSpans.

  2. No support for customRender, customImageRender, onImageError, onImageTap, onMathError, and navigationDelegateForIframe.

  3. Styling support is significantly reduced. Only text-related styling works (e.g. bold or italic), while container related styling (e.g. borders or padding/margin) do not work because we can't use the ContainerSpan class (it needs an enclosing WidgetSpan).

Implementation

SelectableHtml({
  super.key,
  GlobalKey? anchorKey,
  required this.data,
  this.onLinkTap,
  this.onAnchorTap,
  this.onCssParseError,
  this.shrinkWrap = false,
  this.style = const {},
  this.customRenders = const {},
  this.tagsList = const [],
  this.selectionControls,
  this.scrollPhysics,
})  : documentElement = null,
      assert(data != null),
      _anchorKey = anchorKey ?? GlobalKey();