quill_html_editor 1.0.0-dev.3

HTML rich text editor for Android, iOS and Web, using the QuilJS library.

example/lib/main.dart

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

void main() {
  runApp(MaterialApp(debugShowCheckedModeBanner: false, home: MyApp()));
}

class MyApp extends StatelessWidget {
  MyApp({super.key});

  ///[controller] create a QuillEditorController to access the editor methods
  final QuillEditorController controller = QuillEditorController();
  final customToolBarList = [
    ToolBarStyle.bold,
    ToolBarStyle.italic,
    ToolBarStyle.align,
    ToolBarStyle.color,
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
          preferredSize: const Size.fromHeight(250), // Set this height
          child: Container(
            height: 90,
            color: Colors.cyan.shade50,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                ToolBar(
                  controller: controller,
                ),
              ],
            ),
          )),
      body: SafeArea(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            Expanded(
              child: QuillHtmlEditor(
                controller: controller,
                height: MediaQuery.of(context).size.height,
                isEnabled: true,
                // to disable the editor set isEnabled to false (default value is true)
              ),
            )
          ],
        ),
      ),
    );
  }

  /// to get the html text from editor
  void getHtmlText() async {
    String? htmlText = await controller.getText();
    debugPrint(htmlText.toString());
  }

  /// to set the html text to editor
  void setHtmlText(String text) async {
    await controller.setText(text);
  }

  /// to clear the editor
  void clearEditor() => controller.clear();

  /// to enable/disable the editor
  void enableEditor(bool enable) => controller.enableEditor(enable);
}