Flutter Web issue.

[jodymac]

I am receiving the following in Flutter Web, I'm running the latest beta as of today 5/4/20.

This is running the example after cloning the repo and I have done flutter pub get.

══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY
╞═════════════════════════════════════════════════════════

The following UnimplementedError was thrown during a scheduler callback:

UnimplementedError

When the exception was thrown, this was the stack:

dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 195:49
throw

lib/_engine/engine/shader.dart 52:5
createPaintStyle

lib/_engine/engine/bitmap_canvas.dart 213:23
[_applyPaint]

lib/_engine/engine/bitmap_canvas.dart 338:5
drawCircle

lib/_engine/engine/surface/recording_canvas.dart 983:11
apply

lib/_engine/engine/surface/recording_canvas.dart 79:18
apply

lib/_engine/engine/surface/picture.dart 268:35
paintCallback

lib/_engine/engine/surface/surface.dart 72:14
commitScene

lib/_engine/engine/surface/scene_builder.dart 550:5
build

packages/flutter/src/rendering/layer.dart 808:35
buildScene

packages/flutter/src/rendering/view.dart 230:36
compositeFrame

packages/flutter/src/rendering/binding.dart 406:18
drawFrame

packages/flutter/src/widgets/binding.dart 884:13
drawFrame

packages/flutter/src/rendering/binding.dart 284:5
[_handlePersistentFrameCallback]

packages/flutter/src/scheduler/binding.dart 1113:15
[_invokeFrameCallback]

packages/flutter/src/scheduler/binding.dart 1052:9
handleDrawFrame

packages/flutter/src/scheduler/binding.dart 861:7

dart-sdk/lib/_internal/js_dev_runtime/private/isolate_helper.dart 50:19
internalCallback

════════════════════════════════════════════════════════════════════════════════
════════════════════

Another exception was thrown: UnimplementedError

Another exception was thrown: PersistedOffset: is in an unexpected state.

Flutter Doctor -v returns...
[✓] Flutter (Channel beta, v1.17.0-3.4.pre, on Mac OS X 10.15.4 19E287, locale
en-US)
• Flutter version 1.17.0-3.4.pre at /Users/jody/flutter/flutter
• Framework revision e6b34c2b5c (2 days ago), 2020-05-02 11:39:18 -0700
• Engine revision 540786dd51
• Dart version 2.8.1

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/jody/Library/Android/sdk
• Platform android-29, build-tools 29.0.2
• Java binary at: /Applications/Android
Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build
1.8.0_212-release-1586-b4-5784211)
• All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.4.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 11.4.1, Build version 11E503a
• CocoaPods version 1.9.0

[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 3.6)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 45.1.1
• Dart plugin version 192.7761
• Java version OpenJDK Runtime Environment (build
1.8.0_212-release-1586-b4-5784211)

[✓] VS Code (version 1.44.2)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.10.1

[✓] Connected device (3 available)
• iPhone 8 Plus • D35F92EE-B051-455F-B0C0-EED7EE4225DE • ios •
com.apple.CoreSimulator.SimRuntime.iOS-13-4 (simulator)
• Chrome • chrome • web-javascript •
Google Chrome 81.0.4044.129
• Web Server • web-server • web-javascript •
Flutter Tools

[rydmike]

Hi,

It is the color wheel/circle in the CustomPaint that uses SweepGradient API call that is is not yet implemented in Flutter WEB that causes the crash when this package is used on Flutter Web.

I had a similar issue and reported it here:
flutter/flutter#57752

My report also contains a rough example of how the color wheel/circle can be drawn using alternative API that works on Flutter WEB too. It is included in the above same issue report and can be seen in a DartPad here:
https://dartpad.dartlang.org/dc8a915f169455463e4e2016619e00bb
The DartPad shows this issue alongside a workaround. The example work-around was just a first rough example/draft, it can be cleaned-up and shortened further. The example is MIT license so author of this package is welcome to use it to make a fix for this component too, if you so wish. I don't have time right now to look into the details of this package and make a pull request correction. (I might find some time for it later... depends 😀 )

My above Flutter issue report was a duplicate of an already known issue, the original issue report, that is being tracked by Flutter team, can be found here:
flutter/flutter#41389

---

Sidenote

A Flutter Web demo/example of a color picker that includes a similar wheel/circle component under its "any color" segment in its color picker, can be seen here:
https://rydmike.github.io/colorpickerdemo/#/
It is using the above described work-around to draw the color circle.

This Tweet thread explains its usage scenarios a bit.
https://twitter.com/RydMike/status/1266037341413654531

[itome]

This is already fixed in current stable version(flutter v2.0.4).
Thank you for your reporting!