Fixes toolbar buttons stealing focus from editor. (#956)

3 years ago · ab6174d8fa
parent a855f59922
commit ab6174d8fa
18 changed files with 186 additions and 33 deletions
--- a/.gitignore
+++ b/.gitignore
@ -18,7 +18,7 @@
 # The .vscode folder contains launch configuration and tasks you configure in
 # VS Code which you may wish to be included in version control, so this line
 # is commented out by default.
-#.vscode/
+.vscode/

 # Flutter/Dart/Pub related
 **/doc/api/
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@ -0,0 +1,65 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "name": "flutter-quill",
+            "request": "launch",
+            "type": "dart"
+        },
+        {
+            "name": "flutter-quill (profile mode)",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "profile"
+        },
+        {
+            "name": "flutter-quill (release mode)",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "release"
+        },
+        {
+            "name": "example",
+            "cwd": "example",
+            "request": "launch",
+            "type": "dart"
+        },
+        {
+            "name": "example (profile mode)",
+            "cwd": "example",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "profile"
+        },
+        {
+            "name": "example (release mode)",
+            "cwd": "example",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "release"
+        },
+        {
+            "name": "flutter_quill_extensions",
+            "cwd": "flutter_quill_extensions",
+            "request": "launch",
+            "type": "dart"
+        },
+        {
+            "name": "flutter_quill_extensions (profile mode)",
+            "cwd": "flutter_quill_extensions",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "profile"
+        },
+        {
+            "name": "flutter_quill_extensions (release mode)",
+            "cwd": "flutter_quill_extensions",
+            "request": "launch",
+            "type": "dart",
+            "flutterMode": "release"
+        }
+    ]
+}
--- a/example/lib/pages/home_page.dart
+++ b/example/lib/pages/home_page.dart
@ -169,6 +169,7 @@ class _HomePageState extends State<HomePage> {
        // cameraPickSettingSelector: _selectCameraPickSetting,
      ),
      showAlignmentButtons: true,
+      afterButtonPressed: _focusNode.requestFocus,
    );
    if (kIsWeb) {
      toolbar = QuillToolbar.basic(
@ -178,6 +179,7 @@ class _HomePageState extends State<HomePage> {
          webImagePickImpl: _webImagePickImpl,
        ),
        showAlignmentButtons: true,
+        afterButtonPressed: _focusNode.requestFocus,
      );
    }
    if (_isDesktop()) {
@ -188,6 +190,7 @@ class _HomePageState extends State<HomePage> {
          filePickImpl: openFileSystemPickerForDesktop,
        ),
        showAlignmentButtons: true,
+        afterButtonPressed: _focusNode.requestFocus,
      );
    }

--- a/example/linux/flutter/CMakeLists.txt
+++ b/example/linux/flutter/CMakeLists.txt
@ -82,7 +82,7 @@ add_custom_command(
  COMMAND ${CMAKE_COMMAND} -E env
    ${FLUTTER_TOOL_ENVIRONMENT}
    "${FLUTTER_ROOT}/packages/flutter_tools/bin/tool_backend.sh"
-      linux-x64 ${CMAKE_BUILD_TYPE}
+      ${FLUTTER_TARGET_PLATFORM} ${CMAKE_BUILD_TYPE}
  VERBATIM
 )
 add_custom_target(flutter_assemble DEPENDS
--- a/lib/src/widgets/toolbar.dart
+++ b/lib/src/widgets/toolbar.dart
@ -52,6 +52,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
    this.color,
    this.customButtons = const [],
    this.locale,
+    VoidCallback? afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -108,6 +109,10 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
    ///shown when embedding an image, for example
    QuillDialogTheme? dialogTheme,

+    /// Callback to be called after any button on the toolbar is pressed.
+    /// Is called after whatever logic the button performs has run.
+    VoidCallback? afterButtonPressed,
+
    /// The locale to use for the editor toolbar, defaults to system locale
    /// More at https://github.com/singerdmx/flutter-quill#translation
    Locale? locale,
@ -168,6 +173,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
      multiRowsDisplay: multiRowsDisplay,
      customButtons: customButtons,
      locale: locale,
+      afterButtonPressed: afterButtonPressed,
      children: [
        if (showUndo)
          HistoryButton(
@ -176,6 +182,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            undo: true,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showRedo)
          HistoryButton(
@ -184,6 +191,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            undo: false,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showFontFamily)
          QuillFontFamilyButton(
@ -207,6 +215,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
                  'font', newFont == 'Clear' ? null : newFont));
            },
            rawItemsMap: fontFamilies,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showFontSize)
          QuillFontSizeButton(
@ -229,6 +238,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
                  'size', newSize == '0' ? null : getFontSize(newSize)));
            },
            rawItemsMap: fontSizes,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showBoldButton)
          ToggleStyleButton(
@ -237,6 +247,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showItalicButton)
          ToggleStyleButton(
@ -245,6 +256,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showSmallButton)
          ToggleStyleButton(
@ -253,6 +265,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showUnderLineButton)
          ToggleStyleButton(
@ -261,6 +274,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showStrikeThrough)
          ToggleStyleButton(
@ -269,6 +283,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showInlineCode)
          ToggleStyleButton(
@ -277,6 +292,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showColorButton)
          ColorButton(
@ -285,6 +301,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            background: false,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showBackgroundColorButton)
          ColorButton(
@ -293,6 +310,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            background: true,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showClearFormat)
          ClearFormatButton(
@ -300,6 +318,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            controller: controller,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (embedButtons != null)
          for (final builder in embedButtons)
@ -325,6 +344,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            showCenterAlignment: showCenterAlignment,
            showRightAlignment: showRightAlignment,
            showJustifyAlignment: showJustifyAlignment,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showDirection)
          ToggleStyleButton(
@ -333,6 +353,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.format_textdirection_r_to_l,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showDividers &&
            isButtonGroupShown[1] &&
@ -350,6 +371,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showDividers &&
            showHeaderStyle &&
@ -369,6 +391,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.format_list_numbered,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showListBullets)
          ToggleStyleButton(
@ -377,6 +400,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.format_list_bulleted,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showListCheck)
          ToggleCheckListButton(
@ -385,6 +409,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.check_box,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showCodeBlock)
          ToggleStyleButton(
@ -393,6 +418,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.code,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showDividers &&
            isButtonGroupShown[3] &&
@ -409,6 +435,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            icon: Icons.format_quote,
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showIndent)
          IndentButton(
@ -417,6 +444,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            isIncrease: true,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showIndent)
          IndentButton(
@ -425,6 +453,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            isIncrease: false,
            iconTheme: iconTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showDividers && isButtonGroupShown[4] && isButtonGroupShown[5])
          VerticalDivider(
@ -438,6 +467,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            iconSize: toolbarIconSize,
            iconTheme: iconTheme,
            dialogTheme: dialogTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (showSearchButton)
          SearchButton(
@ -446,6 +476,7 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            controller: controller,
            iconTheme: iconTheme,
            dialogTheme: dialogTheme,
+            afterButtonPressed: afterButtonPressed,
          ),
        if (customButtons.isNotEmpty)
          if (showDividers)
@ -456,12 +487,14 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
            ),
        for (var customButton in customButtons)
          QuillIconButton(
-              highlightElevation: 0,
-              hoverElevation: 0,
-              size: toolbarIconSize * kIconButtonFactor,
-              icon: Icon(customButton.icon, size: toolbarIconSize),
-              borderRadius: iconTheme?.borderRadius ?? 2,
-              onPressed: customButton.onTap),
+            highlightElevation: 0,
+            hoverElevation: 0,
+            size: toolbarIconSize * kIconButtonFactor,
+            icon: Icon(customButton.icon, size: toolbarIconSize),
+            borderRadius: iconTheme?.borderRadius ?? 2,
+            onPressed: customButton.onTap,
+            afterPressed: afterButtonPressed,
+          ),
      ],
    );
  }
--- a/lib/src/widgets/toolbar/clear_format_button.dart
+++ b/lib/src/widgets/toolbar/clear_format_button.dart
@ -8,6 +8,7 @@ class ClearFormatButton extends StatefulWidget {
    required this.controller,
    this.iconSize = kDefaultIconSize,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -17,6 +18,7 @@ class ClearFormatButton extends StatefulWidget {
  final QuillController controller;

  final QuillIconTheme? iconTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  _ClearFormatButtonState createState() => _ClearFormatButtonState();
@ -31,22 +33,24 @@ class _ClearFormatButtonState extends State<ClearFormatButton> {
    final fillColor =
        widget.iconTheme?.iconUnselectedFillColor ?? theme.canvasColor;
    return QuillIconButton(
-        highlightElevation: 0,
-        hoverElevation: 0,
-        size: widget.iconSize * kIconButtonFactor,
-        icon: Icon(widget.icon, size: widget.iconSize, color: iconColor),
-        fillColor: fillColor,
-        borderRadius: widget.iconTheme?.borderRadius ?? 2,
-        onPressed: () {
-          final attrs = <Attribute>{};
-          for (final style in widget.controller.getAllSelectionStyles()) {
-            for (final attr in style.attributes.values) {
-              attrs.add(attr);
-            }
+      highlightElevation: 0,
+      hoverElevation: 0,
+      size: widget.iconSize * kIconButtonFactor,
+      icon: Icon(widget.icon, size: widget.iconSize, color: iconColor),
+      fillColor: fillColor,
+      borderRadius: widget.iconTheme?.borderRadius ?? 2,
+      onPressed: () {
+        final attrs = <Attribute>{};
+        for (final style in widget.controller.getAllSelectionStyles()) {
+          for (final attr in style.attributes.values) {
+            attrs.add(attr);
          }
-          for (final attr in attrs) {
-            widget.controller.formatSelection(Attribute.clone(attr, null));
-          }
-        });
+        }
+        for (final attr in attrs) {
+          widget.controller.formatSelection(Attribute.clone(attr, null));
+        }
+      },
+      afterPressed: widget.afterButtonPressed,
+    );
  }
 }
--- a/lib/src/widgets/toolbar/color_button.dart
+++ b/lib/src/widgets/toolbar/color_button.dart
@ -20,6 +20,7 @@ class ColorButton extends StatefulWidget {
    required this.background,
    this.iconSize = kDefaultIconSize,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -28,6 +29,7 @@ class ColorButton extends StatefulWidget {
  final bool background;
  final QuillController controller;
  final QuillIconTheme? iconTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  _ColorButtonState createState() => _ColorButtonState();
@ -126,6 +128,7 @@ class _ColorButtonState extends State<ColorButton> {
      fillColor: widget.background ? fillColorBackground : fillColor,
      borderRadius: widget.iconTheme?.borderRadius ?? 2,
      onPressed: _showColorPicker,
+      afterPressed: widget.afterButtonPressed,
    );
  }

--- a/lib/src/widgets/toolbar/history_button.dart
+++ b/lib/src/widgets/toolbar/history_button.dart
@ -9,6 +9,7 @@ class HistoryButton extends StatefulWidget {
    required this.undo,
    this.iconSize = kDefaultIconSize,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -17,6 +18,7 @@ class HistoryButton extends StatefulWidget {
  final bool undo;
  final QuillController controller;
  final QuillIconTheme? iconTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  _HistoryButtonState createState() => _HistoryButtonState();
@ -44,6 +46,7 @@ class _HistoryButtonState extends State<HistoryButton> {
      fillColor: fillColor,
      borderRadius: widget.iconTheme?.borderRadius ?? 2,
      onPressed: _changeHistory,
+      afterPressed: widget.afterButtonPressed,
    );
  }

--- a/lib/src/widgets/toolbar/indent_button.dart
+++ b/lib/src/widgets/toolbar/indent_button.dart
@ -9,6 +9,7 @@ class IndentButton extends StatefulWidget {
    required this.isIncrease,
    this.iconSize = kDefaultIconSize,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -16,6 +17,7 @@ class IndentButton extends StatefulWidget {
  final double iconSize;
  final QuillController controller;
  final bool isIncrease;
+  final VoidCallback? afterButtonPressed;

  final QuillIconTheme? iconTheme;

@ -62,6 +64,7 @@ class _IndentButtonState extends State<IndentButton> {
        widget.controller
            .formatSelection(Attribute.getIndentLevel(indent.value - 1));
      },
+      afterPressed: widget.afterButtonPressed,
    );
  }
 }
--- a/lib/src/widgets/toolbar/link_style_button.dart
+++ b/lib/src/widgets/toolbar/link_style_button.dart
@ -17,6 +17,7 @@ class LinkStyleButton extends StatefulWidget {
    this.icon,
    this.iconTheme,
    this.dialogTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -25,6 +26,7 @@ class LinkStyleButton extends StatefulWidget {
  final double iconSize;
  final QuillIconTheme? iconTheme;
  final QuillDialogTheme? dialogTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  _LinkStyleButtonState createState() => _LinkStyleButtonState();
@ -79,6 +81,7 @@ class _LinkStyleButtonState extends State<LinkStyleButton> {
          : (widget.iconTheme?.iconUnselectedFillColor ?? theme.canvasColor),
      borderRadius: widget.iconTheme?.borderRadius ?? 2,
      onPressed: pressedHandler,
+      afterPressed: widget.afterButtonPressed,
    );
  }

--- a/lib/src/widgets/toolbar/quill_font_family_button.dart
+++ b/lib/src/widgets/toolbar/quill_font_family_button.dart
@ -18,6 +18,7 @@ class QuillFontFamilyButton extends StatefulWidget {
    this.hoverElevation = 1,
    this.highlightElevation = 1,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -31,6 +32,7 @@ class QuillFontFamilyButton extends StatefulWidget {
  final QuillIconTheme? iconTheme;
  final Attribute attribute;
  final QuillController controller;
+  final VoidCallback? afterButtonPressed;

  @override
  _QuillFontFamilyButtonState createState() => _QuillFontFamilyButtonState();
@ -95,7 +97,10 @@ class _QuillFontFamilyButtonState extends State<QuillFontFamilyButton> {
        elevation: 0,
        hoverElevation: widget.hoverElevation,
        highlightElevation: widget.hoverElevation,
-        onPressed: _showMenu,
+        onPressed: () {
+          _showMenu();
+          widget.afterButtonPressed?.call();
+        },
        child: _buildContent(context),
      ),
    );
--- a/lib/src/widgets/toolbar/quill_font_size_button.dart
+++ b/lib/src/widgets/toolbar/quill_font_size_button.dart
@ -19,6 +19,7 @@ class QuillFontSizeButton extends StatefulWidget {
    this.hoverElevation = 1,
    this.highlightElevation = 1,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -32,6 +33,7 @@ class QuillFontSizeButton extends StatefulWidget {
  final QuillIconTheme? iconTheme;
  final Attribute attribute;
  final QuillController controller;
+  final VoidCallback? afterButtonPressed;

  @override
  _QuillFontSizeButtonState createState() => _QuillFontSizeButtonState();
@ -96,7 +98,10 @@ class _QuillFontSizeButtonState extends State<QuillFontSizeButton> {
        elevation: 0,
        hoverElevation: widget.hoverElevation,
        highlightElevation: widget.hoverElevation,
-        onPressed: _showMenu,
+        onPressed: () {
+          _showMenu();
+          widget.afterButtonPressed?.call();
+        },
        child: _buildContent(context),
      ),
    );
--- a/lib/src/widgets/toolbar/quill_icon_button.dart
+++ b/lib/src/widgets/toolbar/quill_icon_button.dart
@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 class QuillIconButton extends StatelessWidget {
  const QuillIconButton({
    required this.onPressed,
+    this.afterPressed,
    this.icon,
    this.size = 40,
    this.fillColor,
@ -13,6 +14,7 @@ class QuillIconButton extends StatelessWidget {
  }) : super(key: key);

  final VoidCallback? onPressed;
+  final VoidCallback? afterPressed;
  final Widget? icon;
  final double size;
  final Color? fillColor;
@ -32,7 +34,10 @@ class QuillIconButton extends StatelessWidget {
        elevation: 0,
        hoverElevation: hoverElevation,
        highlightElevation: hoverElevation,
-        onPressed: onPressed,
+        onPressed: () {
+          onPressed?.call();
+          afterPressed?.call();
+        },
        child: icon,
      ),
    );
--- a/lib/src/widgets/toolbar/search_button.dart
+++ b/lib/src/widgets/toolbar/search_button.dart
@ -15,6 +15,7 @@ class SearchButton extends StatelessWidget {
    this.fillColor,
    this.iconTheme,
    this.dialogTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -26,6 +27,7 @@ class SearchButton extends StatelessWidget {
  final QuillIconTheme? iconTheme;

  final QuillDialogTheme? dialogTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  Widget build(BuildContext context) {
@ -43,6 +45,7 @@ class SearchButton extends StatelessWidget {
      fillColor: iconFillColor,
      borderRadius: iconTheme?.borderRadius ?? 2,
      onPressed: () => _onPressedHandler(context),
+      afterPressed: afterButtonPressed,
    );
  }

--- a/lib/src/widgets/toolbar/select_alignment_button.dart
+++ b/lib/src/widgets/toolbar/select_alignment_button.dart
@ -16,6 +16,7 @@ class SelectAlignmentButton extends StatefulWidget {
    this.showCenterAlignment,
    this.showRightAlignment,
    this.showJustifyAlignment,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -27,6 +28,7 @@ class SelectAlignmentButton extends StatefulWidget {
  final bool? showCenterAlignment;
  final bool? showRightAlignment;
  final bool? showJustifyAlignment;
+  final VoidCallback? afterButtonPressed;

  @override
  _SelectAlignmentButtonState createState() => _SelectAlignmentButtonState();
@ -104,10 +106,13 @@ class _SelectAlignmentButtonState extends State<SelectAlignmentButton> {
                      theme.toggleableActiveColor)
                  : (widget.iconTheme?.iconUnselectedFillColor ??
                      theme.canvasColor),
-              onPressed: () => _valueAttribute[index] == Attribute.leftAlignment
-                  ? widget.controller
-                      .formatSelection(Attribute.clone(Attribute.align, null))
-                  : widget.controller.formatSelection(_valueAttribute[index]),
+              onPressed: () {
+                _valueAttribute[index] == Attribute.leftAlignment
+                    ? widget.controller
+                        .formatSelection(Attribute.clone(Attribute.align, null))
+                    : widget.controller.formatSelection(_valueAttribute[index]);
+                widget.afterButtonPressed?.call();
+              },
              child: Icon(
                _valueString[index] == Attribute.leftAlignment.value
                    ? Icons.format_align_left
--- a/lib/src/widgets/toolbar/select_header_style_button.dart
+++ b/lib/src/widgets/toolbar/select_header_style_button.dart
@ -18,6 +18,7 @@ class SelectHeaderStyleButton extends StatefulWidget {
      Attribute.h2,
      Attribute.h3,
    ],
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -25,6 +26,7 @@ class SelectHeaderStyleButton extends StatefulWidget {
  final double iconSize;
  final QuillIconTheme? iconTheme;
  final List<Attribute> attributes;
+  final VoidCallback? afterButtonPressed;

  @override
  _SelectHeaderStyleButtonState createState() =>
@ -95,6 +97,7 @@ class _SelectHeaderStyleButtonState extends State<SelectHeaderStyleButton> {
                    ? Attribute.header
                    : attribute;
                widget.controller.formatSelection(_attribute);
+                widget.afterButtonPressed?.call();
              },
              child: Text(
                _valueToText[attribute] ?? '',
--- a/lib/src/widgets/toolbar/toggle_check_list_button.dart
+++ b/lib/src/widgets/toolbar/toggle_check_list_button.dart
@ -15,6 +15,7 @@ class ToggleCheckListButton extends StatefulWidget {
    this.fillColor,
    this.childBuilder = defaultToggleStyleButtonBuilder,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -30,6 +31,7 @@ class ToggleCheckListButton extends StatefulWidget {
  final Attribute attribute;

  final QuillIconTheme? iconTheme;
+  final VoidCallback? afterButtonPressed;

  @override
  _ToggleCheckListButtonState createState() => _ToggleCheckListButtonState();
@ -96,6 +98,7 @@ class _ToggleCheckListButtonState extends State<ToggleCheckListButton> {
      widget.fillColor,
      _isToggled,
      _toggleAttribute,
+      widget.afterButtonPressed,
      widget.iconSize,
      widget.iconTheme,
    );
--- a/lib/src/widgets/toolbar/toggle_style_button.dart
+++ b/lib/src/widgets/toolbar/toggle_style_button.dart
@ -12,7 +12,8 @@ typedef ToggleStyleButtonBuilder = Widget Function(
  IconData icon,
  Color? fillColor,
  bool? isToggled,
-  VoidCallback? onPressed, [
+  VoidCallback? onPressed,
+  VoidCallback? afterPressed, [
  double iconSize,
  QuillIconTheme? iconTheme,
 ]);
@ -26,6 +27,7 @@ class ToggleStyleButton extends StatefulWidget {
    this.fillColor,
    this.childBuilder = defaultToggleStyleButtonBuilder,
    this.iconTheme,
+    this.afterButtonPressed,
    Key? key,
  }) : super(key: key);

@ -43,6 +45,8 @@ class ToggleStyleButton extends StatefulWidget {
  ///Specify an icon theme for the icons in the toolbar
  final QuillIconTheme? iconTheme;

+  final VoidCallback? afterButtonPressed;
+
  @override
  _ToggleStyleButtonState createState() => _ToggleStyleButtonState();
 }
@ -68,6 +72,7 @@ class _ToggleStyleButtonState extends State<ToggleStyleButton> {
      widget.fillColor,
      _isToggled,
      _toggleAttribute,
+      widget.afterButtonPressed,
      widget.iconSize,
      widget.iconTheme,
    );
@ -117,7 +122,8 @@ Widget defaultToggleStyleButtonBuilder(
  IconData icon,
  Color? fillColor,
  bool? isToggled,
-  VoidCallback? onPressed, [
+  VoidCallback? onPressed,
+  VoidCallback? afterPressed, [
  double iconSize = kDefaultIconSize,
  QuillIconTheme? iconTheme,
 ]) {
@ -145,6 +151,7 @@ Widget defaultToggleStyleButtonBuilder(
    icon: Icon(icon, size: iconSize, color: iconColor),
    fillColor: fill,
    onPressed: onPressed,
+    afterPressed: afterPressed,
    borderRadius: iconTheme?.borderRadius ?? 2,
  );
 }