diff --git a/CHANGELOG.md b/CHANGELOG.md index 849261e5..14612cdd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,9 +2,15 @@ All notable changes to this project will be documented in this file. +## 9.0.0-dev-5 +* The `QuillToolbar` is now accepting only `child` with no configurations so you can customize everything you wants, the `QuillToolbar.simple()` or `QuillSimpleToolbar` implements a simple toolbar that is based on `QuillToolbar`, you are free to use it but it just an example and not standard +* Flutter Quill Extensions: + * Improve the camera button + ## 9.0.0-dev-4 * The options parameter in all of the buttons is no longer required which can be useful to create custom toolbar with minimal efforts * Toolbar buttons fixes in both `flutter_quill` and `flutter_quill_extensions` +* The `QuillProvider` has been dropped and no longer used, the providers will be used only internally from now on and we will not using them as much as possible ## 9.0.0-dev-3 * Breaking Changes: diff --git a/example/lib/presentation/quill/quill_screen.dart b/example/lib/presentation/quill/quill_screen.dart index 7f34cc30..86ea834f 100644 --- a/example/lib/presentation/quill/quill_screen.dart +++ b/example/lib/presentation/quill/quill_screen.dart @@ -106,7 +106,6 @@ class _QuillScreenState extends State { MyQuillToolbar( controller: _controller, focusNode: _editorFocusNode, - sharedConfigurations: _sharedConfigurations, ), Builder( builder: (context) { diff --git a/example/lib/presentation/quill/quill_toolbar.dart b/example/lib/presentation/quill/quill_toolbar.dart index 4c0f3124..e7b02fe1 100644 --- a/example/lib/presentation/quill/quill_toolbar.dart +++ b/example/lib/presentation/quill/quill_toolbar.dart @@ -17,14 +17,11 @@ class MyQuillToolbar extends StatelessWidget { const MyQuillToolbar({ required this.controller, required this.focusNode, - required this.sharedConfigurations, super.key, }); final QuillController controller; final FocusNode focusNode; - // TODO: Use it - final QuillSharedConfigurations sharedConfigurations; Future onImageInsertWithCropping( String image, @@ -104,105 +101,106 @@ class MyQuillToolbar extends StatelessWidget { // https://github.com/singerdmx/flutter-quill/blob/master/doc/custom_toolbar.md return QuillToolbar( configurations: QuillToolbarConfigurations( - toolbarSize: 20 * 2, - multiRowsDisplay: false, buttonOptions: const QuillToolbarButtonOptions( base: QuillToolbarBaseButtonOptions( globalIconSize: 20, globalIconButtonFactor: 1.4, ), ), - childrenBuilder: (context) { - return [ - IconButton( - onPressed: () => context - .read() - .updateSettings( - state.copyWith(useCustomQuillToolbar: false)), - icon: const Icon( - Icons.width_normal, + child: SingleChildScrollView( + scrollDirection: Axis.horizontal, + child: Row( + children: [ + IconButton( + onPressed: () => context + .read() + .updateSettings( + state.copyWith(useCustomQuillToolbar: false)), + icon: const Icon( + Icons.width_normal, + ), ), - ), - QuillToolbarHistoryButton( - isUndo: true, - controller: controller, - ), - QuillToolbarHistoryButton( - isUndo: false, - controller: controller, - ), - QuillToolbarToggleStyleButton( - options: const QuillToolbarToggleStyleButtonOptions(), - controller: controller, - attribute: Attribute.bold, - ), - QuillToolbarToggleStyleButton( - options: const QuillToolbarToggleStyleButtonOptions(), - controller: controller, - attribute: Attribute.italic, - ), - QuillToolbarToggleStyleButton( - controller: controller, - attribute: Attribute.underline, - ), - QuillToolbarClearFormatButton( - controller: controller, - ), - const VerticalDivider(), - QuillToolbarImageButton( - controller: controller, - ), - QuillToolbarCameraButton( - controller: controller, - ), - QuillToolbarVideoButton( - controller: controller, - ), - const VerticalDivider(), - QuillToolbarColorButton( - controller: controller, - isBackground: false, - ), - QuillToolbarColorButton( - controller: controller, - isBackground: true, - ), - const VerticalDivider(), - QuillToolbarSelectHeaderStyleButton( - controller: controller, - ), - const VerticalDivider(), - QuillToolbarToggleCheckListButton( - controller: controller, - ), - QuillToolbarToggleStyleButton( - controller: controller, - attribute: Attribute.list, - ), - QuillToolbarToggleStyleButton( - controller: controller, - attribute: Attribute.ul, - ), - QuillToolbarToggleStyleButton( - controller: controller, - attribute: Attribute.inlineCode, - ), - QuillToolbarToggleStyleButton( - controller: controller, - attribute: Attribute.blockQuote, - ), - QuillToolbarIndentButton( - controller: controller, - isIncrease: true, - ), - QuillToolbarIndentButton( - controller: controller, - isIncrease: false, - ), - const VerticalDivider(), - QuillToolbarLinkStyleButton(controller: controller), - ]; - }, + QuillToolbarHistoryButton( + isUndo: true, + controller: controller, + ), + QuillToolbarHistoryButton( + isUndo: false, + controller: controller, + ), + QuillToolbarToggleStyleButton( + options: const QuillToolbarToggleStyleButtonOptions(), + controller: controller, + attribute: Attribute.bold, + ), + QuillToolbarToggleStyleButton( + options: const QuillToolbarToggleStyleButtonOptions(), + controller: controller, + attribute: Attribute.italic, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.underline, + ), + QuillToolbarClearFormatButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarImageButton( + controller: controller, + ), + QuillToolbarCameraButton( + controller: controller, + ), + QuillToolbarVideoButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarColorButton( + controller: controller, + isBackground: false, + ), + QuillToolbarColorButton( + controller: controller, + isBackground: true, + ), + const VerticalDivider(), + QuillToolbarSelectHeaderStyleButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarToggleCheckListButton( + controller: controller, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.ol, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.ul, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.inlineCode, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.blockQuote, + ), + QuillToolbarIndentButton( + controller: controller, + isIncrease: true, + ), + QuillToolbarIndentButton( + controller: controller, + isIncrease: false, + ), + const VerticalDivider(), + QuillToolbarLinkStyleButton(controller: controller), + ], + ), + ), ), ); } diff --git a/example/pubspec.yaml b/example/pubspec.yaml index 731d5645..bf3192ad 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -24,8 +24,6 @@ dependencies: cross_file: ^0.3.3+6 cached_network_image: ^3.3.0 - gal_linux: ^0.0.1-dev - # Bloc libraries bloc: ^8.1.2 flutter_bloc: ^8.1.3 diff --git a/flutter_quill_extensions/lib/embeds/others/camera_button/camera_button.dart b/flutter_quill_extensions/lib/embeds/others/camera_button/camera_button.dart index 70ef0990..ef7ad3da 100644 --- a/flutter_quill_extensions/lib/embeds/others/camera_button/camera_button.dart +++ b/flutter_quill_extensions/lib/embeds/others/camera_button/camera_button.dart @@ -120,10 +120,8 @@ class QuillToolbarCameraButton extends StatelessWidget { if (customCallback != null) { return await customCallback(context); } - final cameraAction = await showDialog( + final cameraAction = await showSelectCameraActionDialog( context: context, - builder: (ctx) => const FlutterQuillLocalizationsWidget( - child: SelectCameraActionDialog()), ); return cameraAction; @@ -171,12 +169,5 @@ class QuillToolbarCameraButton extends StatelessWidget { await options.cameraConfigurations.onImageInsertedCallback ?.call(imageFile.path); } - - // final file = await switch (cameraAction) { - // CameraAction.image => - // imagePickerService.pickImage(source: ImageSource.camera), - // CameraAction.video => - // imagePickerService.pickVideo(source: ImageSource.camera), - // }; } } diff --git a/flutter_quill_extensions/lib/embeds/others/camera_button/select_camera_action.dart b/flutter_quill_extensions/lib/embeds/others/camera_button/select_camera_action.dart index bd6527db..c2067028 100644 --- a/flutter_quill_extensions/lib/embeds/others/camera_button/select_camera_action.dart +++ b/flutter_quill_extensions/lib/embeds/others/camera_button/select_camera_action.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:flutter_quill/extensions.dart'; import 'package:flutter_quill/translations.dart'; import 'camera_types.dart'; @@ -8,27 +9,46 @@ class SelectCameraActionDialog extends StatelessWidget { @override Widget build(BuildContext context) { - return AlertDialog( - contentPadding: EdgeInsets.zero, - content: Column( - mainAxisSize: MainAxisSize.min, - children: [ - TextButton.icon( - icon: const Icon( - Icons.camera, + return SizedBox( + height: 150, + width: double.infinity, + child: SingleChildScrollView( + child: Column( + children: [ + ListTile( + title: Text(context.loc.photo), + subtitle: Text( + context.loc.takeAPhotoUsingYourCamera, + ), + leading: const Icon(Icons.photo_sharp), + enabled: !isDesktop(supportWeb: false), + onTap: () => Navigator.of(context).pop(CameraAction.image), ), - label: Text(context.loc.photo), - onPressed: () => Navigator.pop(context, CameraAction.image), - ), - TextButton.icon( - icon: const Icon( - Icons.video_call, + ListTile( + title: Text(context.loc.video), + subtitle: Text( + context.loc.recordAVideoUsingYourCamera, + ), + leading: const Icon(Icons.camera), + enabled: !isDesktop(supportWeb: false), + onTap: () => Navigator.of(context).pop(CameraAction.video), ), - label: Text(context.loc.video), - onPressed: () => Navigator.pop(context, CameraAction.video), - ) - ], + ], + ), ), ); } } + +Future showSelectCameraActionDialog({ + required BuildContext context, +}) async { + final imageSource = await showModalBottomSheet( + showDragHandle: true, + context: context, + constraints: const BoxConstraints(maxWidth: 640), + builder: (context) => const FlutterQuillLocalizationsWidget( + child: SelectCameraActionDialog()), + ); + return imageSource; +} diff --git a/flutter_quill_extensions/pubspec.yaml b/flutter_quill_extensions/pubspec.yaml index aa8f8277..4048ccc8 100644 --- a/flutter_quill_extensions/pubspec.yaml +++ b/flutter_quill_extensions/pubspec.yaml @@ -44,6 +44,7 @@ dependencies: url_launcher: ^6.2.1 super_clipboard: ^0.7.3 gal: ^2.1.3 + gal_linux: ^0.0.1-dev-3 image_picker: ^1.0.4 dev_dependencies: diff --git a/lib/src/models/config/toolbar/toolbar_configurations.dart b/lib/src/models/config/toolbar/toolbar_configurations.dart index 5969e23c..2e974a7c 100644 --- a/lib/src/models/config/toolbar/toolbar_configurations.dart +++ b/lib/src/models/config/toolbar/toolbar_configurations.dart @@ -1,6 +1,6 @@ // ignore_for_file: public_member_api_docs, sort_constructors_first import 'package:flutter/widgets.dart' - show Axis, WrapAlignment, WrapCrossAlignment, immutable; + show Axis, Widget, WrapAlignment, WrapCrossAlignment, immutable; import '../../../widgets/toolbar/base_toolbar.dart'; import 'toolbar_shared_configurations.dart'; @@ -8,34 +8,16 @@ import 'toolbar_shared_configurations.dart'; @immutable class QuillToolbarConfigurations extends QuillSharedToolbarProperties { const QuillToolbarConfigurations({ - this.childrenBuilder, - super.axis = Axis.horizontal, - super.toolbarSize = kDefaultIconSize * 2, - super.toolbarSectionSpacing = kToolbarSectionSpacing, - super.toolbarIconAlignment = WrapAlignment.center, - super.toolbarIconCrossAlignment = WrapCrossAlignment.center, - super.color, - super.sectionDividerColor, - super.sectionDividerSpace, - super.linkDialogAction, - super.multiRowsDisplay = true, - super.decoration, + required this.child, + super.sharedConfigurations, /// Note this only used when you using the quill toolbar buttons like /// `QuillToolbarHistoryButton` inside it super.buttonOptions = const QuillToolbarButtonOptions(), }); - final QuillBaseToolbarChildrenBuilder? childrenBuilder; + final Widget child; @override List get props => []; - - QuillToolbarConfigurations copyWith({ - QuillBaseToolbarChildrenBuilder? childrenBuilder, - }) { - return QuillToolbarConfigurations( - childrenBuilder: childrenBuilder ?? this.childrenBuilder, - ); - } } diff --git a/lib/src/widgets/toolbar/base_toolbar.dart b/lib/src/widgets/toolbar/base_toolbar.dart index 6d535b1a..c2211305 100644 --- a/lib/src/widgets/toolbar/base_toolbar.dart +++ b/lib/src/widgets/toolbar/base_toolbar.dart @@ -5,7 +5,6 @@ import '../../../flutter_quill.dart' import '../../l10n/widgets/localizations.dart'; import '../../models/config/toolbar/simple_toolbar_configurations.dart'; import '../../models/config/toolbar/toolbar_configurations.dart'; -import 'buttons/arrow_indicated_list_button.dart'; import 'simple_toolbar.dart'; export '../../models/config/toolbar/buttons/base_configurations.dart'; @@ -56,90 +55,11 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget { @override Widget build(BuildContext context) { - final toolbarSize = configurations.toolbarSize; return FlutterQuillLocalizationsWidget( child: QuillBaseToolbarProvider( toolbarConfigurations: configurations, - child: Builder( - builder: (context) { - if (configurations.multiRowsDisplay) { - return Wrap( - direction: configurations.axis, - alignment: configurations.toolbarIconAlignment, - crossAxisAlignment: configurations.toolbarIconCrossAlignment, - runSpacing: 4, - spacing: configurations.toolbarSectionSpacing, - children: configurations.childrenBuilder?.call(context) ?? [], - ); - } - return Container( - decoration: configurations.decoration ?? - BoxDecoration( - color: - configurations.color ?? Theme.of(context).canvasColor, - ), - constraints: BoxConstraints.tightFor( - height: - configurations.axis == Axis.horizontal ? toolbarSize : null, - width: - configurations.axis == Axis.vertical ? toolbarSize : null, - ), - child: QuillToolbarArrowIndicatedButtonList( - axis: configurations.axis, - buttons: configurations.childrenBuilder?.call(context) ?? [], - ), - ); - }, - ), + child: configurations.child, ), ); } } - -/// The divider which is used for separation of buttons in the toolbar. -/// -/// It can be used outside of this package, for example when user does not use -/// [QuillToolbar.basic] and compose toolbar's children on its own. -class QuillToolbarDivider extends StatelessWidget { - const QuillToolbarDivider( - this.axis, { - super.key, - this.color, - this.space, - }); - - /// Provides a horizontal divider for vertical toolbar. - const QuillToolbarDivider.horizontal({Key? key, Color? color, double? space}) - : this(Axis.horizontal, color: color, space: space, key: key); - - /// Provides a horizontal divider for horizontal toolbar. - const QuillToolbarDivider.vertical({Key? key, Color? color, double? space}) - : this(Axis.vertical, color: color, space: space, key: key); - - /// The axis along which the toolbar is. - final Axis axis; - - /// The color to use when painting this divider's line. - final Color? color; - - /// The divider's space (width or height) depending of [axis]. - final double? space; - - @override - Widget build(BuildContext context) { - // Vertical toolbar requires horizontal divider, and vice versa - return axis == Axis.vertical - ? Divider( - height: space, - color: color, - indent: 12, - endIndent: 12, - ) - : VerticalDivider( - width: space, - color: color, - indent: 12, - endIndent: 12, - ); - } -} diff --git a/lib/src/widgets/toolbar/simple_toolbar.dart b/lib/src/widgets/toolbar/simple_toolbar.dart index f27bcd68..86740964 100644 --- a/lib/src/widgets/toolbar/simple_toolbar.dart +++ b/lib/src/widgets/toolbar/simple_toolbar.dart @@ -6,6 +6,7 @@ import '../../models/config/toolbar/toolbar_configurations.dart'; import '../../models/documents/attribute.dart'; import '../utils/provider.dart'; import 'base_toolbar.dart'; +import 'buttons/arrow_indicated_list_button.dart'; import 'buttons/select_alignment_buttons.dart'; import 'buttons/select_header_style_button.dart'; @@ -50,400 +51,416 @@ class QuillSimpleToolbar extends StatelessWidget configurations.showLink || configurations.showSearchButton ]; - return QuillToolbarProvider( - toolbarConfigurations: configurations, - child: QuillToolbar( - configurations: QuillToolbarConfigurations( - color: configurations.color, - decoration: configurations.decoration, - toolbarSectionSpacing: configurations.toolbarSectionSpacing, - toolbarIconAlignment: configurations.toolbarIconAlignment, - toolbarIconCrossAlignment: configurations.toolbarIconCrossAlignment, - linkDialogAction: configurations.linkDialogAction, - multiRowsDisplay: configurations.multiRowsDisplay, - sectionDividerColor: configurations.sectionDividerColor, - axis: configurations.axis, - sectionDividerSpace: configurations.sectionDividerSpace, - toolbarSize: configurations.toolbarSize, - childrenBuilder: (context) { - final toolbarConfigurations = - context.requireQuillSimpleToolbarConfigurations; + List childrenBuilder(context) { + final toolbarConfigurations = + context.requireQuillSimpleToolbarConfigurations; - final globalIconSize = - toolbarConfigurations.buttonOptions.base.globalIconSize; + final globalIconSize = + toolbarConfigurations.buttonOptions.base.globalIconSize; - final axis = toolbarConfigurations.axis; - final globalController = configurations.controller; + final axis = toolbarConfigurations.axis; + final globalController = configurations.controller; - final spacerWidget = - configurations.spacerWidget ?? const SizedBox.shrink(); + final spacerWidget = + configurations.spacerWidget ?? const SizedBox.shrink(); - return [ - if (configurations.showUndo) ...[ - QuillToolbarHistoryButton( - isUndo: true, - options: toolbarConfigurations.buttonOptions.undoHistory, - controller: toolbarConfigurations - .buttonOptions.undoHistory.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showRedo) ...[ - QuillToolbarHistoryButton( - isUndo: false, - options: toolbarConfigurations.buttonOptions.redoHistory, - controller: toolbarConfigurations - .buttonOptions.redoHistory.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showFontFamily) ...[ - QuillToolbarFontFamilyButton( - options: toolbarConfigurations.buttonOptions.fontFamily, - controller: toolbarConfigurations - .buttonOptions.fontFamily.controller ?? - globalController, - defaultDispalyText: context.loc.font, - ), - spacerWidget, - ], - if (configurations.showFontSize) ...[ - QuillToolbarFontSizeButton( - options: toolbarConfigurations.buttonOptions.fontSize, + return [ + if (configurations.showUndo) ...[ + QuillToolbarHistoryButton( + isUndo: true, + options: toolbarConfigurations.buttonOptions.undoHistory, + controller: + toolbarConfigurations.buttonOptions.undoHistory.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showRedo) ...[ + QuillToolbarHistoryButton( + isUndo: false, + options: toolbarConfigurations.buttonOptions.redoHistory, + controller: + toolbarConfigurations.buttonOptions.redoHistory.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showFontFamily) ...[ + QuillToolbarFontFamilyButton( + options: toolbarConfigurations.buttonOptions.fontFamily, + controller: + toolbarConfigurations.buttonOptions.fontFamily.controller ?? + globalController, + defaultDispalyText: context.loc.font, + ), + spacerWidget, + ], + if (configurations.showFontSize) ...[ + QuillToolbarFontSizeButton( + options: toolbarConfigurations.buttonOptions.fontSize, + controller: + toolbarConfigurations.buttonOptions.fontFamily.controller ?? + globalController, + defaultDisplayText: context.loc.fontSize, + ), + spacerWidget, + ], + if (configurations.showBoldButton) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.bold, + options: toolbarConfigurations.buttonOptions.bold, + controller: toolbarConfigurations.buttonOptions.bold.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showItalicButton) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.italic, + options: toolbarConfigurations.buttonOptions.italic, + controller: toolbarConfigurations.buttonOptions.italic.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showUnderLineButton) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.underline, + options: toolbarConfigurations.buttonOptions.underLine, + controller: + toolbarConfigurations.buttonOptions.underLine.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showInlineCode) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.inlineCode, + options: toolbarConfigurations.buttonOptions.inlineCode, + controller: + toolbarConfigurations.buttonOptions.inlineCode.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showSubscript) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.subscript, + options: toolbarConfigurations.buttonOptions.subscript, + controller: + toolbarConfigurations.buttonOptions.subscript.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showSuperscript) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.superscript, + options: toolbarConfigurations.buttonOptions.superscript, + controller: + toolbarConfigurations.buttonOptions.superscript.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showSmallButton) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.small, + options: toolbarConfigurations.buttonOptions.small, + controller: toolbarConfigurations.buttonOptions.small.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showStrikeThrough) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.strikeThrough, + options: toolbarConfigurations.buttonOptions.strikeThrough, + controller: + toolbarConfigurations.buttonOptions.strikeThrough.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showColorButton) ...[ + QuillToolbarColorButton( + controller: toolbarConfigurations.buttonOptions.color.controller ?? + globalController, + isBackground: false, + options: toolbarConfigurations.buttonOptions.color, + ), + spacerWidget, + ], + if (configurations.showBackgroundColorButton) ...[ + QuillToolbarColorButton( + options: toolbarConfigurations.buttonOptions.backgroundColor, + controller: toolbarConfigurations.buttonOptions.color.controller ?? + globalController, + isBackground: true, + ), + spacerWidget, + ], + if (configurations.showClearFormat) ...[ + QuillToolbarClearFormatButton( + controller: + toolbarConfigurations.buttonOptions.clearFormat.controller ?? + globalController, + options: toolbarConfigurations.buttonOptions.clearFormat, + ), + spacerWidget, + ], + if (theEmbedButtons != null) + for (final builder in theEmbedButtons) + builder( + globalController, + globalIconSize, + context.requireQuillToolbarBaseButtonOptions.iconTheme, + configurations.dialogTheme), + if (configurations.showDividers && + isButtonGroupShown[0] && + (isButtonGroupShown[1] || + isButtonGroupShown[2] || + isButtonGroupShown[3] || + isButtonGroupShown[4] || + isButtonGroupShown[5])) + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + if (configurations.showAlignmentButtons) ...[ + QuillToolbarSelectAlignmentButtons( + controller: toolbarConfigurations + .buttonOptions.selectAlignmentButtons.controller ?? + globalController, + options: toolbarConfigurations.buttonOptions.selectAlignmentButtons, + showLeftAlignment: configurations.showLeftAlignment, + showCenterAlignment: configurations.showCenterAlignment, + showRightAlignment: configurations.showRightAlignment, + showJustifyAlignment: configurations.showJustifyAlignment, + ), + spacerWidget, + ], + if (configurations.showDirection) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.rtl, + options: toolbarConfigurations.buttonOptions.direction, + controller: + toolbarConfigurations.buttonOptions.direction.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showDividers && + isButtonGroupShown[1] && + (isButtonGroupShown[2] || + isButtonGroupShown[3] || + isButtonGroupShown[4] || + isButtonGroupShown[5])) + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + if (configurations.showHeaderStyle) ...[ + QuillToolbarSelectHeaderStyleButton( + controller: toolbarConfigurations + .buttonOptions.selectHeaderStyleButtons.controller ?? + globalController, + options: + toolbarConfigurations.buttonOptions.selectHeaderStyleButtons, + ), + spacerWidget, + ], + if (configurations.showDividers && + configurations.showHeaderStyle && + isButtonGroupShown[2] && + (isButtonGroupShown[3] || + isButtonGroupShown[4] || + isButtonGroupShown[5])) + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + if (configurations.showListNumbers) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.ol, + options: toolbarConfigurations.buttonOptions.listNumbers, + controller: + toolbarConfigurations.buttonOptions.listNumbers.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showListBullets) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.ul, + options: toolbarConfigurations.buttonOptions.listBullets, + controller: + toolbarConfigurations.buttonOptions.listBullets.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showListCheck) ...[ + QuillToolbarToggleCheckListButton( + options: toolbarConfigurations.buttonOptions.toggleCheckList, + controller: toolbarConfigurations + .buttonOptions.toggleCheckList.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showCodeBlock) ...[ + QuillToolbarToggleStyleButton( + attribute: Attribute.codeBlock, + options: toolbarConfigurations.buttonOptions.codeBlock, + controller: + toolbarConfigurations.buttonOptions.codeBlock.controller ?? + globalController, + ), + spacerWidget, + ], + if (configurations.showDividers && + isButtonGroupShown[3] && + (isButtonGroupShown[4] || isButtonGroupShown[5])) ...[ + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + ], + if (configurations.showQuote) ...[ + QuillToolbarToggleStyleButton( + options: toolbarConfigurations.buttonOptions.quote, + controller: toolbarConfigurations.buttonOptions.quote.controller ?? + globalController, + attribute: Attribute.blockQuote, + ), + spacerWidget, + ], + if (configurations.showIndent) ...[ + QuillToolbarIndentButton( + controller: + toolbarConfigurations.buttonOptions.indentIncrease.controller ?? + globalController, + isIncrease: true, + options: toolbarConfigurations.buttonOptions.indentIncrease, + ), + spacerWidget, + ], + if (configurations.showIndent) ...[ + QuillToolbarIndentButton( + controller: + toolbarConfigurations.buttonOptions.indentDecrease.controller ?? + globalController, + isIncrease: false, + options: toolbarConfigurations.buttonOptions.indentDecrease, + ), + spacerWidget, + ], + if (configurations.showDividers && + isButtonGroupShown[4] && + isButtonGroupShown[5]) + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + if (configurations.showLink) ...[ + toolbarConfigurations.linkStyleType.isOriginal + ? QuillToolbarLinkStyleButton( controller: toolbarConfigurations - .buttonOptions.fontFamily.controller ?? + .buttonOptions.linkStyle.controller ?? globalController, - defaultDisplayText: context.loc.fontSize, - ), - spacerWidget, - ], - if (configurations.showBoldButton) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.bold, - options: toolbarConfigurations.buttonOptions.bold, - controller: - toolbarConfigurations.buttonOptions.bold.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showItalicButton) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.italic, - options: toolbarConfigurations.buttonOptions.italic, - controller: - toolbarConfigurations.buttonOptions.italic.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showUnderLineButton) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.underline, - options: toolbarConfigurations.buttonOptions.underLine, - controller: toolbarConfigurations - .buttonOptions.underLine.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showInlineCode) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.inlineCode, - options: toolbarConfigurations.buttonOptions.inlineCode, - controller: toolbarConfigurations - .buttonOptions.inlineCode.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showSubscript) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.subscript, - options: toolbarConfigurations.buttonOptions.subscript, + options: toolbarConfigurations.buttonOptions.linkStyle, + ) + : QuillToolbarLinkStyleButton2( controller: toolbarConfigurations - .buttonOptions.subscript.controller ?? + .buttonOptions.linkStyle2.controller ?? globalController, + options: toolbarConfigurations.buttonOptions.linkStyle2, ), - spacerWidget, - ], - if (configurations.showSuperscript) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.superscript, - options: toolbarConfigurations.buttonOptions.superscript, - controller: toolbarConfigurations - .buttonOptions.superscript.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showSmallButton) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.small, - options: toolbarConfigurations.buttonOptions.small, - controller: - toolbarConfigurations.buttonOptions.small.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showStrikeThrough) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.strikeThrough, - options: toolbarConfigurations.buttonOptions.strikeThrough, - controller: toolbarConfigurations - .buttonOptions.strikeThrough.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showColorButton) ...[ - QuillToolbarColorButton( - controller: - toolbarConfigurations.buttonOptions.color.controller ?? - globalController, - isBackground: false, - options: toolbarConfigurations.buttonOptions.color, - ), - spacerWidget, - ], - if (configurations.showBackgroundColorButton) ...[ - QuillToolbarColorButton( - options: toolbarConfigurations.buttonOptions.backgroundColor, - controller: - toolbarConfigurations.buttonOptions.color.controller ?? - globalController, - isBackground: true, - ), - spacerWidget, - ], - if (configurations.showClearFormat) ...[ - QuillToolbarClearFormatButton( - controller: toolbarConfigurations - .buttonOptions.clearFormat.controller ?? - globalController, - options: toolbarConfigurations.buttonOptions.clearFormat, - ), - spacerWidget, - ], - if (theEmbedButtons != null) - for (final builder in theEmbedButtons) - builder( - globalController, - globalIconSize, - context.requireQuillToolbarBaseButtonOptions.iconTheme, - configurations.dialogTheme), - if (configurations.showDividers && - isButtonGroupShown[0] && - (isButtonGroupShown[1] || - isButtonGroupShown[2] || - isButtonGroupShown[3] || - isButtonGroupShown[4] || - isButtonGroupShown[5])) - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, - ), - if (configurations.showAlignmentButtons) ...[ - QuillToolbarSelectAlignmentButtons( - controller: toolbarConfigurations - .buttonOptions.selectAlignmentButtons.controller ?? - globalController, - options: toolbarConfigurations - .buttonOptions.selectAlignmentButtons, - showLeftAlignment: configurations.showLeftAlignment, - showCenterAlignment: configurations.showCenterAlignment, - showRightAlignment: configurations.showRightAlignment, - showJustifyAlignment: configurations.showJustifyAlignment, - ), - spacerWidget, - ], - if (configurations.showDirection) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.rtl, - options: toolbarConfigurations.buttonOptions.direction, - controller: toolbarConfigurations - .buttonOptions.direction.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showDividers && - isButtonGroupShown[1] && - (isButtonGroupShown[2] || - isButtonGroupShown[3] || - isButtonGroupShown[4] || - isButtonGroupShown[5])) - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, - ), - if (configurations.showHeaderStyle) ...[ - QuillToolbarSelectHeaderStyleButton( - controller: toolbarConfigurations - .buttonOptions.selectHeaderStyleButtons.controller ?? - globalController, - options: toolbarConfigurations - .buttonOptions.selectHeaderStyleButtons, - ), - spacerWidget, - ], - if (configurations.showDividers && - configurations.showHeaderStyle && - isButtonGroupShown[2] && - (isButtonGroupShown[3] || - isButtonGroupShown[4] || - isButtonGroupShown[5])) - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, - ), - if (configurations.showListNumbers) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.ol, - options: toolbarConfigurations.buttonOptions.listNumbers, - controller: toolbarConfigurations - .buttonOptions.listNumbers.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showListBullets) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.ul, - options: toolbarConfigurations.buttonOptions.listBullets, - controller: toolbarConfigurations - .buttonOptions.listBullets.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showListCheck) ...[ - QuillToolbarToggleCheckListButton( - options: toolbarConfigurations.buttonOptions.toggleCheckList, - controller: toolbarConfigurations - .buttonOptions.toggleCheckList.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showCodeBlock) ...[ - QuillToolbarToggleStyleButton( - attribute: Attribute.codeBlock, - options: toolbarConfigurations.buttonOptions.codeBlock, - controller: toolbarConfigurations - .buttonOptions.codeBlock.controller ?? - globalController, - ), - spacerWidget, - ], - if (configurations.showDividers && - isButtonGroupShown[3] && - (isButtonGroupShown[4] || isButtonGroupShown[5])) ...[ - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, - ), - ], - if (configurations.showQuote) ...[ - QuillToolbarToggleStyleButton( - options: toolbarConfigurations.buttonOptions.quote, - controller: - toolbarConfigurations.buttonOptions.quote.controller ?? - globalController, - attribute: Attribute.blockQuote, - ), - spacerWidget, - ], - if (configurations.showIndent) ...[ - QuillToolbarIndentButton( - controller: toolbarConfigurations - .buttonOptions.indentIncrease.controller ?? - globalController, - isIncrease: true, - options: toolbarConfigurations.buttonOptions.indentIncrease, - ), - spacerWidget, - ], - if (configurations.showIndent) ...[ - QuillToolbarIndentButton( - controller: toolbarConfigurations - .buttonOptions.indentDecrease.controller ?? - globalController, - isIncrease: false, - options: toolbarConfigurations.buttonOptions.indentDecrease, - ), - spacerWidget, - ], - if (configurations.showDividers && - isButtonGroupShown[4] && - isButtonGroupShown[5]) - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, + spacerWidget, + ], + if (configurations.showSearchButton) ...[ + QuillToolbarSearchButton( + controller: toolbarConfigurations.buttonOptions.search.controller ?? + globalController, + options: toolbarConfigurations.buttonOptions.search, + ), + spacerWidget, + ], + if (configurations.customButtons.isNotEmpty) ...[ + if (configurations.showDividers) + QuillToolbarDivider( + axis, + color: configurations.sectionDividerColor, + space: configurations.sectionDividerSpace, + ), + for (final customButton in configurations.customButtons) + QuillToolbarCustomButton( + options: customButton, + controller: customButton.controller ?? globalController, + ), + // if (customButton.child != null) ...[ + // InkWell( + // onTap: customButton.onTap, + // child: customButton.child, + // ), + // ] else ...[ + // QuillToolbarCustomButton( + // options: + // toolbarConfigurations.buttonOptions.customButtons, + // controller: toolbarConfigurations + // .buttonOptions.customButtons.controller ?? + // globalController, + // ), + // ], + spacerWidget, + ], + ]; + } + + return QuillToolbarProvider( + toolbarConfigurations: configurations, + child: QuillToolbar( + configurations: QuillToolbarConfigurations( + buttonOptions: configurations.buttonOptions, + child: Builder( + builder: (context) { + if (configurations.multiRowsDisplay) { + return Wrap( + direction: configurations.axis, + alignment: configurations.toolbarIconAlignment, + crossAxisAlignment: configurations.toolbarIconCrossAlignment, + runSpacing: 4, + spacing: configurations.toolbarSectionSpacing, + children: childrenBuilder(context), + ); + } + return Container( + decoration: configurations.decoration ?? + BoxDecoration( + color: + configurations.color ?? Theme.of(context).canvasColor, + ), + constraints: BoxConstraints.tightFor( + height: configurations.axis == Axis.horizontal + ? configurations.toolbarSize + : null, + width: configurations.axis == Axis.vertical + ? configurations.toolbarSize + : null, ), - if (configurations.showLink) ...[ - toolbarConfigurations.linkStyleType.isOriginal - ? QuillToolbarLinkStyleButton( - controller: toolbarConfigurations - .buttonOptions.linkStyle.controller ?? - globalController, - options: toolbarConfigurations.buttonOptions.linkStyle, - ) - : QuillToolbarLinkStyleButton2( - controller: toolbarConfigurations - .buttonOptions.linkStyle2.controller ?? - globalController, - options: toolbarConfigurations.buttonOptions.linkStyle2, - ), - spacerWidget, - ], - if (configurations.showSearchButton) ...[ - QuillToolbarSearchButton( - controller: - toolbarConfigurations.buttonOptions.search.controller ?? - globalController, - options: toolbarConfigurations.buttonOptions.search, + child: QuillToolbarArrowIndicatedButtonList( + axis: configurations.axis, + buttons: childrenBuilder(context), ), - spacerWidget, - ], - if (configurations.customButtons.isNotEmpty) ...[ - if (configurations.showDividers) - QuillToolbarDivider( - axis, - color: configurations.sectionDividerColor, - space: configurations.sectionDividerSpace, - ), - for (final customButton in configurations.customButtons) - QuillToolbarCustomButton( - options: customButton, - controller: customButton.controller ?? globalController, - ), - // if (customButton.child != null) ...[ - // InkWell( - // onTap: customButton.onTap, - // child: customButton.child, - // ), - // ] else ...[ - // QuillToolbarCustomButton( - // options: - // toolbarConfigurations.buttonOptions.customButtons, - // controller: toolbarConfigurations - // .buttonOptions.customButtons.controller ?? - // globalController, - // ), - // ], - spacerWidget, - ], - ]; - }, + ); + }, + ), ), ), ); @@ -454,3 +471,51 @@ class QuillSimpleToolbar extends StatelessWidget ? const Size.fromHeight(defaultToolbarSize) : const Size.fromWidth(defaultToolbarSize); } + +/// The divider which is used for separation of buttons in the toolbar. +/// +/// It can be used outside of this package, for example when user does not use +/// [QuillToolbar.basic] and compose toolbar's children on its own. +class QuillToolbarDivider extends StatelessWidget { + const QuillToolbarDivider( + this.axis, { + super.key, + this.color, + this.space, + }); + + /// Provides a horizontal divider for vertical toolbar. + const QuillToolbarDivider.horizontal({Key? key, Color? color, double? space}) + : this(Axis.horizontal, color: color, space: space, key: key); + + /// Provides a horizontal divider for horizontal toolbar. + const QuillToolbarDivider.vertical({Key? key, Color? color, double? space}) + : this(Axis.vertical, color: color, space: space, key: key); + + /// The axis along which the toolbar is. + final Axis axis; + + /// The color to use when painting this divider's line. + final Color? color; + + /// The divider's space (width or height) depending of [axis]. + final double? space; + + @override + Widget build(BuildContext context) { + // Vertical toolbar requires horizontal divider, and vice versa + return axis == Axis.vertical + ? Divider( + height: space, + color: color, + indent: 12, + endIndent: 12, + ) + : VerticalDivider( + width: space, + color: color, + indent: 12, + endIndent: 12, + ); + } +} diff --git a/version.dart b/version.dart index 3fd9df73..5b59c4d6 100644 --- a/version.dart +++ b/version.dart @@ -1 +1 @@ -const version = '9.0.0-dev-4'; +const version = '9.0.0-dev-5';