V2.1.9

CHANGELOG.md

@@ -1,3 +1,14 @@
+### 2.1.9
+- Added a customisable option to make toolbar scrollable horizontally or vertically
+- Fixed `onFocusChanged` method not returning focus on iOS properly
+- Fixed text-change method is not returning text properly on Android
+- Fixed moving cursor to end after `setDelta`
+- Fix the white space in theme dark mode after adding minHeight property, thanks to `cabbagelol` for PR
+- Fix Mobile Web- Clicking on toolbar icon does not toggle highlight color, and keyboard loses focus
+- Updated `webview_flutter_android`, `webview_flutter_wkwebview` to latest versions
+- Fix customToolBarList: ToolBarStyle.background adds table items #63
+- Improved `onEditorCreated` callback functionality
+
 ### 2.1.8
 - Added `setDelta` & `getDelta` methods,
 - Fixed bug:getText() returns empty string if QuillEditor contains only <img> or <iframe> tags

README.md

@@ -6,10 +6,12 @@ Quill Html Editor is a HTML rich text editor for Android, iOS, and Web, it is bu
 
 ## Features
 - Highly customizable **Editor** and **Toolbar** widgets
+- Supports `Delta` format, can pass delta with `setDelta`and get with `getDelta` methods.
 - Supports copy pasting the RichText from other files or webpages
 - Because the Toolbar is completely detached from editor, it can be placed anywhere in the page, as per the requirement
 - We can also add custom buttons to the toolbar
 - Supports Embedding Images, Videos, Inserting Tables
+- Set or get text in html/delta formats
 
 ## Quill Html Editor Demo
 Please go to [Demo Page](https://the-airbender.github.io/) to try out the Quill Editor on Web
@@ -131,10 +133,22 @@ We can also add custom buttons to our **ToolBar** as shown below
 ```dart
  await controller.setText(text);
 ```
+
+##### To get the text in delta format
+```dart
+ await controller.getDelta();
+```
+
+##### To set the text in delta format
+```dart
+ controller.setDelta(deltaMap);
+```
+
 ##### To insert the html string to editor
 ```dart
- await controller.insertText(text, index: 10);  /// index is optional
+/// index is optional
 /// If the index is not passed, the text will be inserted at the cursor position
+await controller.insertText(text, index: 10);  
 ```
 ##### To clear the editor
 ```dart

example/lib/main.dart

@@ -26,15 +26,21 @@ class _MyAppState extends State<MyApp> {
     ToolBarStyle.italic,
     ToolBarStyle.align,
     ToolBarStyle.color,
+    ToolBarStyle.background,
+    ToolBarStyle.listBullet,
+    ToolBarStyle.listOrdered,
+    ToolBarStyle.clean,
+    ToolBarStyle.addTable,
+    ToolBarStyle.editTable,
   ];
 
-  final _toolbarColor = Colors.greenAccent.shade100;
+  final _toolbarColor = Colors.grey.shade200;
   final _backgroundColor = Colors.white70;
   final _toolbarIconColor = Colors.black87;
   final _editorTextStyle = const TextStyle(
       fontSize: 18, color: Colors.black, fontWeight: FontWeight.normal);
   final _hintTextStyle = const TextStyle(
-      fontSize: 18, color: Colors.teal, fontWeight: FontWeight.normal);
+      fontSize: 18, color: Colors.black12, fontWeight: FontWeight.normal);
 
   @override
   void initState() {
@@ -56,41 +62,44 @@ class _MyAppState extends State<MyApp> {
   Widget build(BuildContext context) {
     return SafeArea(
       child: Scaffold(
+        backgroundColor: Colors.white,
         resizeToAvoidBottomInset: true,
-        backgroundColor: Colors.white70,
-        body: Column(
+        body: Row(
           crossAxisAlignment: CrossAxisAlignment.start,
           mainAxisAlignment: MainAxisAlignment.start,
           children: [
-            ToolBar(
-              toolBarColor: _toolbarColor,
-              padding: const EdgeInsets.all(8),
-              iconSize: 25,
-              iconColor: _toolbarIconColor,
-              activeIconColor: Colors.purple.shade300,
-              controller: controller,
-              alignment: WrapAlignment.start,
-              crossAxisAlignment: WrapCrossAlignment.center,
-              customButtons: [
-                InkWell(
-                    onTap: () => unFocusEditor(),
-                    child: const Icon(
-                      Icons.favorite,
-                      color: Colors.black,
-                    )),
-                InkWell(
-                    onTap: () async {
-                      var selectedText = await controller.getSelectedText();
-                      debugPrint('selectedText $selectedText');
-                      var selectedHtmlText =
-                          await controller.getSelectedHtmlText();
-                      debugPrint('selectedHtmlText $selectedHtmlText');
-                    },
-                    child: const Icon(
-                      Icons.add_circle,
-                      color: Colors.black,
-                    )),
-              ],
+            SizedBox(
+              width: 50,
+              child: ToolBar.scroll(
+                toolBarColor: _toolbarColor,
+                padding: const EdgeInsets.all(8),
+                iconSize: 25,
+                iconColor: _toolbarIconColor,
+                activeIconColor: Colors.greenAccent.shade400,
+                controller: controller,
+                crossAxisAlignment: CrossAxisAlignment.center,
+                direction: Axis.vertical,
+                customButtons: [
+                  InkWell(
+                      onTap: () => unFocusEditor(),
+                      child: const Icon(
+                        Icons.favorite,
+                        color: Colors.black,
+                      )),
+                  InkWell(
+                      onTap: () async {
+                        var selectedText = await controller.getSelectedText();
+                        debugPrint('selectedText $selectedText');
+                        var selectedHtmlText =
+                            await controller.getSelectedHtmlText();
+                        debugPrint('selectedHtmlText $selectedHtmlText');
+                      },
+                      child: const Icon(
+                        Icons.add_circle,
+                        color: Colors.black,
+                      )),
+                ],
+              ),
             ),
             Flexible(
               fit: FlexFit.tight,
@@ -99,16 +108,19 @@ class _MyAppState extends State<MyApp> {
                 hintText: 'Hint text goes here',
                 controller: controller,
                 isEnabled: true,
-                minHeight: 300,
+                minHeight: 500,
                 textStyle: _editorTextStyle,
                 hintTextStyle: _hintTextStyle,
                 hintTextAlign: TextAlign.start,
-                padding: const EdgeInsets.only(left: 0, top: 0),
+                padding: const EdgeInsets.only(left: 10, top: 10),
                 hintTextPadding: const EdgeInsets.only(left: 20),
                 backgroundColor: _backgroundColor,
                 onFocusChanged: (hasFocus) => debugPrint('has focus $hasFocus'),
                 onTextChanged: (text) => debugPrint('widget text change $text'),
-                onEditorCreated: () => debugPrint('Editor has been loaded'),
+                onEditorCreated: () {
+                  debugPrint('Editor has been loaded');
+                  setHtmlText('Testing text on load');
+                },
                 onEditorResized: (height) =>
                     debugPrint('Editor resized $height'),
                 onSelectionChanged: (sel) =>
@@ -127,8 +139,7 @@ class _MyAppState extends State<MyApp> {
                 textButton(
                     text: 'Set Text',
                     onPressed: () {
-                      setHtmlText(
-                          '<iframe src="https://www.youtube.com/embed/JCDfh5bs1xc" width="100%" height="315"</iframe>');
+                      setHtmlText('This text is set by you 🫵');
                     }),
                 textButton(
                     text: 'Get Text',

example/pubspec.lock

@@ -238,7 +238,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "2.1.7"
+    version: "2.1.9"
   sky_engine:
     dependency: transitive
     description: flutter
@@ -328,10 +328,10 @@ packages:
     dependency: transitive
     description:
       name: webview_flutter_android
-      sha256: "9e223788e1954087dac30d813dc151f8e12f09f1139f116ce20b5658893f3627"
+      sha256: "5906c9aa8c88ed372b2ad3c88c942790b4fb16f73fdd1c0647b4d747d9cf5b3f"
       url: "https://pub.dev"
     source: hosted
-    version: "3.4.4"
+    version: "3.4.5"
   webview_flutter_platform_interface:
     dependency: transitive
     description:
@@ -344,10 +344,10 @@ packages:
     dependency: transitive
     description:
       name: webview_flutter_wkwebview
-      sha256: d601aba11ad8d4481e17a34a76fa1d30dee92dcbbe2c58b0df3120e9453099c7
+      sha256: "9a78d963cce191dd6a9df547301fc5c008bf3dae95a323ec281fff1284e0a037"
       url: "https://pub.dev"
     source: hosted
-    version: "3.2.3"
+    version: "3.2.4"
   win32:
     dependency: transitive
     description: