Add SKAnimatedSurfaceView for Blazor

[Copilot]

Extracts the animated surface view concept into its own focused PR, introducing SkiaSharp.Extended.UI.Blazor — a new Blazor library with SKAnimatedSurfaceView, the Blazor equivalent of the MAUI SKAnimatedSurfaceView pattern.

New library: SkiaSharp.Extended.UI.Blazor

• SKAnimatedSurfaceView — ~60fps PeriodicTimer render loop component built on SKCanvasView. Exposes IsAnimationEnabled, OnUpdate, and OnPaintSurface callbacks for frame-by-frame animation.

<SKAnimatedSurfaceView IsAnimationEnabled="@isPlaying"
                       OnUpdate="HandleUpdate"
                       OnPaintSurface="HandlePaint"
                       style="width: 400px; height: 400px;" />

• Subclass and override UpdateAsync(TimeSpan) for reusable animated components; OnUpdate/OnPaintSurface callbacks cover the delegate use-case without subclassing.
• Cleans up the PeriodicTimer loop via IAsyncDisposable.
• FPS debug overlay — matches the MAUI SKAnimatedSurfaceView pattern: a #if DEBUG overlay draws the current frame rate in the top-left corner of the canvas after the user's paint callback, using SKFrameCounter for a rolling-average FPS calculation.

Base lib: SkiaSharp.Extended

• SKFrameCounter moved from SkiaSharp.Extended.UI.Maui into the base SkiaSharp.Extended library (Internals/SKFrameCounter.cs), shared via InternalsVisibleTo with both the MAUI and Blazor libraries.

Blazor sample

New /animatedsurface demo page showing pause/resume and speed control, with the FPS overlay visible in debug builds:

Other

• tests/SkiaSharp.Extended.UI.Blazor.Tests/ — unit tests for default params, IsAnimationEnabled toggle, and OnUpdate callback
• docs/docs/animated-surface-blazor.md — API reference and usage guide
• Solution and sample project references updated

Original prompt

Can you look at #365 and extract the animated surface view into a separate pr wit code, samples, tests and docs.

Have a look at ways to improve and fix the bugs.

One feature we need to add is a way to swap out the canvas view with a gl view in the razor. This needs to be a feature on the sample so the animated surface view should handle both. It would be up to the sample/consumer to decide what underlying view.

This is sort of what the Maui app did with the control template.

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

[mattleibow]

@copilot let's drop the gl selection stuff. We can add it later. Let's focus on the animation view and get that ready.

[mattleibow]

@copilot look at the Maui animated view and add the debug overlay and fps. You may need to move some utils out of the Maui lib into the base lib.

[Copilot]

@copilot let's drop the gl selection stuff. We can add it later. Let's focus on the animation view and get that ready.

Done in 8376df2. Dropped all GL/UseGL code from SKAnimatedSurfaceView, the sample, tests, and docs. The component is now canvas-only with a clean PeriodicTimer animation loop.

[Copilot]

@copilot look at the Maui animated view and add the debug overlay and fps. You may need to move some utils out of the Maui lib into the base lib.

Done in c779d11. SKFrameCounter has been moved from the MAUI lib into the base SkiaSharp.Extended lib (Internals/SKFrameCounter.cs) with InternalsVisibleTo for both MAUI and Blazor. The Blazor SKAnimatedSurfaceView now uses it for delta tracking and exposes a #if DEBUG FPS overlay drawn after the user's paint callback — matching the MAUI pattern (WriteDebugStatus($"FPS: {frameCounter.Rate:0.0}")):