From 1aab0c7d816930060a3e85584e4f56820bdfb4f7 Mon Sep 17 00:00:00 2001 From: Ellet Date: Thu, 7 Dec 2023 21:20:42 +0300 Subject: [PATCH] Update doc and README.md --- README.md | 32 +++--- doc/custom_embed_blocks.md | 8 +- doc/custom_toolbar.md | 224 ++++++++++++++++--------------------- doc/translation.md | 24 ++-- 4 files changed, 127 insertions(+), 161 deletions(-) diff --git a/README.md b/README.md index 750f7a74f..71dea7328 100644 --- a/README.md +++ b/README.md @@ -96,10 +96,9 @@ dependencies: @@ -126,24 +125,23 @@ connect the `QuillController` to them using `QuillProvider` inherited widget ```dart -QuillProvider( - configurations: QuillConfigurations( +QuillToolbar.simple( + configurations: QuillSimpleToolbarConfigurations( controller: _controller, sharedConfigurations: const QuillSharedConfigurations( locale: Locale('de'), ), ), - child: Column( - children: [ - const QuillToolbar(), - Expanded( - child: QuillEditor.basic( - configurations: const QuillEditorConfigurations( - readOnly: false, - ), - ), - ) - ], +), +Expanded( + child: QuillEditor.basic( + configurations: QuillEditorConfigurations( + controller: _controller, + readOnly: false, + sharedConfigurations: const QuillSharedConfigurations( + locale: Locale('de'), + ), + ), ), ) ``` diff --git a/doc/custom_embed_blocks.md b/doc/custom_embed_blocks.md index 2b6093b9e..a4f3b7001 100644 --- a/doc/custom_embed_blocks.md +++ b/doc/custom_embed_blocks.md @@ -88,14 +88,10 @@ Future _addEditNote(BuildContext context, {Document? document}) async { ) ], ), - content: QuillProvider( - configurations: QuillConfigurations( - controller: quillEditorController, - ), - child: QuillEditor.basic( + content: QuillEditor.basic( configurations: const QuillEditorConfigurations( + controller: quillEditorController, readOnly: false, - ), ), ), ), diff --git a/doc/custom_toolbar.md b/doc/custom_toolbar.md index 39040ca8d..fc661b6d5 100644 --- a/doc/custom_toolbar.md +++ b/doc/custom_toolbar.md @@ -6,134 +6,108 @@ You can use the `QuillBaseToolbar` which is the base for the `QuillToolbar` Example: ```dart -QuillProvider( - configurations: QuillConfigurations( - controller: _controller, - sharedConfigurations: const QuillSharedConfigurations(), - ), - child: Column( - children: [ - QuillBaseToolbar( - configurations: QuillBaseToolbarConfigurations( - toolbarSize: 15 * 2, - multiRowsDisplay: false, - childrenBuilder: (context) { - final controller = context.requireQuillController; - return [ - QuillToolbarImageButton( - controller: controller, - options: const QuillToolbarImageButtonOptions(), - ), - 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, - ), - ), - ]; - }, - ), +QuillToolbar( + configurations: const QuillToolbarConfigurations( + buttonOptions: QuillToolbarButtonOptions( + base: QuillToolbarBaseButtonOptions( + globalIconSize: 20, + globalIconButtonFactor: 1.4, ), - Expanded( - child: QuillEditor.basic( - configurations: const QuillEditorConfigurations( - readOnly: false, - placeholder: 'Write your notes', - padding: EdgeInsets.all(16), + ), + ), + child: SingleChildScrollView( + scrollDirection: Axis.horizontal, + child: Row( + children: [ + IconButton( + onPressed: () => context + .read() + .updateSettings( + state.copyWith(useCustomQuillToolbar: false)), + icon: const Icon( + Icons.width_normal, ), ), - ) - ], + QuillToolbarHistoryButton( + isUndo: true, + controller: controller, + ), + QuillToolbarHistoryButton( + isUndo: false, + controller: controller, + ), + QuillToolbarToggleStyleButton( + options: const QuillToolbarToggleStyleButtonOptions(), + controller: controller, + attribute: Attribute.bold, + ), + QuillToolbarToggleStyleButton( + options: const QuillToolbarToggleStyleButtonOptions(), + controller: controller, + attribute: Attribute.italic, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.underline, + ), + QuillToolbarClearFormatButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarImageButton( + controller: controller, + ), + QuillToolbarCameraButton( + controller: controller, + ), + QuillToolbarVideoButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarColorButton( + controller: controller, + isBackground: false, + ), + QuillToolbarColorButton( + controller: controller, + isBackground: true, + ), + const VerticalDivider(), + QuillToolbarSelectHeaderStyleButton( + controller: controller, + ), + const VerticalDivider(), + QuillToolbarToggleCheckListButton( + controller: controller, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.ol, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.ul, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.inlineCode, + ), + QuillToolbarToggleStyleButton( + controller: controller, + attribute: Attribute.blockQuote, + ), + QuillToolbarIndentButton( + controller: controller, + isIncrease: true, + ), + QuillToolbarIndentButton( + controller: controller, + isIncrease: false, + ), + const VerticalDivider(), + QuillToolbarLinkStyleButton(controller: controller), + ], + ), ), ) ``` diff --git a/doc/translation.md b/doc/translation.md index 5d801ba80..f98e64baa 100644 --- a/doc/translation.md +++ b/doc/translation.md @@ -3,24 +3,22 @@ The package offers translations for the quill toolbar and editor, it will follow the locale that is defined in your `WidgetsApp` for example `MaterialApp` which usually follows the system locally unless you set your own locale with: ```dart - QuillProvider( - configurations: QuillConfigurations( +QuillToolbar.simple( + configurations: QuillSimpleToolbarConfigurations( controller: _controller, sharedConfigurations: const QuillSharedConfigurations( - locale: Locale('fr'), // will take affect only if FlutterQuillLocalizations.delegate is not defined in the Widget app + locale: Locale('de'), ), ), - child: Column( - children: [ - const QuillToolbar( - configurations: QuillToolbarConfigurations(), +), +Expanded( + child: QuillEditor.basic( + configurations: QuillEditorConfigurations( + controller: _controller, + sharedConfigurations: const QuillSharedConfigurations( + locale: Locale('de'), ), - Expanded( - child: QuillEditor.basic( - configurations: const QuillEditorConfigurations(), - ), - ) - ], + ), ), ) ```