Scale leading widgets based on paragraph font size (#1226)

CHANGELOG.md

@@ -1,3 +1,6 @@
+# [7.2.0]
+- Checkboxes, bullet points, and number points are now scaled based on the default paragraph font size.
+
 # [7.1.20]
 - Pass linestyle to embedded block.
 

example/windows/runner/Runner.rc

@@ -60,14 +60,14 @@ IDI_APP_ICON            ICON                    "resources\\app_icon.ico"
 // Version
 //
 
-#ifdef FLUTTER_BUILD_NUMBER
-#define VERSION_AS_NUMBER FLUTTER_BUILD_NUMBER
+#if defined(FLUTTER_VERSION_MAJOR) && defined(FLUTTER_VERSION_MINOR) && defined(FLUTTER_VERSION_PATCH) && defined(FLUTTER_VERSION_BUILD)
+#define VERSION_AS_NUMBER FLUTTER_VERSION_MAJOR,FLUTTER_VERSION_MINOR,FLUTTER_VERSION_PATCH,FLUTTER_VERSION_BUILD
 #else
-#define VERSION_AS_NUMBER 1,0,0
+#define VERSION_AS_NUMBER 1,0,0,0
 #endif
 
-#ifdef FLUTTER_BUILD_NAME
-#define VERSION_AS_STRING #FLUTTER_BUILD_NAME
+#if defined(FLUTTER_VERSION)
+#define VERSION_AS_STRING FLUTTER_VERSION
 #else
 #define VERSION_AS_STRING "1.0.0"
 #endif

flutter_quill_extensions/pubspec.yaml

@@ -19,7 +19,7 @@ dependencies:
   video_player: ^2.4.2
   youtube_player_flutter: ^8.1.1
   gallery_saver: ^2.3.2
-  math_keyboard: ">=0.1.8 <0.3.0"
+  math_keyboard: ^0.2.0
   string_validator: ^1.0.0
   universal_html: ^2.2.1
   url_launcher: ^6.1.9

lib/src/widgets/style_widgets/bullet_point.dart

@@ -4,18 +4,20 @@ class QuillBulletPoint extends StatelessWidget {
   const QuillBulletPoint({
     required this.style,
     required this.width,
+    this.padding = 0,
     Key? key,
   }) : super(key: key);
 
   final TextStyle style;
   final double width;
+  final double padding;
 
   @override
   Widget build(BuildContext context) {
     return Container(
       alignment: AlignmentDirectional.topEnd,
       width: width,
-      padding: const EdgeInsetsDirectional.only(end: 13),
+      padding: EdgeInsetsDirectional.only(end: padding),
       child: Text('•', style: style),
     );
   }

lib/src/widgets/text_block.dart

@@ -152,7 +152,7 @@ class EditableTextBlock extends StatelessWidget {
             onLaunchUrl: onLaunchUrl,
             customLinkPrefixes: customLinkPrefixes,
           ),
-          _getIndentWidth(),
+          _getIndentWidth(context),
           _getSpacingForLine(line, index, count, defaultStyles),
           textDirection,
           textSelection,
@@ -170,45 +170,48 @@ class EditableTextBlock extends StatelessWidget {
 
   Widget? _buildLeading(BuildContext context, Line line, int index,
       Map<int, int> indentLevelCounts, int count) {
-    final defaultStyles = QuillStyles.getStyles(context, false);
+    final defaultStyles = QuillStyles.getStyles(context, false)!;
+    final fontSize = defaultStyles.paragraph?.style.fontSize ?? 16;
     final attrs = line.style.attributes;
+
     if (attrs[Attribute.list.key] == Attribute.ol) {
       return QuillNumberPoint(
         index: index,
         indentLevelCounts: indentLevelCounts,
         count: count,
-        style: defaultStyles!.leading!.style,
+        style: defaultStyles.leading!.style,
         attrs: attrs,
-        width: 32,
-        padding: 8,
+        width: fontSize * 2,
+        padding: fontSize / 2,
       );
     }
 
     if (attrs[Attribute.list.key] == Attribute.ul) {
       return QuillBulletPoint(
         style:
-            defaultStyles!.leading!.style.copyWith(fontWeight: FontWeight.bold),
-        width: 32,
+            defaultStyles.leading!.style.copyWith(fontWeight: FontWeight.bold),
+        width: fontSize * 2,
+        padding: fontSize / 2,
       );
     }
 
     if (attrs[Attribute.list.key] == Attribute.checked) {
       return CheckboxPoint(
-        size: 14,
+        size: fontSize,
         value: true,
         enabled: !readOnly,
         onChanged: (checked) => onCheckboxTap(line.documentOffset, checked),
-        uiBuilder: defaultStyles?.lists?.checkboxUIBuilder,
+        uiBuilder: defaultStyles.lists?.checkboxUIBuilder,
       );
     }
 
     if (attrs[Attribute.list.key] == Attribute.unchecked) {
       return CheckboxPoint(
-        size: 14,
+        size: fontSize,
         value: false,
         enabled: !readOnly,
         onChanged: (checked) => onCheckboxTap(line.documentOffset, checked),
-        uiBuilder: defaultStyles?.lists?.checkboxUIBuilder,
+        uiBuilder: defaultStyles.lists?.checkboxUIBuilder,
       );
     }
 
@@ -217,35 +220,37 @@ class EditableTextBlock extends StatelessWidget {
         index: index,
         indentLevelCounts: indentLevelCounts,
         count: count,
-        style: defaultStyles!.code!.style
+        style: defaultStyles.code!.style
             .copyWith(color: defaultStyles.code!.style.color!.withOpacity(0.4)),
-        width: 32,
+        width: fontSize * 2,
         attrs: attrs,
-        padding: 16,
+        padding: fontSize,
         withDot: false,
       );
     }
     return null;
   }
 
-  double _getIndentWidth() {
+  double _getIndentWidth(BuildContext context) {
+    final defaultStyles = QuillStyles.getStyles(context, false)!;
+    final fontSize = defaultStyles.paragraph?.style.fontSize ?? 16;
     final attrs = block.style.attributes;
 
     final indent = attrs[Attribute.indent.key];
     var extraIndent = 0.0;
     if (indent != null && indent.value != null) {
-      extraIndent = 16.0 * indent.value;
+      extraIndent = fontSize * indent.value;
     }
 
     if (attrs.containsKey(Attribute.blockQuote.key)) {
-      return 16.0 + extraIndent;
+      return fontSize + extraIndent;
     }
 
     var baseIndent = 0.0;
 
     if (attrs.containsKey(Attribute.list.key) ||
         attrs.containsKey(Attribute.codeBlock.key)) {
-      baseIndent = 32.0;
+      baseIndent = fontSize * 2;
     }
 
     return baseIndent + extraIndent;

pubspec.yaml

@@ -1,6 +1,6 @@
 name: flutter_quill
 description: A rich text editor supporting mobile and web (Demo App @ bulletjournal.us)
-version: 7.1.20
+version: 7.2.0
 #author: bulletjournal
 homepage: https://bulletjournal.us/home/index.html
 repository: https://github.com/singerdmx/flutter-quill