Skip to content
This repository was archived by the owner on Feb 25, 2025. It is now read-only.

[web] Fix arc rendering when it starts a new sub path. #18535

Merged
merged 3 commits into from
May 20, 2020
Merged

[web] Fix arc rendering when it starts a new sub path. #18535

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a449f12
Fix Path.addArc failure due to incorrect start position
ferhatb May 20, 2020
0d2044d
Remove golden write flag
ferhatb May 20, 2020
f8aa5e6
update golden locks
ferhatb May 20, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions lib/web_ui/lib/src/engine/canvas_pool.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -520,6 +520,11 @@ class _CanvasPool extends _SaveStackTracking {
break;
case PathCommandTypes.ellipse:
final Ellipse ellipse = command;
if (c == 0) {
// Ellipses that start a new path need to set start point,
// otherwise it incorrectly uses last point.
ctx.moveTo(subpath.startX, subpath.startY);
}
Comment on lines +523 to +527
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this not the case for other path command types?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nvm, all other commands assume you are already at some point, and they draw from there.

DomRenderer.ellipse(ctx,
ellipse.x,
ellipse.y,
Expand Down
16 changes: 15 additions & 1 deletion lib/web_ui/test/golden_tests/engine/canvas_arc_golden_test.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

// @dart = 2.6
import 'dart:html' as html;

import 'dart:math' as math;
import 'package:ui/src/engine.dart';
import 'package:ui/ui.dart';
import 'package:test/test.dart';
Expand Down Expand Up @@ -47,6 +47,20 @@ void main() async {
await matchGoldenFile('canvas_arc_to_point.png', region: region);
});

test('Path.addArc that starts new path has correct start point', () async {
final Rect rect = Rect.fromLTWH(20, 20, 200, 200);
final Path p = Path()
..fillType = PathFillType.evenOdd
..addRect(rect)
..addArc(Rect.fromCircle(center: rect.center,
radius: rect.size.shortestSide / 2), 0.25 * math.pi, 1.5 * math.pi);
canvas.drawPath(p, SurfacePaintData()
..color = Color(0xFFFF9800) // orange
..style = PaintingStyle.fill);

html.document.body.append(canvas.rootElement);
await matchGoldenFile('canvas_addarc.png', region: region);
});
}

void paintArc(BitmapCanvas canvas, Offset offset,
Expand Down