Skip to content

Commit d316bd4

Browse files
author
Arjan Mels
committed
Corrected accessibility text scaling
1 parent ed75f8f commit d316bd4

File tree

2 files changed

+45
-88
lines changed

2 files changed

+45
-88
lines changed

‎lib/html_parser.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,7 @@ class HtmlParser extends StatelessWidget {
104104
scrollPhysics: scrollPhysics,
105105
selectionControls: selectionControls,
106106
shrinkWrap: shrinkWrap,
107+
top: true,
107108
);
108109
}
109110

‎lib/src/css_box_widget.dart‎

Lines changed: 44 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ class CssBoxWidget extends StatelessWidget {
1212
this.textDirection,
1313
this.childIsReplaced = false,
1414
this.shrinkWrap = false,
15+
this.top = false,
1516
});
1617

1718
/// Generates a CSSBoxWidget that contains a list of InlineSpan children.
@@ -23,6 +24,7 @@ class CssBoxWidget extends StatelessWidget {
2324
this.childIsReplaced = false,
2425
this.shrinkWrap = false,
2526
bool selectable = false,
27+
this.top = false,
2628
TextSelectionControls? selectionControls,
2729
ScrollPhysics? scrollPhysics,
2830
}) : child = selectable
@@ -55,11 +57,12 @@ class CssBoxWidget extends StatelessWidget {
5557
/// necessarily take up the full available width unless necessary
5658
final bool shrinkWrap;
5759

60+
/// For the root widget, so textScaleFactor etc are only applied once
61+
final bool top;
62+
5863
@override
5964
Widget build(BuildContext context) {
60-
final markerBox = style.listStylePosition == ListStylePosition.outside
61-
? _generateMarkerBoxSpan(style)
62-
: null;
65+
final markerBox = style.listStylePosition == ListStylePosition.outside ? _generateMarkerBoxSpan(style) : null;
6366

6467
return _CSSBoxRenderer(
6568
width: style.width ?? Width.auto(),
@@ -74,14 +77,13 @@ class CssBoxWidget extends StatelessWidget {
7477
shrinkWrap: shrinkWrap,
7578
children: [
7679
Container(
77-
decoration: BoxDecoration(
78-
border: style.border,
79-
color: style.backgroundColor, //Colors the padding and content boxes
80-
),
81-
width: _shouldExpandToFillBlock() ? double.infinity : null,
82-
padding: style.padding ?? EdgeInsets.zero,
83-
child: child,
84-
),
80+
decoration: BoxDecoration(
81+
border: style.border,
82+
color: style.backgroundColor, //Colors the padding and content boxes
83+
),
84+
width: _shouldExpandToFillBlock() ? double.infinity : null,
85+
padding: style.padding ?? EdgeInsets.zero,
86+
child: top ? child : MediaQuery(data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0), child: child)),
8587
if (markerBox != null) Text.rich(markerBox),
8688
],
8789
);
@@ -103,8 +105,8 @@ class CssBoxWidget extends StatelessWidget {
103105
}
104106
}
105107

106-
return RichText(
107-
text: TextSpan(
108+
return Text.rich(
109+
TextSpan(
108110
style: style.generateTextStyle(),
109111
children: children,
110112
),
@@ -148,8 +150,7 @@ class CssBoxWidget extends StatelessWidget {
148150
child: Image.network(
149151
style.listStyleImage!.uriText,
150152
errorBuilder: (_, __, ___) {
151-
if (style.marker?.content.replacementContent?.isNotEmpty ??
152-
false) {
153+
if (style.marker?.content.replacementContent?.isNotEmpty ?? false) {
153154
return Text.rich(
154155
TextSpan(
155156
text: style.marker!.content.replacementContent!,
@@ -180,14 +181,10 @@ class CssBoxWidget extends StatelessWidget {
180181
/// width available to it or if it should just let its inner content
181182
/// determine the content-box's width.
182183
bool _shouldExpandToFillBlock() {
183-
return (style.display == Display.block ||
184-
style.display == Display.listItem) &&
185-
!childIsReplaced &&
186-
!shrinkWrap;
184+
return (style.display == Display.block || style.display == Display.listItem) && !childIsReplaced && !shrinkWrap;
187185
}
188186

189-
TextDirection _checkTextDirection(
190-
BuildContext context, TextDirection? direction) {
187+
TextDirection _checkTextDirection(BuildContext context, TextDirection? direction) {
191188
final textDirection = direction ?? Directionality.maybeOf(context);
192189

193190
assert(
@@ -321,9 +318,7 @@ class _CSSBoxRenderer extends MultiChildRenderObjectWidget {
321318

322319
/// Implements the CSS layout algorithm
323320
class _RenderCSSBox extends RenderBox
324-
with
325-
ContainerRenderObjectMixin<RenderBox, CSSBoxParentData>,
326-
RenderBoxContainerDefaultsMixin<RenderBox, CSSBoxParentData> {
321+
with ContainerRenderObjectMixin<RenderBox, CSSBoxParentData>, RenderBoxContainerDefaultsMixin<RenderBox, CSSBoxParentData> {
327322
_RenderCSSBox({
328323
required Display display,
329324
required Width width,
@@ -432,13 +427,11 @@ class _RenderCSSBox extends RenderBox
432427
}
433428
}
434429

435-
static double getIntrinsicDimension(RenderBox? firstChild,
436-
double Function(RenderBox child) mainChildSizeGetter) {
430+
static double getIntrinsicDimension(RenderBox? firstChild, double Function(RenderBox child) mainChildSizeGetter) {
437431
double extent = 0.0;
438432
RenderBox? child = firstChild;
439433
while (child != null) {
440-
final CSSBoxParentData childParentData =
441-
child.parentData! as CSSBoxParentData;
434+
final CSSBoxParentData childParentData = child.parentData! as CSSBoxParentData;
442435
extent = math.max(extent, mainChildSizeGetter(child));
443436
assert(child.parentData == childParentData);
444437
child = childParentData.nextSibling;
@@ -448,26 +441,22 @@ class _RenderCSSBox extends RenderBox
448441

449442
@override
450443
double computeMinIntrinsicWidth(double height) {
451-
return getIntrinsicDimension(
452-
firstChild, (RenderBox child) => child.getMinIntrinsicWidth(height));
444+
return getIntrinsicDimension(firstChild, (RenderBox child) => child.getMinIntrinsicWidth(height));
453445
}
454446

455447
@override
456448
double computeMaxIntrinsicWidth(double height) {
457-
return getIntrinsicDimension(
458-
firstChild, (RenderBox child) => child.getMaxIntrinsicWidth(height));
449+
return getIntrinsicDimension(firstChild, (RenderBox child) => child.getMaxIntrinsicWidth(height));
459450
}
460451

461452
@override
462453
double computeMinIntrinsicHeight(double width) {
463-
return getIntrinsicDimension(
464-
firstChild, (RenderBox child) => child.getMinIntrinsicHeight(width));
454+
return getIntrinsicDimension(firstChild, (RenderBox child) => child.getMinIntrinsicHeight(width));
465455
}
466456

467457
@override
468458
double computeMaxIntrinsicHeight(double width) {
469-
return getIntrinsicDimension(
470-
firstChild, (RenderBox child) => child.getMaxIntrinsicHeight(width));
459+
return getIntrinsicDimension(firstChild, (RenderBox child) => child.getMaxIntrinsicHeight(width));
471460
}
472461

473462
@override
@@ -483,9 +472,7 @@ class _RenderCSSBox extends RenderBox
483472
).parentSize;
484473
}
485474

486-
_Sizes _computeSize(
487-
{required BoxConstraints constraints,
488-
required ChildLayouter layoutChild}) {
475+
_Sizes _computeSize({required BoxConstraints constraints, required ChildLayouter layoutChild}) {
489476
if (childCount == 0) {
490477
return _Sizes(constraints.biggest, Size.zero);
491478
}
@@ -504,14 +491,10 @@ class _RenderCSSBox extends RenderBox
504491
final childConstraints = constraints.copyWith(
505492
maxWidth: (this.width.unit != Unit.auto)
506493
? this.width.value
507-
: containingBlockSize.width -
508-
(margins.left?.value ?? 0) -
509-
(margins.right?.value ?? 0),
494+
: containingBlockSize.width - (margins.left?.value ?? 0) - (margins.right?.value ?? 0),
510495
maxHeight: (this.height.unit != Unit.auto)
511496
? this.height.value
512-
: containingBlockSize.height -
513-
(margins.top?.value ?? 0) -
514-
(margins.bottom?.value ?? 0),
497+
: containingBlockSize.height - (margins.top?.value ?? 0) - (margins.bottom?.value ?? 0),
515498
minWidth: (this.width.unit != Unit.auto) ? this.width.value : 0,
516499
minHeight: (this.height.unit != Unit.auto) ? this.height.value : 0,
517500
);
@@ -522,18 +505,14 @@ class _RenderCSSBox extends RenderBox
522505

523506
// Calculate used values of margins based on rules
524507
final usedMargins = _calculateUsedMargins(childSize, containingBlockSize);
525-
final horizontalMargins =
526-
(usedMargins.left?.value ?? 0) + (usedMargins.right?.value ?? 0);
527-
final verticalMargins =
528-
(usedMargins.top?.value ?? 0) + (usedMargins.bottom?.value ?? 0);
508+
final horizontalMargins = (usedMargins.left?.value ?? 0) + (usedMargins.right?.value ?? 0);
509+
final verticalMargins = (usedMargins.top?.value ?? 0) + (usedMargins.bottom?.value ?? 0);
529510

530511
//Calculate Width and Height of CSS Box
531512
height = childSize.height;
532513
switch (display) {
533514
case Display.block:
534-
width = (shrinkWrap || childIsReplaced)
535-
? childSize.width + horizontalMargins
536-
: containingBlockSize.width;
515+
width = (shrinkWrap || childIsReplaced) ? childSize.width + horizontalMargins : containingBlockSize.width;
537516
height = childSize.height + verticalMargins;
538517
break;
539518
case Display.inline:
@@ -545,9 +524,7 @@ class _RenderCSSBox extends RenderBox
545524
height = childSize.height + verticalMargins;
546525
break;
547526
case Display.listItem:
548-
width = shrinkWrap
549-
? childSize.width + horizontalMargins
550-
: containingBlockSize.width;
527+
width = shrinkWrap ? childSize.width + horizontalMargins : containingBlockSize.width;
551528
height = childSize.height + verticalMargins;
552529
break;
553530
case Display.none:
@@ -572,12 +549,10 @@ class _RenderCSSBox extends RenderBox
572549
assert(firstChild != null);
573550
RenderBox child = firstChild!;
574551

575-
final CSSBoxParentData childParentData =
576-
child.parentData! as CSSBoxParentData;
552+
final CSSBoxParentData childParentData = child.parentData! as CSSBoxParentData;
577553

578554
// Calculate used margins based on constraints and child size
579-
final usedMargins =
580-
_calculateUsedMargins(sizes.childSize, constraints.biggest);
555+
final usedMargins = _calculateUsedMargins(sizes.childSize, constraints.biggest);
581556
final leftMargin = usedMargins.left?.value ?? 0;
582557
final topMargin = usedMargins.top?.value ?? 0;
583558

@@ -610,13 +585,8 @@ class _RenderCSSBox extends RenderBox
610585
RenderBox? markerBox = childParentData.nextSibling;
611586
if (markerBox != null) {
612587
final markerBoxParentData = markerBox.parentData! as CSSBoxParentData;
613-
final distance = (child.getDistanceToBaseline(TextBaseline.alphabetic,
614-
onlyReal: true) ??
615-
0) +
616-
topOffset;
617-
final offsetHeight = distance -
618-
(markerBox.getDistanceToBaseline(TextBaseline.alphabetic) ??
619-
markerBox.size.height);
588+
final distance = (child.getDistanceToBaseline(TextBaseline.alphabetic, onlyReal: true) ?? 0) + topOffset;
589+
final offsetHeight = distance - (markerBox.getDistanceToBaseline(TextBaseline.alphabetic) ?? markerBox.size.height);
620590
markerBoxParentData.offset = Offset(-markerBox.size.width, offsetHeight);
621591
}
622592
}
@@ -648,8 +618,7 @@ class _RenderCSSBox extends RenderBox
648618
// width of the containing block, then consider left and right margins to
649619
// have a 0 value.
650620
if (!widthIsAuto) {
651-
if ((childSize.width + marginLeft.value + marginRight.value) >
652-
containingBlockSize.width) {
621+
if ((childSize.width + marginLeft.value + marginRight.value) > containingBlockSize.width) {
653622
//Treat auto values of margin left and margin right as 0 for following rules
654623
marginLeft = Margin(0);
655624
marginRight = Margin(0);
@@ -661,22 +630,16 @@ class _RenderCSSBox extends RenderBox
661630
// If all values are non-auto, the box is overconstrained.
662631
// One of the margins will need to be adjusted so that the
663632
// entire width of the containing block is used.
664-
if (!widthIsAuto &&
665-
!marginLeftIsAuto &&
666-
!marginRightIsAuto &&
667-
!shrinkWrap &&
668-
!childIsReplaced) {
633+
if (!widthIsAuto && !marginLeftIsAuto && !marginRightIsAuto && !shrinkWrap && !childIsReplaced) {
669634
//Ignore either left or right margin based on textDirection.
670635

671636
switch (textDirection) {
672637
case TextDirection.rtl:
673-
final difference =
674-
containingBlockSize.width - childSize.width - marginRight.value;
638+
final difference = containingBlockSize.width - childSize.width - marginRight.value;
675639
marginLeft = Margin(difference);
676640
break;
677641
case TextDirection.ltr:
678-
final difference =
679-
containingBlockSize.width - childSize.width - marginLeft.value;
642+
final difference = containingBlockSize.width - childSize.width - marginLeft.value;
680643
marginRight = Margin(difference);
681644
break;
682645
}
@@ -686,12 +649,10 @@ class _RenderCSSBox extends RenderBox
686649
if (widthIsAuto && !marginLeftIsAuto && !marginRightIsAuto) {
687650
widthIsAuto = false;
688651
} else if (!widthIsAuto && marginLeftIsAuto && !marginRightIsAuto) {
689-
marginLeft = Margin(
690-
containingBlockSize.width - childSize.width - marginRight.value);
652+
marginLeft = Margin(containingBlockSize.width - childSize.width - marginRight.value);
691653
marginLeftIsAuto = false;
692654
} else if (!widthIsAuto && !marginLeftIsAuto && marginRightIsAuto) {
693-
marginRight = Margin(
694-
containingBlockSize.width - childSize.width - marginLeft.value);
655+
marginRight = Margin(containingBlockSize.width - childSize.width - marginLeft.value);
695656
marginRightIsAuto = false;
696657
}
697658

@@ -712,8 +673,7 @@ class _RenderCSSBox extends RenderBox
712673
//If both margin-left and margin-right are auto, their used values are equal.
713674
// This horizontally centers the element within the containing block.
714675
if (marginLeftIsAuto && marginRightIsAuto) {
715-
final newMargin =
716-
Margin((containingBlockSize.width - childSize.width) / 2);
676+
final newMargin = Margin((containingBlockSize.width - childSize.width) / 2);
717677
marginLeft = newMargin;
718678
marginRight = newMargin;
719679
marginLeftIsAuto = false;
@@ -724,11 +684,7 @@ class _RenderCSSBox extends RenderBox
724684
assert(!marginLeftIsAuto && !marginRightIsAuto && !widthIsAuto);
725685
}
726686

727-
return Margins(
728-
left: marginLeft,
729-
right: marginRight,
730-
top: margins.top,
731-
bottom: margins.bottom);
687+
return Margins(left: marginLeft, right: marginRight, top: margins.top, bottom: margins.bottom);
732688
}
733689

734690
@override

0 commit comments

Comments
 (0)