← ClaudeAtlas

flutter-quilllisted

Rich text editor (WYSIWYG)
noory-code/noory-ai · ★ 0 · AI & Automation · score 74
Install: claude install-skill noory-code/noory-ai
# Flutter Quill A rich text editor with support for bold, italic, lists, and image insertion. --- ## Installation ```bash flutter pub add flutter_quill ``` --- ## Quick Reference ### Basic Editor ```dart import 'package:flutter_quill/flutter_quill.dart'; class RichTextEditor extends StatefulWidget { @override State<RichTextEditor> createState() => _RichTextEditorState(); } class _RichTextEditorState extends State<RichTextEditor> { final QuillController _controller = QuillController.basic(); @override void dispose() { _controller.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Column( children: [ QuillSimpleToolbar(controller: _controller), Expanded( child: QuillEditor.basic(controller: _controller), ), ], ); } } ``` ### Load Initial Content ```dart // load from Delta JSON final json = jsonDecode(savedContent); final document = Document.fromJson(json); final controller = QuillController( document: document, selection: TextSelection.collapsed(offset: 0), ); // load from plain text final document = Document()..insert(0, 'Initial text'); ``` ### Save Content ```dart // save as Delta JSON final json = jsonEncode(_controller.document.toDelta().toJson()); await saveToDatabase(json); // convert to plain text final plainText = _controller.document.toPlainText(); ``` ### Custom Toolbar ```dart QuillSimpleToolbar( controller: _controller, config