diff --git a/README.md b/README.md index c2f38695..f68ebf86 100644 --- a/README.md +++ b/README.md @@ -86,32 +86,24 @@ The `QuillToolbar` class lets you customise which formatting options are availab [Sample Page] provides sample code for advanced usage and configuration. ### Font Size -Within the editor toolbar, a drop-down with font-sizing capabilties is available. This can be enabled or disabled with `showFontSize`. +Within the editor toolbar, a drop-down with font-sizing capabilities is available. This can be enabled or disabled with `showFontSize`. -When enabled, the default font-size values can be modified via _optional_ `fontSizeValues`. `fontSizeValues` accepts a `Map` consisting of a `String` title for the font size and an `String` value for the font size. Example: +When enabled, the default font-size values can be modified via _optional_ `fontSizeValues`. `fontSizeValues` accepts a `Map` consisting of a `String` title for the font size and a `String` value for the font size. Example: ``` -fontSizeValues: const {'Small': '8', 'Medium': '24', 'Large': '46'} +fontSizeValues: const {'Small': '8', 'Medium': '24.5', 'Large': '46'} ``` -If a font size of `0` is used, then font sizing is removed from the given block of text. -``` -fontSizeValues: const {'Default': '0', 'Small': '8', 'Medium': '24', 'Large': '46'} -``` - -The initial value for font-size in the editor can also be defined via _optional_ `initialFontSizeValue` which corresponds to the index value within your map. For example, if you would like the Medium font size to be the default start size in the above example, you would set `initialFontSizeValue: 2`. - -This initial font size is not applied to the delta when first building the widget, it is only used to change the initial value for the drop-down widget. ### Custom Icons You may add custom icons to the _end_ of the toolbar, via the `customIcons` option, which is a `List` of `QuillCustomIcon`. To add an Icon, we should use a new QuillCustomIcon class ``` - QuillCustomIcon( - icon:Icons.ac_unit, - onTap: (){ - debugPrint('snowflake'); - } - ), + QuillCustomIcon( + icon:Icons.ac_unit, + onTap: (){ + debugPrint('snowflake'); + } + ), ``` Each `QuillCustomIcon` is used as part of the `customIcons` option as follows: @@ -119,26 +111,26 @@ Each `QuillCustomIcon` is used as part of the `customIcons` option as follows: QuillToolbar.basic( (...), customIcons: [ - QuillCustomIcon( - icon:Icons.ac_unit, - onTap: (){ - debugPrint('snowflake1'); - } - ), - - QuillCustomIcon( - icon:Icons.ac_unit, - onTap: (){ - debugPrint('snowflake2'); - } - ), - - QuillCustomIcon( - icon:Icons.ac_unit, - onTap: (){ - debugPrint('snowflake3'); - } - ), + QuillCustomIcon( + icon:Icons.ac_unit, + onTap: (){ + debugPrint('snowflake1'); + } + ), + + QuillCustomIcon( + icon:Icons.ac_unit, + onTap: (){ + debugPrint('snowflake2'); + } + ), + + QuillCustomIcon( + icon:Icons.ac_unit, + onTap: (){ + debugPrint('snowflake3'); + } + ), ] ``` diff --git a/lib/src/widgets/toolbar.dart b/lib/src/widgets/toolbar.dart index 0fd561f9..b36b78a6 100644 --- a/lib/src/widgets/toolbar.dart +++ b/lib/src/widgets/toolbar.dart @@ -117,7 +117,6 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget { ///Map of font sizes in string Map? fontSizeValues, - int? initialFontSizeValue, ///The theme to use for the icons in the toolbar, uses type [QuillIconTheme] QuillIconTheme? iconTheme, @@ -205,10 +204,6 @@ class QuillToolbar extends StatelessWidget implements PreferredSizeWidget { } }, rawItemsMap: fontSizes, - initialValue: (initialFontSizeValue != null) && - (initialFontSizeValue <= fontSizes.length - 1) - ? initialFontSizeValue - : 0, ), if (showBoldButton) ToggleStyleButton( diff --git a/lib/src/widgets/toolbar/quill_dropdown_button.dart b/lib/src/widgets/toolbar/quill_dropdown_button.dart index 3c480396..aac50593 100644 --- a/lib/src/widgets/toolbar/quill_dropdown_button.dart +++ b/lib/src/widgets/toolbar/quill_dropdown_button.dart @@ -3,11 +3,11 @@ import 'package:flutter/material.dart'; import '../../models/documents/attribute.dart'; import '../../models/documents/style.dart'; import '../../models/themes/quill_icon_theme.dart'; +import '../../utils/font.dart'; import '../controller.dart'; class QuillDropdownButton extends StatefulWidget { const QuillDropdownButton({ - required this.initialValue, required this.items, required this.rawItemsMap, required this.attribute, @@ -25,7 +25,6 @@ class QuillDropdownButton extends StatefulWidget { final Color? fillColor; final double hoverElevation; final double highlightElevation; - final T initialValue; final List> items; final Map rawItemsMap; final ValueChanged onSelected; @@ -39,15 +38,14 @@ class QuillDropdownButton extends StatefulWidget { // ignore: deprecated_member_use_from_same_package class _QuillDropdownButtonState extends State> { - String _currentValue = ''; + static const defaultDisplayText = 'Size'; + String _currentValue = defaultDisplayText; Style get _selectionStyle => widget.controller.getSelectionStyle(); @override void initState() { super.initState(); widget.controller.addListener(_didChangeEditingValue); - _currentValue = - widget.rawItemsMap.keys.elementAt(widget.initialValue as int); } @override @@ -62,7 +60,6 @@ class _QuillDropdownButtonState extends State> { if (oldWidget.controller != widget.controller) { oldWidget.controller.removeListener(_didChangeEditingValue); widget.controller.addListener(_didChangeEditingValue); - //_isToggled = _getIsToggled(_selectionStyle.attributes); } } @@ -71,23 +68,20 @@ class _QuillDropdownButtonState extends State> { } String _getKeyName(Map attrs) { - if (widget.attribute.key == Attribute.size.key) { - final attribute = attrs[widget.attribute.key]; + if (widget.attribute.key != Attribute.size.key) { + return defaultDisplayText; + } + final attribute = attrs[widget.attribute.key]; - if (attribute == null) { - return widget.rawItemsMap.keys - .elementAt(widget.initialValue as int) - .toString(); - } else { - return widget.rawItemsMap.entries - .firstWhere((element) => element.value == attribute.value, - orElse: () => widget.rawItemsMap.entries.first) - .key; - } + if (attribute == null) { + return defaultDisplayText; } - return widget.rawItemsMap.keys - .elementAt(widget.initialValue as int) - .toString(); + return widget.rawItemsMap.entries + .firstWhere( + (element) => + getFontSize(element.value) == getFontSize(attribute.value), + orElse: () => widget.rawItemsMap.entries.first) + .key; } @override @@ -125,19 +119,13 @@ class _QuillDropdownButtonState extends State> { showMenu( context: context, elevation: 4, - // widget.elevation ?? popupMenuTheme.elevation, - initialValue: - widget.rawItemsMap.values.elementAt(widget.initialValue as int) as T, items: widget.items, position: position, shape: popupMenuTheme.shape, - // widget.shape ?? popupMenuTheme.shape, - color: popupMenuTheme.color, // widget.color ?? popupMenuTheme.color, - // captureInheritedThemes: widget.captureInheritedThemes, + color: popupMenuTheme.color, ).then((newValue) { if (!mounted) return null; if (newValue == null) { - // if (widget.onCanceled != null) widget.onCanceled(); return null; } setState(() {