Fixes for previous step (#1467)

pull/1470/head
Ellet 1 year ago committed by GitHub
parent 45b43fa132
commit 8149e2b2d1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 6
      CHANGELOG.md
  2. 289
      README.md
  3. 2
      doc_cn.md
  4. 4
      flutter_quill_extensions/lib/embeds/builders.dart
  5. 3
      lib/flutter_quill.dart
  6. 2
      lib/src/models/config/toolbar/base_configurations.dart
  7. 1
      lib/src/utils/extensions/build_context.dart
  8. 25
      lib/src/widgets/editor/editor.dart
  9. 62
      lib/src/widgets/toolbar/base_toolbar.dart
  10. 8
      lib/src/widgets/toolbar/buttons/clear_format.dart
  11. 4
      lib/src/widgets/toolbar/buttons/color.dart
  12. 4
      lib/src/widgets/toolbar/buttons/custom_button.dart
  13. 1
      lib/src/widgets/toolbar/buttons/font_size.dart
  14. 8
      lib/src/widgets/toolbar/buttons/history.dart
  15. 30
      lib/src/widgets/toolbar/buttons/indent.dart
  16. 11
      lib/src/widgets/toolbar/buttons/link_style.dart
  17. 12
      lib/src/widgets/toolbar/buttons/search/search.dart
  18. 4
      lib/src/widgets/toolbar/buttons/select_alignment.dart
  19. 2
      lib/src/widgets/toolbar/buttons/select_header_style.dart
  20. 24
      lib/src/widgets/toolbar/buttons/toggle_style.dart
  21. 122
      lib/src/widgets/toolbar/enum.dart
  22. 2
      lib/src/widgets/toolbar/toolbar.dart
  23. 59
      lib/src/widgets/utils/provider.dart
  24. 2
      pubspec.yaml

@ -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] ## [7.10.0]
- **Breaking change**: `QuillToolbar.basic()` can be accessed from `QuillToolbar()` directly and the old `QuillToolbar` can be accessed from `QuillBaseToolbar` - **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 - The Quill editor and toolbar configurations are now refactored in one single class for each one

@ -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! > 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: > 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
>
> ```yaml
> flutter_quill: ^7.4.16
> flutter_quill_extensions: ^0.5.0
> ```
>
> instead of the latest version
> >
## Usage ## Usage
@ -87,26 +80,28 @@ and then embed the toolbar and the editor, within your app. For example:
QuillProvider( QuillProvider(
configurations: QuillConfigurations( configurations: QuillConfigurations(
controller: _controller, controller: _controller,
editorConfigurations: QuillEditorConfigurations( sharedConfigurations: const QuillSharedConfigurations(
readOnly: _isReadonly, locale: Locale('de'),
), ),
), ),
child: Column( child: Column(
children: [ children: [
QuillToolbar.basic(), const QuillToolbar(),
Expanded( Expanded(
child: Container( child: QuillEditor.basic(
child: QuillEditor.basic(), configurations: const QuillEditorConfigurations(
), readOnly: false,
) ),
], ),
), )
],
),
) )
``` ```
And depending on your use case, you might want to dispose the `_controller` in dispose mehtod 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 ## Input / Output
@ -210,7 +205,7 @@ To add an Icon, we should use a new QuillCustomButton class
```dart ```dart
QuillCustomButton( QuillCustomButton(
icon:Icons.ac_unit, iconData: Icons.ac_unit,
onTap: () { onTap: () {
debugPrint('snowflake'); 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: Each `QuillCustomButton` is used as part of the `customButtons` option as follows:
```dart ```dart
QuillToolbar.basic( QuillToolbar(
(...), configurations: QuillToolbarConfigurations(
customButtons: [ customButtons: [
QuillCustomButton( QuillCustomButton(
icon:Icons.ac_unit, iconData: Icons.ac_unit,
onTap: () { onTap: () {
debugPrint('snowflake1'); debugPrint('snowflake1');
} },
), ),
QuillCustomButton(
QuillCustomButton( iconData: Icons.ac_unit,
icon:Icons.ac_unit, onTap: () {
onTap: () { debugPrint('snowflake2');
debugPrint('snowflake2'); },
} ),
), QuillCustomButton(
iconData: Icons.ac_unit,
QuillCustomButton( onTap: () {
icon:Icons.ac_unit, debugPrint('snowflake3');
onTap: () { },
debugPrint('snowflake3'); ),
} ],
), ),
] ),
``` ```
## Embed Blocks ## Embed Blocks
@ -255,17 +250,33 @@ Provide a list of embed
### Using the embed blocks from `flutter_quill_extensions` ### Using the embed blocks from `flutter_quill_extensions`
```dart ```dart
import 'package:flutter_quill_extensions/flutter_quill_extensions.dart'; QuillToolbar(
configurations: QuillToolbarConfigurations(
QuillEditor.basic( embedButtons: FlutterQuillEmbeds.toolbarButtons(
controller: controller, imageButtonOptions: QuillToolbarImageButtonOptions(
embedBuilders: FlutterQuillEmbeds.builders(), onImagePickCallback: (file) async {
); return file.path;
},
),
),
),
),
```
QuillToolbar.basic( ```dart
controller: controller, Expanded(
embedButtons: FlutterQuillEmbeds.buttons(), child: QuillEditor.basic(
); configurations: QuillEditorConfigurations(
readOnly: true,
embedBuilders: FlutterQuillEmbeds.editorBuilders(
imageEmbedConfigurations:
const QuillEditorImageEmbedConfigurations(
forceUseMobileOptionMenuForImageClick: true,
),
),
),
),
)
``` ```
> [!WARNING] > [!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) > 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) > 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 ### Translation
The package offers translations for the quill toolbar and editor, it will follow the system locale unless you set your own locale with: The package offers translations for the quill toolbar and editor, it will follow the system locale unless you set your own locale with:
```dart ```dart
QuillToolbar(locale: Locale('fr'), ...) QuillProvider(
QuillEditor(locale: Locale('fr'), ...) 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: Currently, translations are available for these 31 locales:
* `Locale('en')` * `Locale('en')`

@ -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) 的版本 `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) 来进行讨论 该库是为 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) 来进行讨论

@ -416,10 +416,6 @@ Widget _menuOptionsForReadonlyImage({
onPressed: () { onPressed: () {
Navigator.pushReplacement( Navigator.pushReplacement(
context, 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( MaterialPageRoute(
builder: (context) => ImageTapWrapper( builder: (context) => ImageTapWrapper(
imageUrl: imageUrl, imageUrl: imageUrl,

@ -1,6 +1,7 @@
library flutter_quill; library flutter_quill;
export 'src/models/config/quill_configurations.dart'; 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/attribute.dart';
export 'src/models/documents/document.dart'; export 'src/models/documents/document.dart';
export 'src/models/documents/nodes/block.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_dialog_theme.dart';
export 'src/models/themes/quill_icon_theme.dart'; export 'src/models/themes/quill_icon_theme.dart';
export 'src/utils/embeds.dart'; export 'src/utils/embeds.dart';
export 'src/utils/extensions/build_context.dart';
export 'src/widgets/controller.dart'; export 'src/widgets/controller.dart';
export 'src/widgets/default_styles.dart'; export 'src/widgets/default_styles.dart';
export 'src/widgets/editor/editor.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/link.dart' show LinkActionPickerDelegate, LinkMenuAction;
export 'src/widgets/style_widgets/style_widgets.dart'; export 'src/widgets/style_widgets/style_widgets.dart';
export 'src/widgets/toolbar/base_toolbar.dart'; export 'src/widgets/toolbar/base_toolbar.dart';
export 'src/widgets/toolbar/enum.dart';
export 'src/widgets/toolbar/toolbar.dart'; export 'src/widgets/toolbar/toolbar.dart';
export 'src/widgets/utils/provider.dart'; export 'src/widgets/utils/provider.dart';

@ -59,5 +59,5 @@ class QuillBaseToolbarConfigurations extends Equatable {
final Decoration? decoration; final Decoration? decoration;
@override @override
List<Object?> get props => throw UnimplementedError(); List<Object?> get props => [];
} }

@ -2,6 +2,7 @@ import 'package:flutter/widgets.dart' show BuildContext;
import '../../../flutter_quill.dart'; import '../../../flutter_quill.dart';
/// Public shared extension
extension BuildContextExt on BuildContext { extension BuildContextExt on BuildContext {
/// return [QuillProvider] as not null /// return [QuillProvider] as not null
/// throw exception if it's not in the widget tree /// throw exception if it's not in the widget tree

@ -15,7 +15,6 @@ import 'package:i18n_extension/i18n_widget.dart';
import '../../../flutter_quill.dart'; import '../../../flutter_quill.dart';
import '../../models/documents/nodes/container.dart' as container_node; import '../../models/documents/nodes/container.dart' as container_node;
import '../../utils/extensions/build_context.dart';
import '../../utils/platform.dart'; import '../../utils/platform.dart';
import '../box.dart'; import '../box.dart';
import '../cursor.dart'; import '../cursor.dart';
@ -154,26 +153,20 @@ class QuillEditor extends StatefulWidget {
/// The configurations for the quill editor widget of flutter quill /// The configurations for the quill editor widget of flutter quill
QuillEditorConfigurations configurations = QuillEditorConfigurations configurations =
const QuillEditorConfigurations(), const QuillEditorConfigurations(),
TextSelectionThemeData? textSelectionThemeData,
Brightness? keyboardAppearance,
Iterable<EmbedBuilder>? embedBuilders,
EdgeInsetsGeometry padding = EdgeInsets.zero,
bool autoFocus = true,
bool expands = false,
FocusNode? focusNode, FocusNode? focusNode,
GlobalKey<EditorState>? editorKey, ScrollController? scrollController,
}) { }) {
return QuillEditor( return QuillEditor(
scrollController: ScrollController(), scrollController: scrollController ?? ScrollController(),
focusNode: focusNode ?? FocusNode(), focusNode: focusNode ?? FocusNode(),
configurations: configurations.copyWith( configurations: configurations.copyWith(
textSelectionThemeData: textSelectionThemeData, textSelectionThemeData: configurations.textSelectionThemeData,
autoFocus: autoFocus, autoFocus: configurations.autoFocus,
expands: expands, expands: configurations.expands,
padding: padding, padding: configurations.padding,
keyboardAppearance: keyboardAppearance ?? Brightness.light, keyboardAppearance: configurations.keyboardAppearance,
embedBuilders: embedBuilders, embedBuilders: configurations.embedBuilders,
editorKey: editorKey, editorKey: configurations.editorKey,
), ),
); );
} }

@ -1,7 +1,8 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:i18n_extension/i18n_widget.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 '../../models/config/toolbar/base_configurations.dart';
import '../../utils/extensions/build_context.dart'; import '../../utils/extensions/build_context.dart';
import 'buttons/arrow_indicated_list.dart'; import 'buttons/arrow_indicated_list.dart';
@ -50,34 +51,39 @@ class QuillBaseToolbar extends StatelessWidget implements PreferredSizeWidget {
final toolbarSize = configurations.toolbarSize; final toolbarSize = configurations.toolbarSize;
return I18n( return I18n(
initialLocale: context.quillSharedConfigurations?.locale, initialLocale: context.quillSharedConfigurations?.locale,
child: Builder( child: QuillBaseToolbarProvider(
builder: (context) { toolbarConfigurations: configurations,
if (configurations.multiRowsDisplay) { child: Builder(
return Wrap( builder: (context) {
direction: configurations.axis, if (configurations.multiRowsDisplay) {
alignment: configurations.toolbarIconAlignment, return Wrap(
crossAxisAlignment: configurations.toolbarIconCrossAlignment, direction: configurations.axis,
runSpacing: 4, alignment: configurations.toolbarIconAlignment,
spacing: configurations.toolbarSectionSpacing, crossAxisAlignment: configurations.toolbarIconCrossAlignment,
children: configurations.childrenBuilder(context), 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),
),
);
},
), ),
); );
} }

@ -66,10 +66,7 @@ class QuillToolbarClearFormatButton extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final iconTheme = _iconTheme(context); final iconTheme = _iconTheme(context);
final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color;
final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor;
final tooltip = _tooltip(context); final tooltip = _tooltip(context);
final iconSize = _iconSize(context); final iconSize = _iconSize(context);
final iconData = _iconData(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( return QuillToolbarIconButton(
tooltip: tooltip, tooltip: tooltip,
highlightElevation: 0, highlightElevation: 0,

@ -157,6 +157,8 @@ class _QuillToolbarColorButtonState extends State<QuillToolbarColorButton> {
final childBuilder = final childBuilder =
options.childBuilder ?? baseButtonExtraOptions.childBuilder; options.childBuilder ?? baseButtonExtraOptions.childBuilder;
if (childBuilder != null) { if (childBuilder != null) {
// if the caller using Cupertino app he might need to wrap the builder
// with Material() widget
return childBuilder( return childBuilder(
options, options,
QuillToolbarColorButtonExtraOptions( QuillToolbarColorButtonExtraOptions(
@ -166,7 +168,7 @@ class _QuillToolbarColorButtonState extends State<QuillToolbarColorButton> {
_showColorPicker(); _showColorPicker();
afterButtonPressed?.call(); afterButtonPressed?.call();
}, },
iconColor: iconColor, iconColor: null,
iconColorBackground: iconColorBackground, iconColorBackground: iconColorBackground,
fillColor: fillColor, fillColor: fillColor,
fillColorBackground: fillColorBackground, fillColorBackground: fillColorBackground,

@ -12,8 +12,8 @@ class CustomButton extends StatelessWidget {
this.iconTheme, this.iconTheme,
this.afterButtonPressed, this.afterButtonPressed,
this.tooltip, this.tooltip,
Key? key, super.key,
}) : super(key: key); });
final VoidCallback? onPressed; final VoidCallback? onPressed;
final IconData? icon; final IconData? icon;

@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
import '../../../../extensions.dart'; import '../../../../extensions.dart';
import '../../../../flutter_quill.dart'; import '../../../../flutter_quill.dart';
import '../../../translations/toolbar.i18n.dart'; import '../../../translations/toolbar.i18n.dart';
import '../../../utils/extensions/build_context.dart';
import '../../../utils/font.dart'; import '../../../utils/font.dart';
class QuillToolbarFontSizeButton extends StatefulWidget { class QuillToolbarFontSizeButton extends StatefulWidget {

@ -49,8 +49,6 @@ class _QuillToolbarHistoryButtonState extends State<QuillToolbarHistoryButton> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
theme = Theme.of(context);
final baseButtonConfigurations = final baseButtonConfigurations =
context.requireQuillToolbarBaseButtonOptions; context.requireQuillToolbarBaseButtonOptions;
final tooltip = options.tooltip ?? final tooltip = options.tooltip ??
@ -65,8 +63,6 @@ class _QuillToolbarHistoryButtonState extends State<QuillToolbarHistoryButton> {
context.requireQuillToolbarBaseButtonOptions.globalIconSize; context.requireQuillToolbarBaseButtonOptions.globalIconSize;
final iconTheme = options.iconTheme ?? baseButtonConfigurations.iconTheme; final iconTheme = options.iconTheme ?? baseButtonConfigurations.iconTheme;
final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor;
final afterButtonPressed = options.afterButtonPressed ?? final afterButtonPressed = options.afterButtonPressed ??
baseButtonConfigurations.afterButtonPressed; baseButtonConfigurations.afterButtonPressed;
@ -92,6 +88,10 @@ class _QuillToolbarHistoryButtonState extends State<QuillToolbarHistoryButton> {
), ),
); );
} }
theme = Theme.of(context);
final fillColor = iconTheme?.iconUnselectedFillColor ?? theme.canvasColor;
return QuillToolbarIconButton( return QuillToolbarIconButton(
tooltip: tooltip, tooltip: tooltip,
highlightElevation: 0, highlightElevation: 0,

@ -70,8 +70,34 @@ class _QuillToolbarIndentButtonState extends State<QuillToolbarIndentButton> {
(widget.isIncrease ? 'Increase indent'.i18n : 'Decrease indent'.i18n); (widget.isIncrease ? 'Increase indent'.i18n : 'Decrease indent'.i18n);
} }
void _sharedOnPressed() {
widget.controller.indentSelection(widget.isIncrease);
}
@override @override
Widget build(BuildContext context) { 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 theme = Theme.of(context);
final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color; final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color;
@ -85,9 +111,7 @@ class _QuillToolbarIndentButtonState extends State<QuillToolbarIndentButton> {
icon: Icon(iconData, size: iconSize, color: iconColor), icon: Icon(iconData, size: iconSize, color: iconColor),
fillColor: iconFillColor, fillColor: iconFillColor,
borderRadius: iconTheme?.borderRadius ?? 2, borderRadius: iconTheme?.borderRadius ?? 2,
onPressed: () { onPressed: _sharedOnPressed,
widget.controller.indentSelection(widget.isIncrease);
},
afterPressed: afterButtonPressed, afterPressed: afterButtonPressed,
); );
} }

@ -19,15 +19,6 @@ class QuillToolbarLinkStyleButton extends StatefulWidget {
}); });
final QuillController controller; 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; final QuillToolbarLinkStyleButtonOptions options;
@override @override
@ -110,7 +101,6 @@ class _QuillToolbarLinkStyleButtonState
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final isToggled = _getLinkAttributeValue() != null; final isToggled = _getLinkAttributeValue() != null;
final pressedHandler = () => _openLinkDialog(context); final pressedHandler = () => _openLinkDialog(context);
@ -140,6 +130,7 @@ class _QuillToolbarLinkStyleButtonState
), ),
); );
} }
final theme = Theme.of(context);
return QuillToolbarIconButton( return QuillToolbarIconButton(
tooltip: tooltip, tooltip: tooltip,
highlightElevation: 0, highlightElevation: 0,

@ -64,18 +64,12 @@ class QuillToolbarSearchButton extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final iconTheme = _iconTheme(context); final iconTheme = _iconTheme(context);
final tooltip = _tooltip(context); final tooltip = _tooltip(context);
final iconData = _iconData(context); final iconData = _iconData(context);
final iconSize = _iconSize(context); final iconSize = _iconSize(context);
final afterButtonPressed = _afterButtonPressed(context); final afterButtonPressed = _afterButtonPressed(context);
final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color;
final iconFillColor = iconTheme?.iconUnselectedFillColor ??
(options.fillColor ?? theme.canvasColor);
final childBuilder = final childBuilder =
options.childBuilder ?? baseButtonExtraOptions(context).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( return QuillToolbarIconButton(
tooltip: tooltip, tooltip: tooltip,
icon: Icon( icon: Icon(

@ -183,8 +183,6 @@ class _QuillToolbarSelectAlignmentButtonState
// Attribute.justifyAlignment: ToolbarButtons.justifyAlignment, // Attribute.justifyAlignment: ToolbarButtons.justifyAlignment,
// }; // };
final theme = Theme.of(context);
final buttonCount = ((widget.showLeftAlignment!) ? 1 : 0) + final buttonCount = ((widget.showLeftAlignment!) ? 1 : 0) +
((widget.showCenterAlignment!) ? 1 : 0) + ((widget.showCenterAlignment!) ? 1 : 0) +
((widget.showRightAlignment!) ? 1 : 0) + ((widget.showRightAlignment!) ? 1 : 0) +
@ -200,6 +198,8 @@ class _QuillToolbarSelectAlignmentButtonState
); );
} }
final theme = Theme.of(context);
return Row( return Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: List.generate(buttonCount, (index) { children: List.generate(buttonCount, (index) {

@ -99,7 +99,6 @@ class _QuillToolbarSelectHeaderStyleButtonsState
'All attributes must be one of them: header, h1, h2 or h3', 'All attributes must be one of them: header, h1, h2 or h3',
); );
final theme = Theme.of(context);
final style = TextStyle( final style = TextStyle(
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: iconSize * 0.7, fontSize: iconSize * 0.7,
@ -114,6 +113,7 @@ class _QuillToolbarSelectHeaderStyleButtonsState
' is not supported. Yet but we will work on that soon.', ' is not supported. Yet but we will work on that soon.',
); );
} }
final theme = Theme.of(context);
final children = options.attributes.map((attribute) { final children = options.attributes.map((attribute) {
final isSelected = _selectedAttribute == attribute; final isSelected = _selectedAttribute == attribute;

@ -26,37 +26,13 @@ class QuillToolbarToggleStyleButton extends StatefulWidget {
required this.options, required this.options,
required this.controller, required this.controller,
required this.attribute, 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, super.key,
}); });
final Attribute attribute; 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; 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; final QuillController controller;
@override @override

@ -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,
}

@ -1,8 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../../../flutter_quill.dart'; import '../../../flutter_quill.dart';
import '../../models/config/toolbar/base_configurations.dart';
import '../../utils/extensions/build_context.dart';
class QuillToolbar extends StatelessWidget { class QuillToolbar extends StatelessWidget {
const QuillToolbar({ const QuillToolbar({

@ -3,6 +3,7 @@ import 'package:flutter/widgets.dart'
show BuildContext, InheritedWidget, Widget; show BuildContext, InheritedWidget, Widget;
import '../../models/config/quill_configurations.dart'; import '../../models/config/quill_configurations.dart';
import '../../models/config/toolbar/base_configurations.dart';
class QuillProvider extends InheritedWidget { class QuillProvider extends InheritedWidget {
const QuillProvider({ 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<QuillBaseToolbarProvider>();
}
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 { class QuillEditorProvider extends InheritedWidget {
const QuillEditorProvider({ const QuillEditorProvider({
required super.child, required super.child,

@ -1,6 +1,6 @@
name: flutter_quill 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. 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 homepage: https://1o24bbs.com/c/bulletjournal/108
repository: https://github.com/singerdmx/flutter-quill repository: https://github.com/singerdmx/flutter-quill
topics: topics:

Loading…
Cancel
Save