QuillToolbar.basic constructor

QuillToolbar.basic({
  1. required QuillController controller,
  2. Axis axis = Axis.horizontal,
  3. double toolbarIconSize = kDefaultIconSize,
  4. double toolbarSectionSpacing = kToolbarSectionSpacing,
  5. WrapAlignment toolbarIconAlignment = WrapAlignment.center,
  6. WrapCrossAlignment toolbarIconCrossAlignment = WrapCrossAlignment.center,
  7. bool showDividers = true,
  8. bool showFontFamily = true,
  9. bool showFontSize = true,
  10. bool showBoldButton = true,
  11. bool showItalicButton = true,
  12. bool showSmallButton = false,
  13. bool showUnderLineButton = true,
  14. bool showStrikeThrough = true,
  15. bool showInlineCode = true,
  16. bool showClearFormat = true,
  17. bool showAlignmentButtons = false,
  18. bool showLeftAlignment = true,
  19. bool showCenterAlignment = true,
  20. bool showRightAlignment = true,
  21. bool showJustifyAlignment = true,
  22. bool showHeaderStyle = true,
  23. bool showListNumbers = true,
  24. bool showListBullets = true,
  25. bool showListCheck = true,
  26. bool showCodeBlock = true,
  27. bool showQuote = true,
  28. bool showIndent = true,
  29. bool showLink = true,
  30. bool showUndo = true,
  31. bool showRedo = true,
  32. bool showDirection = false,
  33. bool showSearchButton = true,
  34. List<QuillCustomButton> customButtons = const [],
  35. Map<String, String>? fontSizeValues,
  36. Map<String, String>? fontFamilyValues,
  37. List<EmbedButtonBuilder>? embedButtons,
  38. QuillIconTheme? iconTheme,
  39. QuillDialogTheme? dialogTheme,
  40. VoidCallback? afterButtonPressed,
  41. Map<ToolbarButtons, String>? tooltips,
  42. Locale? locale,
  43. Color? color,
  44. Color? sectionDividerColor,
  45. double? sectionDividerSpace,
  46. Key? key,
})

Implementation

factory QuillToolbar.basic({
  required QuillController controller,
  Axis axis = Axis.horizontal,
  double toolbarIconSize = kDefaultIconSize,
  double toolbarSectionSpacing = kToolbarSectionSpacing,
  WrapAlignment toolbarIconAlignment = WrapAlignment.center,
  WrapCrossAlignment toolbarIconCrossAlignment = WrapCrossAlignment.center,
  bool showDividers = true,
  bool showFontFamily = true,
  bool showFontSize = true,
  bool showBoldButton = true,
  bool showItalicButton = true,
  bool showSmallButton = false,
  bool showUnderLineButton = true,
  bool showStrikeThrough = true,
  bool showInlineCode = true,
  bool showClearFormat = true,
  bool showAlignmentButtons = false,
  bool showLeftAlignment = true,
  bool showCenterAlignment = true,
  bool showRightAlignment = true,
  bool showJustifyAlignment = true,
  bool showHeaderStyle = true,
  bool showListNumbers = true,
  bool showListBullets = true,
  bool showListCheck = true,
  bool showCodeBlock = true,
  bool showQuote = true,
  bool showIndent = true,
  bool showLink = true,
  bool showUndo = true,
  bool showRedo = true,
  bool showDirection = false,
  bool showSearchButton = true,
  List<QuillCustomButton> customButtons = const [],

  ///Map of font sizes in string
  Map<String, String>? fontSizeValues,

  ///Map of font families in string
  Map<String, String>? fontFamilyValues,

  /// Toolbar items to display for controls of embed blocks
  List<EmbedButtonBuilder>? embedButtons,

  ///The theme to use for the icons in the toolbar, uses type [QuillIconTheme]
  QuillIconTheme? iconTheme,

  ///The theme to use for the theming of the [LinkDialog()],
  ///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,

  ///Map of tooltips for toolbar  buttons
  ///
  ///The example is:
  ///```dart
  /// tooltips = <ToolbarButtons, String>{
  ///   ToolbarButtons.undo: 'Undo',
  ///   ToolbarButtons.redo: 'Redo',
  /// }
  ///
  ///```
  ///
  /// To disable tooltips just pass empty map as well.
  Map<ToolbarButtons, String>? tooltips,

  /// The locale to use for the editor toolbar, defaults to system locale
  /// More at https://github.com/singerdmx/flutter-quill#translation
  Locale? locale,

  /// The color of the toolbar
  Color? color,

  /// The color of the toolbar section divider
  Color? sectionDividerColor,

  /// The space occupied by toolbar divider
  double? sectionDividerSpace,
  Key? key,
}) {
  final isButtonGroupShown = [
    showFontFamily ||
        showFontSize ||
        showBoldButton ||
        showItalicButton ||
        showSmallButton ||
        showUnderLineButton ||
        showStrikeThrough ||
        showInlineCode ||
        showClearFormat ||
        embedButtons?.isNotEmpty == true,
    showAlignmentButtons || showDirection,
    showLeftAlignment,
    showCenterAlignment,
    showRightAlignment,
    showJustifyAlignment,
    showHeaderStyle,
    showListNumbers || showListBullets || showListCheck || showCodeBlock,
    showQuote || showIndent,
    showLink || showSearchButton
  ];

  //default font size values
  final fontSizes = fontSizeValues ?? {'Small': 'small', 'Large': 'large', 'Huge': 'huge', 'Clear': '0'};

  //default font family values
  final fontFamilies = fontFamilyValues ??
      {
        'Sans Serif': 'sans-serif',
        'Serif': 'serif',
        'Monospace': 'monospace',
        'Ibarra Real Nova': 'ibarra-real-nova',
        'SquarePeg': 'square-peg',
        'Nunito': 'nunito',
        'Pacifico': 'pacifico',
        'Roboto Mono': 'roboto-mono',
        'Clear': 'Clear'
      };

  //default button tooltips
  final buttonTooltips = tooltips ??
      <ToolbarButtons, String>{
        ToolbarButtons.undo: 'Undo',
        ToolbarButtons.redo: 'Redo',
        ToolbarButtons.fontFamily: 'Font family',
        ToolbarButtons.fontSize: 'Font size',
        ToolbarButtons.bold: 'Bold',
        ToolbarButtons.italic: 'Italic',
        ToolbarButtons.small: 'Small',
        ToolbarButtons.underline: 'Underline',
        ToolbarButtons.strikeThrough: 'Strike through',
        ToolbarButtons.inlineCode: 'Inline code',
        ToolbarButtons.color: 'Font color',
        ToolbarButtons.backgroundColor: 'Background color',
        ToolbarButtons.clearFormat: 'Clear format',
        ToolbarButtons.leftAlignment: 'Align left',
        ToolbarButtons.centerAlignment: 'Align center',
        ToolbarButtons.rightAlignment: 'Align right',
        ToolbarButtons.justifyAlignment: 'Justify win width',
        ToolbarButtons.direction: 'Text direction',
        ToolbarButtons.headerStyle: 'Header style',
        ToolbarButtons.listNumbers: 'Numbered list',
        ToolbarButtons.listBullets: 'Bullet list',
        ToolbarButtons.listChecks: 'Checked list',
        ToolbarButtons.codeBlock: 'Code block',
        ToolbarButtons.quote: 'Quote',
        ToolbarButtons.indentIncrease: 'Increase indent',
        ToolbarButtons.indentDecrease: 'Decrease indent',
        ToolbarButtons.link: 'Insert URL',
        ToolbarButtons.search: 'Search',
      };

  return QuillToolbar(
    key: key,
    axis: axis,
    color: color,
    toolbarSize: toolbarIconSize * 2,
    toolbarSectionSpacing: toolbarSectionSpacing,
    toolbarIconAlignment: toolbarIconAlignment,
    toolbarIconCrossAlignment: toolbarIconCrossAlignment,
    customButtons: customButtons,
    locale: locale,
    afterButtonPressed: afterButtonPressed,
    children: [
      if (showUndo)
        HistoryButton(
          icon: Icons.undo_outlined,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.undo],
          controller: controller,
          undo: true,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showRedo)
        HistoryButton(
          icon: Icons.redo_outlined,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.redo],
          controller: controller,
          undo: false,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showFontFamily)
        QuillFontFamilyButton(
          iconTheme: iconTheme,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.fontFamily],
          attribute: Attribute.font,
          controller: controller,
          rawItemsMap: fontFamilies,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showFontSize)
        QuillFontSizeButton(
          iconTheme: iconTheme,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.fontSize],
          attribute: Attribute.size,
          controller: controller,
          rawItemsMap: fontSizes,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showBoldButton)
        ToggleStyleButton(
          attribute: Attribute.bold,
          icon: Icons.format_bold,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.bold],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showItalicButton)
        ToggleStyleButton(
          attribute: Attribute.italic,
          icon: Icons.format_italic,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.italic],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showSmallButton)
        ToggleStyleButton(
          attribute: Attribute.small,
          icon: Icons.format_size,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.small],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showUnderLineButton)
        ToggleStyleButton(
          attribute: Attribute.underline,
          icon: Icons.format_underline,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.underline],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showStrikeThrough)
        ToggleStyleButton(
          attribute: Attribute.strikeThrough,
          icon: Icons.format_strikethrough,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.strikeThrough],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showInlineCode)
        ToggleStyleButton(
          attribute: Attribute.inlineCode,
          icon: Icons.code,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.inlineCode],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showClearFormat)
        ClearFormatButton(
          icon: Icons.format_clear,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.clearFormat],
          controller: controller,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (embedButtons != null)
        for (final builder in embedButtons) builder(controller, toolbarIconSize, iconTheme, dialogTheme),
      if (showDividers &&
          isButtonGroupShown[0] &&
          (isButtonGroupShown[1] ||
              isButtonGroupShown[2] ||
              isButtonGroupShown[3] ||
              isButtonGroupShown[4] ||
              isButtonGroupShown[5]))
        AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      if (showAlignmentButtons)
        SelectAlignmentButton(
          controller: controller,
          tooltips: Map.of(buttonTooltips)
            ..removeWhere((key, value) => ![
                  ToolbarButtons.leftAlignment,
                  ToolbarButtons.centerAlignment,
                  ToolbarButtons.rightAlignment,
                  ToolbarButtons.justifyAlignment,
                ].contains(key)),
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          showLeftAlignment: showLeftAlignment,
          showCenterAlignment: showCenterAlignment,
          showRightAlignment: showRightAlignment,
          showJustifyAlignment: showJustifyAlignment,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showDirection)
        ToggleStyleButton(
          attribute: Attribute.rtl,
          tooltip: buttonTooltips[ToolbarButtons.direction],
          controller: controller,
          icon: Icons.format_textdirection_r_to_l,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showDividers &&
          isButtonGroupShown[1] &&
          (isButtonGroupShown[2] || isButtonGroupShown[3] || isButtonGroupShown[4] || isButtonGroupShown[5]))
        AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      if (showHeaderStyle)
        SelectHeaderStyleButton(
          tooltip: buttonTooltips[ToolbarButtons.headerStyle],
          controller: controller,
          axis: axis,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showDividers &&
          showHeaderStyle &&
          isButtonGroupShown[2] &&
          (isButtonGroupShown[3] || isButtonGroupShown[4] || isButtonGroupShown[5]))
        AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      if (showListNumbers)
        ToggleStyleButton(
          attribute: Attribute.ol,
          tooltip: buttonTooltips[ToolbarButtons.listNumbers],
          controller: controller,
          icon: Icons.format_list_numbered,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showListBullets)
        ToggleStyleButton(
          attribute: Attribute.ul,
          tooltip: buttonTooltips[ToolbarButtons.listBullets],
          controller: controller,
          icon: Icons.format_list_bulleted,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showListCheck)
        ToggleCheckListButton(
          attribute: Attribute.unchecked,
          tooltip: buttonTooltips[ToolbarButtons.listChecks],
          controller: controller,
          icon: Icons.check_box,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showCodeBlock)
        ToggleStyleButton(
          attribute: Attribute.codeBlock,
          tooltip: buttonTooltips[ToolbarButtons.codeBlock],
          controller: controller,
          icon: Icons.code,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showDividers && isButtonGroupShown[3] && (isButtonGroupShown[4] || isButtonGroupShown[5]))
        AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      if (showQuote)
        ToggleStyleButton(
          attribute: Attribute.blockQuote,
          tooltip: buttonTooltips[ToolbarButtons.quote],
          controller: controller,
          icon: Icons.format_quote,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showIndent)
        IndentButton(
          icon: Icons.format_indent_increase,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.indentIncrease],
          controller: controller,
          isIncrease: true,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showIndent)
        IndentButton(
          icon: Icons.format_indent_decrease,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.indentDecrease],
          controller: controller,
          isIncrease: false,
          iconTheme: iconTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showDividers && isButtonGroupShown[4] && isButtonGroupShown[5])
        AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      if (showLink)
        LinkStyleButton(
          tooltip: buttonTooltips[ToolbarButtons.link],
          controller: controller,
          iconSize: toolbarIconSize,
          iconTheme: iconTheme,
          dialogTheme: dialogTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (showSearchButton)
        SearchButton(
          icon: Icons.search,
          iconSize: toolbarIconSize,
          tooltip: buttonTooltips[ToolbarButtons.search],
          controller: controller,
          iconTheme: iconTheme,
          dialogTheme: dialogTheme,
          afterButtonPressed: afterButtonPressed,
        ),
      if (customButtons.isNotEmpty)
        if (showDividers) AxisDivider(axis, color: sectionDividerColor, space: sectionDividerSpace),
      for (var customButton in customButtons)
        QuillIconButton(
          highlightElevation: 0,
          hoverElevation: 0,
          size: toolbarIconSize * kIconButtonFactor,
          icon: Icon(customButton.icon, size: toolbarIconSize),
          tooltip: customButton.tooltip,
          borderRadius: iconTheme?.borderRadius ?? 2,
          onPressed: customButton.onTap,
          afterPressed: afterButtonPressed,
        ),
    ],
  );
}