diff --git a/CHANGELOG.md b/CHANGELOG.md index 4172b66f..76618fb6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +## [7.10.1] +- Fixes and use the new parameters +- You don't need to use MaterialApp anymore to use most of the toolbar buttons childBuilder anymore +- Compatibility with [fresh_quill_extensions](https://pub.dev/packages/fresh_quill_extensions) which is temporary alternative to [flutter_quill_extensions](https://pub.dev/packages/flutter_quill_extensions) +- Finally update most of the documentation in `README.md` + ## [7.10.0] - **Breaking change**: `QuillToolbar.basic()` can be accessed from `QuillToolbar()` directly and the old `QuillToolbar` can be accessed from `QuillBaseToolbar` - The Quill editor and toolbar configurations are now refactored in one single class for each one diff --git a/README.md b/README.md index 692d8e10..debda61c 100644 --- a/README.md +++ b/README.md @@ -63,14 +63,7 @@ dependencies: > > Using the latest version and reporting any issues you encounter on GitHub will greatly contribute to the improvement of the library. Your input and insights are valuable in shaping a stable and reliable version for all our users. Thank you for being part of the open-source community! > -> if you want to use a more stable release, please use the followings: -> -> ```yaml -> flutter_quill: ^7.4.16 -> flutter_quill_extensions: ^0.5.0 -> ``` -> -> instead of the latest version +> also [flutter_quill_extensions](https://pub.dev/packages/flutter_quill_extensions) will not work with the latest versions, please use [fresh_quill_extensions](https://pub.dev/packages/fresh_quill_extensions) as temporary alternative > ## Usage @@ -87,26 +80,28 @@ and then embed the toolbar and the editor, within your app. For example: QuillProvider( configurations: QuillConfigurations( controller: _controller, - editorConfigurations: QuillEditorConfigurations( - readOnly: _isReadonly, + sharedConfigurations: const QuillSharedConfigurations( + locale: Locale('de'), ), -), + ), child: Column( - children: [ - QuillToolbar.basic(), - Expanded( - child: Container( - child: QuillEditor.basic(), - ), - ) - ], -), + children: [ + const QuillToolbar(), + Expanded( + child: QuillEditor.basic( + configurations: const QuillEditorConfigurations( + readOnly: false, + ), + ), + ) + ], + ), ) ``` And depending on your use case, you might want to dispose the `_controller` in dispose mehtod -Check out [Sample Page] for advanced usage. +Check out [Sample Page] for more advanced usage. ## Input / Output @@ -210,7 +205,7 @@ To add an Icon, we should use a new QuillCustomButton class ```dart QuillCustomButton( - icon:Icons.ac_unit, + iconData: Icons.ac_unit, onTap: () { debugPrint('snowflake'); } @@ -220,30 +215,30 @@ To add an Icon, we should use a new QuillCustomButton class Each `QuillCustomButton` is used as part of the `customButtons` option as follows: ```dart -QuillToolbar.basic( - (...), +QuillToolbar( + configurations: QuillToolbarConfigurations( customButtons: [ - QuillCustomButton( - icon:Icons.ac_unit, - onTap: () { - debugPrint('snowflake1'); - } - ), - - QuillCustomButton( - icon:Icons.ac_unit, - onTap: () { - debugPrint('snowflake2'); - } - ), - - QuillCustomButton( - icon:Icons.ac_unit, - onTap: () { - debugPrint('snowflake3'); - } - ), - ] + QuillCustomButton( + iconData: Icons.ac_unit, + onTap: () { + debugPrint('snowflake1'); + }, + ), + QuillCustomButton( + iconData: Icons.ac_unit, + onTap: () { + debugPrint('snowflake2'); + }, + ), + QuillCustomButton( + iconData: Icons.ac_unit, + onTap: () { + debugPrint('snowflake3'); + }, + ), + ], + ), +), ``` ## Embed Blocks @@ -255,17 +250,33 @@ Provide a list of embed ### Using the embed blocks from `flutter_quill_extensions` ```dart -import 'package:flutter_quill_extensions/flutter_quill_extensions.dart'; - -QuillEditor.basic( - controller: controller, - embedBuilders: FlutterQuillEmbeds.builders(), -); +QuillToolbar( + configurations: QuillToolbarConfigurations( + embedButtons: FlutterQuillEmbeds.toolbarButtons( + imageButtonOptions: QuillToolbarImageButtonOptions( + onImagePickCallback: (file) async { + return file.path; + }, + ), + ), + ), +), +``` -QuillToolbar.basic( - controller: controller, - embedButtons: FlutterQuillEmbeds.buttons(), -); +```dart +Expanded( + child: QuillEditor.basic( + configurations: QuillEditorConfigurations( + readOnly: true, + embedBuilders: FlutterQuillEmbeds.editorBuilders( + imageEmbedConfigurations: + const QuillEditorImageEmbedConfigurations( + forceUseMobileOptionMenuForImageClick: true, + ), + ), + ), + ), +) ``` > [!WARNING] @@ -441,15 +452,179 @@ And voila, we have a custom widget inside of the rich text editor! > 1. For more info and a video example, see the [PR of this feature](https://github.com/singerdmx/flutter-quill/pull/877) > 2. For more details, check out [this YouTube video](https://youtu.be/pI5p5j7cfHc) + +### Custom Toolbar +If you want to use custom toolbar but still want the support of this libray +You can use the `QuillBaseToolbar` which is the base for the `QuillToolbar` + +> If you are using the toolbar buttons like `QuillToolbarHistoryButton`, `QuillToolbarToggleStyleButton` in the somewhere like the the custom toolbar then you must provide them with `QuillToolbarProvider` inherited widget, you don't have to do this if you are using the `QuillToolbar` since it will be done for you + +Example: + +```dart +QuillProvider( + configurations: QuillConfigurations( + controller: _controller, + sharedConfigurations: const QuillSharedConfigurations(), + ), + child: Column( + children: [ + QuillToolbarProvider( + toolbarConfigurations: const QuillToolbarConfigurations(), + child: QuillBaseToolbar( + configurations: QuillBaseToolbarConfigurations( + toolbarSize: 15 * 2, + multiRowsDisplay: false, + childrenBuilder: (context) { + final controller = context.requireQuillController; + return [ + QuillToolbarHistoryButton( + controller: controller, + options: const QuillToolbarHistoryButtonOptions( + isUndo: true), + ), + QuillToolbarHistoryButton( + controller: controller, + options: const QuillToolbarHistoryButtonOptions( + isUndo: false), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.bold, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_bold, + iconSize: 20, + ), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.italic, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_italic, + iconSize: 20, + ), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.underline, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_underline, + iconSize: 20, + ), + ), + QuillToolbarClearFormatButton( + controller: controller, + options: const QuillToolbarClearFormatButtonOptions( + iconData: Icons.format_clear, + iconSize: 20, + ), + ), + VerticalDivider( + indent: 12, + endIndent: 12, + color: Colors.grey.shade400, + ), + QuillToolbarSelectHeaderStyleButtons( + controller: controller, + options: + const QuillToolbarSelectHeaderStyleButtonsOptions( + iconSize: 20, + ), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.ol, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_list_numbered, + iconSize: 20, + ), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.ul, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_list_bulleted, + iconSize: 20, + ), + ), + QuillToolbarToggleStyleButton( + attribute: Attribute.blockQuote, + controller: controller, + options: const QuillToolbarToggleStyleButtonOptions( + iconData: Icons.format_quote, + iconSize: 20, + ), + ), + VerticalDivider( + indent: 12, + endIndent: 12, + color: Colors.grey.shade400, + ), + QuillToolbarIndentButton( + controller: controller, + isIncrease: true, + options: const QuillToolbarIndentButtonOptions( + iconData: Icons.format_indent_increase, + iconSize: 20, + )), + QuillToolbarIndentButton( + controller: controller, + isIncrease: false, + options: const QuillToolbarIndentButtonOptions( + iconData: Icons.format_indent_decrease, + iconSize: 20, + ), + ), + ]; + }, + ), + ), + ), + Expanded( + child: QuillEditor.basic( + configurations: const QuillEditorConfigurations( + readOnly: false, + placeholder: 'Write your notes', + padding: EdgeInsets.all(16), + ), + ), + ) + ], + ), +) +``` + +if you want more customized toolbar feel free to create your own and use the `controller` to interact with the editor. checkout the `QuillToolbar` and the buttons inside it to see an example of how that will works + ### Translation The package offers translations for the quill toolbar and editor, it will follow the system locale unless you set your own locale with: ```dart -QuillToolbar(locale: Locale('fr'), ...) -QuillEditor(locale: Locale('fr'), ...) + QuillProvider( + configurations: QuillConfigurations( + controller: _controller, + sharedConfigurations: const QuillSharedConfigurations( + locale: Locale('fr'), + ), + ), + child: Column( + children: [ + const QuillToolbar( + configurations: QuillToolbarConfigurations(), + ), + Expanded( + child: QuillEditor.basic( + configurations: const QuillEditorConfigurations(), + ), + ) + ], + ), +) ``` +### + Currently, translations are available for these 31 locales: * `Locale('en')` diff --git a/doc_cn.md b/doc_cn.md index cca4c12d..680b4d72 100644 --- a/doc_cn.md +++ b/doc_cn.md @@ -24,6 +24,8 @@ --- +> This documentation is outdated. Please check the English version. + `FlutterQuill` 是一个富文本编辑器，也是 [Quill](https://quilljs.com/docs/formats) 在 [Flutter](https://github.com/flutter/flutter) 的版本 该库是为 Android、iOS、Web、Desktop 多平台构建的『所见即所得』的富文本编辑器。查看我们的 [Youtube 播放列表](https://youtube.com/playlist?list=PLbhaS_83B97vONkOAWGJrSXWX58et9zZ2) 或 [代码介绍](https://github.com/singerdmx/flutter-quill/blob/master/CodeIntroduction.md) 以了解代码的详细内容。你可以加入我们的 [Slack Group](https://join.slack.com/t/bulletjournal1024/shared_invite/zt-fys7t9hi-ITVU5PGDen1rNRyCjdcQ2g) 来进行讨论 diff --git a/flutter_quill_extensions/lib/embeds/builders.dart b/flutter_quill_extensions/lib/embeds/builders.dart index 5b3103f1..2492fd7c 100644 --- a/flutter_quill_extensions/lib/embeds/builders.dart +++ b/flutter_quill_extensions/lib/embeds/builders.dart @@ -416,10 +416,6 @@ Widget _menuOptionsForReadonlyImage({ onPressed: () { Navigator.pushReplacement( context, - // TODO: Consider add support for other theme system - // like Cupertino or at least add the option to by - // by using PageRoute as option so dev can ovveride this - // this change should be done in all places if you want to MaterialPageRoute( builder: (context) => ImageTapWrapper( imageUrl: imageUrl, diff --git a/lib/flutter_quill.dart b/lib/flutter_quill.dart index e8234cb2..25f8c901 100644 --- a/lib/flutter_quill.dart +++ b/lib/flutter_quill.dart @@ -1,6 +1,7 @@ library flutter_quill; export 'src/models/config/quill_configurations.dart'; +export 'src/models/config/toolbar/base_configurations.dart'; export 'src/models/documents/attribute.dart'; export 'src/models/documents/document.dart'; export 'src/models/documents/nodes/block.dart'; @@ -20,6 +21,7 @@ export 'src/models/themes/quill_custom_button.dart'; export 'src/models/themes/quill_dialog_theme.dart'; export 'src/models/themes/quill_icon_theme.dart'; export 'src/utils/embeds.dart'; +export 'src/utils/extensions/build_context.dart'; export 'src/widgets/controller.dart'; export 'src/widgets/default_styles.dart'; export 'src/widgets/editor/editor.dart'; @@ -27,6 +29,5 @@ export 'src/widgets/embeds.dart'; export 'src/widgets/link.dart' show LinkActionPickerDelegate, LinkMenuAction; export 'src/widgets/style_widgets/style_widgets.dart'; export 'src/widgets/toolbar/base_toolbar.dart'; -export 'src/widgets/toolbar/enum.dart'; export 'src/widgets/toolbar/toolbar.dart'; export 'src/widgets/utils/provider.dart'; diff --git a/lib/src/models/config/toolbar/base_configurations.dart b/lib/src/models/config/toolbar/base_configurations.dart index 8b66db62..132fdc8d 100644 --- a/lib/src/models/config/toolbar/base_configurations.dart +++ b/lib/src/models/config/toolbar/base_configurations.dart @@ -59,5 +59,5 @@ class QuillBaseToolbarConfigurations extends Equatable { final Decoration? decoration; @override - List get props => throw UnimplementedError(); + List get props => []; } diff --git a/lib/src/utils/extensions/build_context.dart b/lib/src/utils/extensions/build_context.dart index 3c768ae0..0b5fdbc5 100644 --- a/lib/src/utils/extensions/build_context.dart +++ b/lib/src/utils/extensions/build_context.dart @@ -2,6 +2,7 @@ import 'package:flutter/widgets.dart' show BuildContext; import '../../../flutter_quill.dart'; +/// Public shared extension extension BuildContextExt on BuildContext { /// return [QuillProvider] as not null /// throw exception if it's not in the widget tree diff --git a/lib/src/widgets/editor/editor.dart b/lib/src/widgets/editor/editor.dart index 4bd43e1c..bc11b35e 100644 --- a/lib/src/widgets/editor/editor.dart +++ b/lib/src/widgets/editor/editor.dart @@ -15,7 +15,6 @@ import 'package:i18n_extension/i18n_widget.dart'; import '../../../flutter_quill.dart'; import '../../models/documents/nodes/container.dart' as container_node; -import '../../utils/extensions/build_context.dart'; import '../../utils/platform.dart'; import '../box.dart'; import '../cursor.dart'; @@ -154,26 +153,20 @@ class QuillEditor extends StatefulWidget { /// The configurations for the quill editor widget of flutter quill QuillEditorConfigurations configurations = const QuillEditorConfigurations(), - TextSelectionThemeData? textSelectionThemeData, - Brightness? keyboardAppearance, - Iterable? embedBuilders, - EdgeInsetsGeometry padding = EdgeInsets.zero, - bool autoFocus = true, - bool expands = false, FocusNode? focusNode, - GlobalKey? editorKey, + ScrollController? scrollController, }) { return QuillEditor( - scrollController: ScrollController(), + scrollController: scrollController ?? ScrollController(), focusNode: focusNode ?? FocusNode(), configurations: configurations.copyWith( - textSelectionThemeData: textSelectionThemeData, - autoFocus: autoFocus, - expands: expands, - padding: padding, - keyboardAppearance: keyboardAppearance ?? Brightness.light, - embedBuilders: embedBuilders, - editorKey: editorKey, + textSelectionThemeData: configurations.textSelectionThemeData, + autoFocus: configurations.autoFocus, + expands: configurations.expands, + padding: configurations.padding, + keyboardAppearance: configurations.keyboardAppearance, + embedBuilders: configurations.embedBuilders, + editorKey: configurations.editorKey, ), ); } diff --git a/lib/src/widgets/toolbar/base_toolbar.dart b/lib/src/widgets/toolbar/base_toolbar.dart index 5b75dfe3..b422c713 100644 --- a/lib/src/widgets/toolbar/base_toolbar.dart +++ b/lib/src/widgets/toolbar/base_toolbar.dart @@ -1,7 +1,8 @@ import 'package:flutter/material.dart'; import 'package:i18n_extension/i18n_widget.dart'; -import '../../../flutter_quill.dart'; +import '../../../flutter_quill.dart' + show QuillBaseToolbarProvider, defaultToolbarSize; import '../../models/config/toolbar/base_configurations.dart'; import '../../utils/extensions/build_context.dart'; import 'buttons/arrow_indicated_list.dart'; @@ -50,34 +51,39 @@ class QuillBaseToolbar extends StatelessWidget implements PreferredSizeWidget { final toolbarSize = configurations.toolbarSize; return I18n( initialLocale: context.quillSharedConfigurations?.locale, - 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(context), + 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(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(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(context), - ), - ); - }, + }, + ), ), ); } diff --git a/lib/src/widgets/toolbar/buttons/clear_format.dart b/lib/src/widgets/toolbar/buttons/clear_format.dart index aabf5576..2e2c4e9d 100644 --- a/lib/src/widgets/toolbar/buttons/clear_format.dart +++ b/lib/src/widgets/toolbar/buttons/clear_format.dart @@ -66,10 +66,7 @@ class QuillToolbarClearFormatButton extends StatelessWidget { @override Widget build(BuildContext context) { - final theme = Theme.of(context); final iconTheme = _iconTheme(context); - final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; - final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor; final tooltip = _tooltip(context); final iconSize = _iconSize(context); final iconData = _iconData(context); @@ -99,6 +96,11 @@ class QuillToolbarClearFormatButton extends StatelessWidget { ); } + final theme = Theme.of(context); + + final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; + final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor; + return QuillToolbarIconButton( tooltip: tooltip, highlightElevation: 0, diff --git a/lib/src/widgets/toolbar/buttons/color.dart b/lib/src/widgets/toolbar/buttons/color.dart index fd5ae817..ed431fea 100644 --- a/lib/src/widgets/toolbar/buttons/color.dart +++ b/lib/src/widgets/toolbar/buttons/color.dart @@ -157,6 +157,8 @@ class _QuillToolbarColorButtonState extends State { final childBuilder = options.childBuilder ?? baseButtonExtraOptions.childBuilder; if (childBuilder != null) { + // if the caller using Cupertino app he might need to wrap the builder + // with Material() widget return childBuilder( options, QuillToolbarColorButtonExtraOptions( @@ -166,7 +168,7 @@ class _QuillToolbarColorButtonState extends State { _showColorPicker(); afterButtonPressed?.call(); }, - iconColor: iconColor, + iconColor: null, iconColorBackground: iconColorBackground, fillColor: fillColor, fillColorBackground: fillColorBackground, diff --git a/lib/src/widgets/toolbar/buttons/custom_button.dart b/lib/src/widgets/toolbar/buttons/custom_button.dart index 14911446..50745e74 100644 --- a/lib/src/widgets/toolbar/buttons/custom_button.dart +++ b/lib/src/widgets/toolbar/buttons/custom_button.dart @@ -12,8 +12,8 @@ class CustomButton extends StatelessWidget { this.iconTheme, this.afterButtonPressed, this.tooltip, - Key? key, - }) : super(key: key); + super.key, + }); final VoidCallback? onPressed; final IconData? icon; diff --git a/lib/src/widgets/toolbar/buttons/font_size.dart b/lib/src/widgets/toolbar/buttons/font_size.dart index 5eebe463..419ad46a 100644 --- a/lib/src/widgets/toolbar/buttons/font_size.dart +++ b/lib/src/widgets/toolbar/buttons/font_size.dart @@ -3,7 +3,6 @@ import 'package:flutter/material.dart'; import '../../../../extensions.dart'; import '../../../../flutter_quill.dart'; import '../../../translations/toolbar.i18n.dart'; -import '../../../utils/extensions/build_context.dart'; import '../../../utils/font.dart'; class QuillToolbarFontSizeButton extends StatefulWidget { diff --git a/lib/src/widgets/toolbar/buttons/history.dart b/lib/src/widgets/toolbar/buttons/history.dart index 2098eb52..297b4b9f 100644 --- a/lib/src/widgets/toolbar/buttons/history.dart +++ b/lib/src/widgets/toolbar/buttons/history.dart @@ -49,8 +49,6 @@ class _QuillToolbarHistoryButtonState extends State { @override Widget build(BuildContext context) { - theme = Theme.of(context); - final baseButtonConfigurations = context.requireQuillToolbarBaseButtonOptions; final tooltip = options.tooltip ?? @@ -65,8 +63,6 @@ class _QuillToolbarHistoryButtonState extends State { context.requireQuillToolbarBaseButtonOptions.globalIconSize; final iconTheme = options.iconTheme ?? baseButtonConfigurations.iconTheme; - final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor; - final afterButtonPressed = options.afterButtonPressed ?? baseButtonConfigurations.afterButtonPressed; @@ -92,6 +88,10 @@ class _QuillToolbarHistoryButtonState extends State { ), ); } + + theme = Theme.of(context); + + final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor; return QuillToolbarIconButton( tooltip: tooltip, highlightElevation: 0, diff --git a/lib/src/widgets/toolbar/buttons/indent.dart b/lib/src/widgets/toolbar/buttons/indent.dart index 0ce83764..8aad9671 100644 --- a/lib/src/widgets/toolbar/buttons/indent.dart +++ b/lib/src/widgets/toolbar/buttons/indent.dart @@ -70,8 +70,34 @@ class _QuillToolbarIndentButtonState extends State { (widget.isIncrease ? 'Increase indent'.i18n : 'Decrease indent'.i18n); } + void _sharedOnPressed() { + widget.controller.indentSelection(widget.isIncrease); + } + @override Widget build(BuildContext context) { + final childBuilder = + options.childBuilder ?? baseButtonExtraOptions.childBuilder; + + if (childBuilder != null) { + return childBuilder( + QuillToolbarIndentButtonOptions( + afterButtonPressed: afterButtonPressed, + iconData: iconData, + iconSize: iconSize, + iconTheme: iconTheme, + tooltip: tooltip, + ), + QuillToolbarIndentButtonExtraOptions( + controller: controller, + context: context, + onPressed: () { + _sharedOnPressed(); + afterButtonPressed?.call(); + }, + ), + ); + } final theme = Theme.of(context); final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; @@ -85,9 +111,7 @@ class _QuillToolbarIndentButtonState extends State { icon: Icon(iconData, size: iconSize, color: iconColor), fillColor: iconFillColor, borderRadius: iconTheme?.borderRadius ?? 2, - onPressed: () { - widget.controller.indentSelection(widget.isIncrease); - }, + onPressed: _sharedOnPressed, afterPressed: afterButtonPressed, ); } diff --git a/lib/src/widgets/toolbar/buttons/link_style.dart b/lib/src/widgets/toolbar/buttons/link_style.dart index 2188aeff..15cd5af1 100644 --- a/lib/src/widgets/toolbar/buttons/link_style.dart +++ b/lib/src/widgets/toolbar/buttons/link_style.dart @@ -19,15 +19,6 @@ class QuillToolbarLinkStyleButton extends StatefulWidget { }); final QuillController controller; - // final IconData? icon; - // final double iconSize; - // final QuillIconTheme? iconTheme; - // final QuillDialogTheme? dialogTheme; - // final VoidCallback? afterButtonPressed; - // final String? tooltip; - // final RegExp? linkRegExp; - // final LinkDialogAction? linkDialogAction; - // final Color dialogBarrierColor; final QuillToolbarLinkStyleButtonOptions options; @override @@ -110,7 +101,6 @@ class _QuillToolbarLinkStyleButtonState @override Widget build(BuildContext context) { - final theme = Theme.of(context); final isToggled = _getLinkAttributeValue() != null; final pressedHandler = () => _openLinkDialog(context); @@ -140,6 +130,7 @@ class _QuillToolbarLinkStyleButtonState ), ); } + final theme = Theme.of(context); return QuillToolbarIconButton( tooltip: tooltip, highlightElevation: 0, diff --git a/lib/src/widgets/toolbar/buttons/search/search.dart b/lib/src/widgets/toolbar/buttons/search/search.dart index 6773aab5..0f8537f0 100644 --- a/lib/src/widgets/toolbar/buttons/search/search.dart +++ b/lib/src/widgets/toolbar/buttons/search/search.dart @@ -64,18 +64,12 @@ class QuillToolbarSearchButton extends StatelessWidget { @override Widget build(BuildContext context) { - final theme = Theme.of(context); - final iconTheme = _iconTheme(context); final tooltip = _tooltip(context); final iconData = _iconData(context); final iconSize = _iconSize(context); final afterButtonPressed = _afterButtonPressed(context); - final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; - final iconFillColor = iconTheme?.iconUnselectedFillColor ?? - (options.fillColor ?? theme.canvasColor); - final childBuilder = options.childBuilder ?? baseButtonExtraOptions(context).childBuilder; @@ -103,6 +97,12 @@ class QuillToolbarSearchButton extends StatelessWidget { ); } + final theme = Theme.of(context); + + final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; + final iconFillColor = iconTheme?.iconUnselectedFillColor ?? + (options.fillColor ?? theme.canvasColor); + return QuillToolbarIconButton( tooltip: tooltip, icon: Icon( diff --git a/lib/src/widgets/toolbar/buttons/select_alignment.dart b/lib/src/widgets/toolbar/buttons/select_alignment.dart index 03bccd82..2d4018dd 100644 --- a/lib/src/widgets/toolbar/buttons/select_alignment.dart +++ b/lib/src/widgets/toolbar/buttons/select_alignment.dart @@ -183,8 +183,6 @@ class _QuillToolbarSelectAlignmentButtonState // Attribute.justifyAlignment: ToolbarButtons.justifyAlignment, // }; - final theme = Theme.of(context); - final buttonCount = ((widget.showLeftAlignment!) ? 1 : 0) + ((widget.showCenterAlignment!) ? 1 : 0) + ((widget.showRightAlignment!) ? 1 : 0) + @@ -200,6 +198,8 @@ class _QuillToolbarSelectAlignmentButtonState ); } + final theme = Theme.of(context); + return Row( mainAxisSize: MainAxisSize.min, children: List.generate(buttonCount, (index) { diff --git a/lib/src/widgets/toolbar/buttons/select_header_style.dart b/lib/src/widgets/toolbar/buttons/select_header_style.dart index 7b840e11..57ba28d2 100644 --- a/lib/src/widgets/toolbar/buttons/select_header_style.dart +++ b/lib/src/widgets/toolbar/buttons/select_header_style.dart @@ -99,7 +99,6 @@ class _QuillToolbarSelectHeaderStyleButtonsState 'All attributes must be one of them: header, h1, h2 or h3', ); - final theme = Theme.of(context); final style = TextStyle( fontWeight: FontWeight.w600, fontSize: iconSize * 0.7, @@ -114,6 +113,7 @@ class _QuillToolbarSelectHeaderStyleButtonsState ' is not supported. Yet but we will work on that soon.', ); } + final theme = Theme.of(context); final children = options.attributes.map((attribute) { final isSelected = _selectedAttribute == attribute; diff --git a/lib/src/widgets/toolbar/buttons/toggle_style.dart b/lib/src/widgets/toolbar/buttons/toggle_style.dart index fa351292..38b8bc6b 100644 --- a/lib/src/widgets/toolbar/buttons/toggle_style.dart +++ b/lib/src/widgets/toolbar/buttons/toggle_style.dart @@ -26,37 +26,13 @@ class QuillToolbarToggleStyleButton extends StatefulWidget { required this.options, required this.controller, required this.attribute, - // required this.icon, - // required this.controller, - // this.iconSize = kDefaultIconSize, - // this.fillColor, - // this.childBuilder = defaultToggleStyleButtonBuilder, - // this.iconTheme, - // this.afterButtonPressed, - // this.tooltip, super.key, }); final Attribute attribute; - // final IconData icon; - // final double iconSize; - - // final Color? fillColor; - - // final QuillController controller; - - // final ToggleStyleButtonBuilder childBuilder; - - // ///Specify an icon theme for the icons in the toolbar - // final QuillIconTheme? iconTheme; - - // final VoidCallback? afterButtonPressed; - // final String? tooltip; final QuillToolbarToggleStyleButtonOptions options; - /// Since we can't get the state from the instace of the widget for comparing - /// in [didUpdateWidget] then we will have to store reference here final QuillController controller; @override diff --git a/lib/src/widgets/toolbar/enum.dart b/lib/src/widgets/toolbar/enum.dart deleted file mode 100644 index 6f9e23a7..00000000 --- a/lib/src/widgets/toolbar/enum.dart +++ /dev/null @@ -1,122 +0,0 @@ -enum ToolbarButtons { - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - undo, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - redo, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - fontFamily, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - fontSize, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - bold, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - subscript, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - superscript, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - italic, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - small, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - underline, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - strikeThrough, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - inlineCode, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - color, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - backgroundColor, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - clearFormat, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - centerAlignment, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - leftAlignment, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - rightAlignment, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - justifyAlignment, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - direction, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - headerStyle, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - listNumbers, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - listBullets, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - listChecks, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - codeBlock, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - quote, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - indentIncrease, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - indentDecrease, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - link, - @Deprecated('Please customize the button in the QuillProvider. ' - 'You will find toolbarConfigurations and then buttons and pass a value' - ' and change what you want, the tooltip for spesefic button for example') - search, -} diff --git a/lib/src/widgets/toolbar/toolbar.dart b/lib/src/widgets/toolbar/toolbar.dart index 1ea5a15c..9dbee7df 100644 --- a/lib/src/widgets/toolbar/toolbar.dart +++ b/lib/src/widgets/toolbar/toolbar.dart @@ -1,8 +1,6 @@ import 'package:flutter/material.dart'; import '../../../flutter_quill.dart'; -import '../../models/config/toolbar/base_configurations.dart'; -import '../../utils/extensions/build_context.dart'; class QuillToolbar extends StatelessWidget { const QuillToolbar({ diff --git a/lib/src/widgets/utils/provider.dart b/lib/src/widgets/utils/provider.dart index ff217bba..69340b36 100644 --- a/lib/src/widgets/utils/provider.dart +++ b/lib/src/widgets/utils/provider.dart @@ -3,6 +3,7 @@ import 'package:flutter/widgets.dart' show BuildContext, InheritedWidget, Widget; import '../../models/config/quill_configurations.dart'; +import '../../models/config/toolbar/base_configurations.dart'; class QuillProvider extends InheritedWidget { const QuillProvider({ @@ -118,6 +119,64 @@ class QuillToolbarProvider extends InheritedWidget { } } +// Not really needed +class QuillBaseToolbarProvider extends InheritedWidget { + const QuillBaseToolbarProvider({ + required super.child, + required this.toolbarConfigurations, + }); + + /// The configurations for the toolbar widget of flutter quill + final QuillBaseToolbarConfigurations toolbarConfigurations; + + @override + bool updateShouldNotify(covariant QuillBaseToolbarProvider oldWidget) { + return oldWidget.toolbarConfigurations != toolbarConfigurations; + } + + static QuillBaseToolbarProvider? of(BuildContext context) { + /// The configurations for the quill editor widget of flutter quill + return context + .dependOnInheritedWidgetOfExactType(); + } + + static QuillBaseToolbarProvider ofNotNull(BuildContext context) { + final provider = of(context); + if (provider == null) { + if (kDebugMode) { + debugPrint( + 'The quill toolbar provider must be provided in the widget tree.', + ); + } + throw ArgumentError.checkNotNull( + 'You are using a widget in the Flutter quill library that require ' + 'The Quill toolbar provider widget to be in the parent widget tree ' + 'because ' + 'The provider is $provider. Please make sure to wrap this widget' + ' with' + ' QuillProvider widget. ' + 'You might using QuillToolbar so make sure to' + ' wrap them with the quill provider widget and setup the required ' + 'configurations', + 'QuillProvider', + ); + } + return provider; + } + + /// To pass the [QuillBaseToolbarConfigurations] instance as value + /// instead of creating new widget + static QuillBaseToolbarProvider value({ + required QuillBaseToolbarConfigurations value, + required Widget child, + }) { + return QuillBaseToolbarProvider( + toolbarConfigurations: value, + child: child, + ); + } +} + class QuillEditorProvider extends InheritedWidget { const QuillEditorProvider({ required super.child, diff --git a/pubspec.yaml b/pubspec.yaml index b6906df7..85f95b35 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: flutter_quill description: A rich text editor built for the modern Android, iOS, web and desktop platforms. It is the WYSIWYG editor and a Quill component for Flutter. -version: 7.10.0 +version: 7.10.1 homepage: https://1o24bbs.com/c/bulletjournal/108 repository: https://github.com/singerdmx/flutter-quill topics: