menu

light_html_editor package
documentation

light_html_editor package

dark_modelight_mode

Flutter HTML Editor

Flutter HTML Editor is a simple HTML-based Richtext editor, which is able to edit and parse a selected set of HTML tags into a Flutter widget.

Check out the some usage examples to see how the package can be used.

Features

Code Editor where HTML text can be written with an optional preview output
Richtext-Renderer which takes in HTML produced by the editor and converts it into a widget
Customization options for Editor and Renderer
Use Variables in the text
Written purely in Dart

Usage

Import the package import 'package:light_html_editor/light_html_editor.dart';
Create an environment with a finite width, as the widgets will take up all available horizontal space
Instantiate RichTextEditor or RichTextRenderer
Set desired parameters like the onChanged callbacks for retrieving the richtext

Examples

Simple usage without fancy settings

SizedBox(
    width: 400,
    child: RichTextEditor(
        onChanged: (String html) {
            // called every time the code in the input text is changed
            // do something with the richtext
        },
    ),
),

Example Output of Flutter HTML Editor

Variables

SizedBox(
    width: 400,
    child: RichTextEditor(
    placeholders: [
        RichTextPlaceholder(
        "VAR",
        "Some longer text that got shortened!",
        ),
    ],
    onChanged: (String html) {
        // do something with the richtext
      },
    ),
),

Example Output with variables

Libraries