Skip to content

Commit

Permalink
3+++++
Browse files Browse the repository at this point in the history
  • Loading branch information
Ellet committed Dec 6, 2023
1 parent 5afa35e commit 25435c9
Show file tree
Hide file tree
Showing 41 changed files with 339 additions and 375 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

All notable changes to this project will be documented in this file.

## 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`

## 9.0.0-dev-3
* Breaking Changes:
* Rename `QuillToolbar` to `QuillSimpleToolbar`
Expand Down
15 changes: 14 additions & 1 deletion example/lib/presentation/quill/quill_screen.dart
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import 'dart:convert' show jsonEncode;
import 'package:flutter/material.dart';
import 'package:flutter_quill/flutter_quill.dart';
import 'package:flutter_quill_extensions/flutter_quill_extensions.dart'
show FlutterQuillEmbeds;
show FlutterQuillEmbeds, QuillSharedExtensionsConfigurations;

import 'package:quill_html_converter/quill_html_converter.dart';
import 'package:share_plus/share_plus.dart' show Share;
Expand Down Expand Up @@ -106,12 +106,14 @@ class _QuillScreenState extends State<QuillScreen> {
MyQuillToolbar(
controller: _controller,
focusNode: _editorFocusNode,
sharedConfigurations: _sharedConfigurations,
),
Builder(
builder: (context) {
return Expanded(
child: MyQuillEditor(
configurations: QuillEditorConfigurations(
sharedConfigurations: _sharedConfigurations,
controller: _controller,
readOnly: _isReadOnly,
),
Expand All @@ -129,4 +131,15 @@ class _QuillScreenState extends State<QuillScreen> {
),
);
}

QuillSharedConfigurations get _sharedConfigurations {
return const QuillSharedConfigurations(
extraConfigurations: {
QuillSharedExtensionsConfigurations.key:
QuillSharedExtensionsConfigurations(
assetsPrefix: 'your-assets-folder-name', // Defaults to assets
),
},
);
}
}
128 changes: 51 additions & 77 deletions example/lib/presentation/quill/quill_toolbar.dart
Original file line number Diff line number Diff line change
Expand Up @@ -17,11 +17,14 @@ 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<void> onImageInsertWithCropping(
String image,
Expand Down Expand Up @@ -101,132 +104,103 @@ class MyQuillToolbar extends StatelessWidget {
// https://github.com/singerdmx/flutter-quill/blob/master/doc/custom_toolbar.md
return QuillToolbar(
configurations: QuillToolbarConfigurations(
toolbarSize: 15 * 2,
toolbarSize: 20 * 2,
multiRowsDisplay: false,
buttonOptions: const QuillToolbarButtonOptions(
base: QuillToolbarBaseButtonOptions(
globalIconSize: 20,
globalIconButtonFactor: 1.4,
),
),
childrenBuilder: (context) {
return [
IconButton(
onPressed: () {
context.read<SettingsCubit>().updateSettings(
state.copyWith(useCustomQuillToolbar: false));
},
onPressed: () => context
.read<SettingsCubit>()
.updateSettings(
state.copyWith(useCustomQuillToolbar: false)),
icon: const Icon(
Icons.width_normal,
size: 16,
),
),
QuillToolbarImageButton(
controller: controller,
options: const QuillToolbarImageButtonOptions(),
),
QuillToolbarHistoryButton(
isUndo: true,
controller: controller,
options:
const QuillToolbarHistoryButtonOptions(isUndo: true),
),
QuillToolbarHistoryButton(
isUndo: false,
controller: controller,
options:
const QuillToolbarHistoryButtonOptions(isUndo: false),
),
QuillToolbarToggleStyleButton(
attribute: Attribute.bold,
options: const QuillToolbarToggleStyleButtonOptions(),
controller: controller,
options: QuillToolbarToggleStyleButtonOptions(
childBuilder: (options, extraOptions) {
if (extraOptions.isToggled) {
return IconButton.filled(
onPressed: extraOptions.onPressed,
icon: Icon(options.iconData),
);
}
return IconButton(
onPressed: extraOptions.onPressed,
icon: Icon(options.iconData),
);
},
),
attribute: Attribute.bold,
),
QuillToolbarToggleStyleButton(
attribute: Attribute.italic,
options: const QuillToolbarToggleStyleButtonOptions(),
controller: controller,
options: const QuillToolbarToggleStyleButtonOptions(
iconData: Icons.format_italic,
),
attribute: Attribute.italic,
),
QuillToolbarToggleStyleButton(
attribute: Attribute.underline,
controller: controller,
options: const QuillToolbarToggleStyleButtonOptions(
iconData: Icons.format_underline,
iconSize: 20,
),
attribute: Attribute.underline,
),
QuillToolbarClearFormatButton(
controller: controller,
options: const QuillToolbarClearFormatButtonOptions(
iconData: Icons.format_clear,
),
),
VerticalDivider(
indent: 12,
endIndent: 12,
color: Colors.grey.shade400,
const VerticalDivider(),
QuillToolbarImageButton(
controller: controller,
),
QuillToolbarSelectHeaderStyleButtons(
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,
options: const QuillToolbarSelectHeaderStyleButtonsOptions(
iconSize: 20,
),
),
QuillToolbarToggleStyleButton(
attribute: Attribute.ol,
controller: controller,
options: const QuillToolbarToggleStyleButtonOptions(
iconData: Icons.format_list_numbered,
iconSize: 39,
),
attribute: Attribute.list,
),
QuillToolbarToggleStyleButton(
attribute: Attribute.ul,
controller: controller,
options: const QuillToolbarToggleStyleButtonOptions(
iconData: Icons.format_list_bulleted,
),
attribute: Attribute.ul,
),
QuillToolbarToggleStyleButton(
attribute: Attribute.blockQuote,
controller: controller,
options: const QuillToolbarToggleStyleButtonOptions(
iconData: Icons.format_quote,
iconSize: 15,
),
attribute: Attribute.inlineCode,
),
VerticalDivider(
indent: 12,
endIndent: 12,
color: Colors.grey.shade400,
QuillToolbarToggleStyleButton(
controller: controller,
attribute: Attribute.blockQuote,
),
QuillToolbarIndentButton(
controller: controller,
isIncrease: true,
options: const QuillToolbarIndentButtonOptions(
iconData: Icons.format_indent_increase,
iconSize: 20,
)),
controller: controller,
isIncrease: true,
),
QuillToolbarIndentButton(
controller: controller,
isIncrease: false,
options: const QuillToolbarIndentButtonOptions(
iconData: Icons.format_indent_decrease,
iconSize: 20,
),
),
const VerticalDivider(),
QuillToolbarLinkStyleButton(controller: controller),
];
},
),
Expand Down
35 changes: 35 additions & 0 deletions example/lib/presentation/simple/simple_screen.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import 'package:flutter/material.dart';
import 'package:flutter_quill/flutter_quill.dart';

class SimpleScreen extends StatefulWidget {
const SimpleScreen({super.key});

@override
State<SimpleScreen> createState() => _SimpleScreenState();
}

class _SimpleScreenState extends State<SimpleScreen> {
final _controller = QuillController.basic();

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Column(
children: [
QuillToolbar.simple(
QuillSimpleToolbarConfigurations(controller: _controller),
),
Expanded(
child: QuillEditor.basic(
configurations: QuillEditorConfigurations(
controller: _controller,
padding: const EdgeInsets.all(16),
),
),
),
],
),
);
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import '../../../models/config/toolbar/buttons/formula.dart';
class QuillToolbarFormulaButton extends StatelessWidget {
const QuillToolbarFormulaButton({
required this.controller,
required this.options,
this.options = const QuillToolbarFormulaButtonOptions(),
super.key,
});

Expand Down Expand Up @@ -91,7 +91,7 @@ class QuillToolbarFormulaButton extends StatelessWidget {
}

return QuillToolbarIconButton(
icon: Icon(iconData, size: iconSize * 1.77, color: iconColor),
icon: Icon(iconData, size: iconSize * iconButtonFactor, color: iconColor),
tooltip: tooltip,
onPressed: () => _sharedOnPressed(context),
isFilled: false,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import 'select_image_source.dart';
class QuillToolbarImageButton extends StatelessWidget {
const QuillToolbarImageButton({
required this.controller,
required this.options,
this.options = const QuillToolbarImageButtonOptions(),
super.key,
});

Expand Down Expand Up @@ -105,7 +105,7 @@ class QuillToolbarImageButton extends StatelessWidget {
return QuillToolbarIconButton(
icon: Icon(
iconData,
size: iconSize * 1.77,
size: iconButtonFactor * iconSize,
color: iconColor,
),
tooltip: tooltip,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import 'package:flutter_quill/flutter_quill.dart'
show
QuillController,
QuillIconTheme,
QuillProviderExt,
QuillSimpleToolbarExt,
QuillToolbarBaseButtonOptions,
QuillToolbarIconButton;
import 'package:flutter_quill/translations.dart';
Expand All @@ -17,7 +17,7 @@ import 'select_camera_action.dart';
class QuillToolbarCameraButton extends StatelessWidget {
const QuillToolbarCameraButton({
required this.controller,
required this.options,
this.options = const QuillToolbarCameraButtonOptions(),
super.key,
});

Expand All @@ -30,6 +30,13 @@ class QuillToolbarCameraButton extends StatelessWidget {
return iconSize ?? baseFontSize;
}

double _iconButtonFactor(BuildContext context) {
final baseIconFactor =
baseButtonExtraOptions(context).globalIconButtonFactor;
final iconButtonFactor = options.iconButtonFactor;
return iconButtonFactor ?? baseIconFactor;
}

VoidCallback? _afterButtonPressed(BuildContext context) {
return options.afterButtonPressed ??
baseButtonExtraOptions(context).afterButtonPressed;
Expand Down Expand Up @@ -69,6 +76,7 @@ class QuillToolbarCameraButton extends StatelessWidget {
final tooltip = _tooltip(context);
final iconSize = _iconSize(context);
final iconData = _iconData(context);
final iconButtonFactor = _iconButtonFactor(context);

final childBuilder =
options.childBuilder ?? baseButtonExtraOptions(context).childBuilder;
Expand All @@ -80,7 +88,7 @@ class QuillToolbarCameraButton extends StatelessWidget {
iconData: options.iconData,
fillColor: options.fillColor,
iconSize: options.iconSize,
iconButtonFactor: options.iconButtonFactor,
iconButtonFactor: iconButtonFactor,
iconTheme: options.iconTheme,
tooltip: options.tooltip,
cameraConfigurations: options.cameraConfigurations,
Expand All @@ -98,7 +106,7 @@ class QuillToolbarCameraButton extends StatelessWidget {
final iconColor = iconTheme?.iconUnselectedColor ?? theme.iconTheme.color;

return QuillToolbarIconButton(
icon: Icon(iconData, size: iconSize * 1.77, color: iconColor),
icon: Icon(iconData, size: iconButtonFactor * iconSize, color: iconColor),
tooltip: tooltip,
isFilled: false,
// isDesktop(supportWeb: false) ? null :
Expand All @@ -114,7 +122,8 @@ class QuillToolbarCameraButton extends StatelessWidget {
}
final cameraAction = await showDialog<CameraAction>(
context: context,
builder: (ctx) => const SelectCameraActionDialog(),
builder: (ctx) => const FlutterQuillLocalizationsWidget(
child: SelectCameraActionDialog()),
);

return cameraAction;
Expand Down
Loading

0 comments on commit 25435c9

Please sign in to comment.