I want to implement the Rich Text Editor (WYSIWYG HTML Editor) for the Arabic Language in my Flutter App.
I've used the following Packages but they didn't work as required.
flutter_quill It has a problem with bullet alignment and default font.
html_editor_enhanced It provides the feature to add more Summernote RTL extensions, I tried but don't know how to implement it.
Code of flutter_quill
QuillController controller = QuillController.basic();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Flutter Quill'),
actions: [
IconButton(
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder: (context) => SecondEditor()));
},
icon: const Icon(Icons.edit_road)),
IconButton(
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder: (context) => SuperEditView()));
},
icon: const Icon(Icons.superscript)),
IconButton(
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => HtmlEditorExample(
title: 'aaa',
)));
},
icon: const Icon(Icons.html)),
],
),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: Directionality(
textDirection: TextDirection.ltr,
child: Column(
children: [
QuillToolbar.basic(
locale: const Locale('ar'),
showDirection: true,
showAlignmentButtons: true,
showDividers: false,
controller: controller,
showFontFamily: true,
showFontSize: false,
showInlineCode: false,
showListCheck: false,
showClearFormat: false,
showSearchButton: false,
fontFamilyValues: const {'JF Flat': 'jfflat', 'Flat Jooza': 'flatjooza'},
showSmallButton: true,
),
Expanded(
child: QuillEditor.basic(
controller: controller,
readOnly: false, // true for view only mode
locale: const Locale('ar'),
),
)
],
),
),
),
);
}
